멋사 부트캠프 프론트엔드 플러스 5기 - Supabase & 클린 아키텍처 - (9일차)

Supabase

★ Supabase 실행 순서

1. Supabase 계정 생성 및 로그인
2. 새로운 프로젝트 만들기
3. 설치 명령어 실행 
4. Supabase 대시보드에서 SQL 쿼리 작성해서 테이블 생성

★ Supabase 서비스

• Database : PostgreSQL 기반 데이터 베이스, 오픈소스 관계형 데이터베이스
• Auth : 사용자 인증 및 관리, 사용자 로그인을 구현
• Storage : 파일 저장 및 관리를 위한 서비스, 파일이나 문서 등 업로드하고 관리 가능

★ supabase 설치

• 명령어설치시 env(환경변수) 파일 생성
• $ npm install @supabase/ssr @supabase @supabase/supabase-js

https://supabase.com/docs/guides/getting-started/quickstarts/nextjs 공식문서 참고

★ next.js에서 route

일반적으로 파일, 페이지 라우트도 있지만 서버에서 실행되는 API 엔드포인트 역할도 있다.

• 데이터베이스 통신: 사용자 정보 조회, 게시글 저장 등
• 인증 처리: 로그인, 회원가입 등
• 파일 업로드: 이미지나 문서 파일 업로드 처리
• 외부 API 연동: 다른 서비스에서 데이터를 가져오거나 보내는 작업
• 스트리밍 응답: 대용량 데이터를 효율적으로 처리

---

클린 아키텍처

★  아키텍처 구조

• 업무로직 : 시스템이나 프로그램이 어떻게 작동해야 하는지에 대한 규칙이나 절차
• 객체지향 : 객체라는 작은 단위로 쪼개서 생각하고,
  이 객체들이 서로 상호작용하면서 프로그램을 만드는 방식(책임을 나눈다라고 생각하면 됀다.)

★  서비스 계층 분리

• DTO = 객체를 주고 받는 페이지
• 페이지 : 사용자에게 보여지는 페이지
• 서비스(*유즈케이스) : 업무로직에 해당한다. (좋아요, 예약 등..)
  *유즈케이스 : 서비스를 기능별로 파일로 쪼개준다.
  사용자가 요청하는 행위 (기능의 단위) 수정없이 추가와 제거가 용이하여 유지보수에 좋다.
• 리포지토리 : 사용자가 요청한 것을 받아주는 CRUD에 해당한다.

★  5대 최신 아키텍쳐

• Hexagonal Architecture : 육각형 아키텍처, 내부 도메인 로직과 외부 시스템(데이터베이스, UI, API 등)을 분리해서,
  의존성을 역전시키는 구조  
• Onion Architecture  : 양파 아키텍처, 양파처럼 핵심 도메인을 중심에 두고,
  바깥쪽으로 인프라, UI, 데이터베이스 같은 외부 요소들이 계층적으로 둘러싸는 구조
• Domain-Driven Design (DDD) or Domain Centric Architecture :
  도메인(비즈니스 영역) 모델을 중심으로 설계하는 방법론이자 아키텍처
• Vertical Slice Architecture : 기능 단위(수직 슬라이스)로 애플리케이션을 나누는 방식
• Clean Architecture : 로버트 C. 마틴 아키텍처로,
  의존성 규칙에 따라 안쪽(비즈니스 규칙)과 바깥쪽(외부 인터페이스)을 엄격히 분리,
  유지보수성과 테스트 용이성이 극대화된 설계 방식

 

★  클린 아키텍쳐

클린 아키텍처 구조 이미지

★  클린아키텍처 4계층

도메인(Domain)	비즈니스 핵심 로직과 규칙이 담긴 곳
어플리케이션(Application)	도메인 객체를 활용해 실제 유스케이스(Use Case)를 구현하는 계층, 업무 로직에 해당(리뷰, 주문, 채팅 등..)
인터페이스 어댑터(Interface Adapters)	도메인과 어플리케이션 계층을 외부 시스템과 연결(Next.js에서 route가 해당)
인프라스트럭쳐(Infrastructure)	실제 외부 시스템과 직접 통신하는 계층이며 데이터베이스, 파일 시스템, 네트워크, 외부 API 등과 연결되는 구체적인 구현체

 

• 의존성 규칙(Dependency Injection, DI ) : 필요한 객체를 직접 만들지 않고 외부에서 주입받는 방법
• 제어반전 (IOC) : 일반적인 객체의 흐름은 순차적이다.(위의 이미지에서 가장 바깥쪽으로 부터 A>B>C>D)
  하지만 객체를 만들고 관리하는 제어권이 역전되어 의존성을 주입해야하는 경우
  [A>B>C>(의존 주입)>D]이지만 실질적으로 순차적으로 흐르며
  클린아키텍쳐 4계층으로 보면 아래 표에 해당한다.

A : 인프라스트럭쳐

B : 인터페이스 어댑터

C : 어플리케이션

D : 도메인

의존 주입 : 레포지토리

 

 

회고 : 클린 아키텍처의 계층은 어느정도 이해가 되었으나

역제어나 의존성 주입같은 경우는 자료만으로는 이해가 어려워서

프로젝트하면서 실습으로 천천히 이해해야할 필요가 있다.

그리고 용어와 뜻이 있을 때, 그 안에서도 다른 어려운 단어가 있고

이해하기 위해 쉽게 풀어내는 과정이 쉽지 않았다.