[개인 프로젝트 Lottodolist] 모노레포 환경에 Docker 연동하기

규갓 God Gyu·2025년 4월 7일
프로젝트
1

프로젝트

목록 보기
80/81

원래는 crud의 기초만 시도해보려했으나, docker 세팅을 먼저 해보고 싶어서 그 내용을 담아봤다.(처음 기록엔 crud를 위한 기록을 해놨음)

lottolist/
├── apps/
│   ├── web/ (Next.js 프론트엔드)
│   └── api/ (NestJS 백엔드)
└── packages/
├── database/ (Prisma 및 데이터베이스 관련 코드)
└── ui/ (공용 UI 컴포넌트)

현재 프로젝트 구조는 이렇게 되어있고

기본적인 세팅은 얼추 끝냈으니 당연하게도 작동이 잘되는지 풀스텍을 연동해서 게시글 만들기라도 하나 진행을 해봐야겠다

packages/prisma에 있는 schema.prisma 파일 안에

generator client { provider = "prisma-client-js" }

datasource db { provider = "postgresql" url = env("DATABASE_URL") }

model Post { id String @id @default(uuid()) title String content String createdAt DateTime @default(now()) updatedAt DateTime @updatedAt }

이런식으로 초기 스키마 파일 내용을 구성했는데

  • generator client { provider = ‘prisma-client-js’} : 프리즈마 client JS 라이브러리
  • datasource db { provider = “postgresql” url = env(”DATABASE_URL”) } : PostgreSQL 데이터베이스를 사용하고, 연결 URL은 따로 지정한 환경변수에서 가져올 예정
  • Post 모델
    • id - UUID형식 문자열, 기본 키(primary key)
    • title - 제목 문자열
    • content - 이건.. 그냥 투두리스트만 성공하면 되기에 제목만 필요하면 되지 않나? 라는 생각이 드는데.. 일단은 제거하고 진행해보자
    • createdAt - 생성 시간, 기본 값 현재
    • updatedAt - 수정 시간, 업데이트될 때마다 자동 갱신

추후 디테일한 내용은 테스트 이후 서서히 추가할 예정

ex - 카테고리, 상태 같은 정보

이후 packages/database/src/index.ts에서

import { PrismaClient } from '@prisma/client';

const prismaClientSingleton = () => {
  return new PrismaClient();
};

declare global {
  var prisma: undefined | ReturnType<typeof prismaClientSingleton>;
}

export const prisma = globalThis.prisma ?? prismaClientSingleton();

if (process.env.NODE_ENV !== 'production') globalThis.prisma = prisma;

export * from '@prisma/client';

해당 내용을 기입하는데,

싱글톤 패턴으로 작성되었다

  • 싱글톤패턴
    • 소프트웨어 디자인 패턴 중 하나, 특정 클래스의 인스턴스가 애플리케이션 전체에서 오직 하나만 존재하도록 보장하는 패턴. 이 패턴은 전역적으로 접근 가능한 하나의 인스턴스를 제공
    • 클래스의 인스턴스가 오직 하나만 생성
      • 클래스 - 객체를 만들기 위한 템플릿, 청사진
      • 인스턴스 - 클래스 기반으로 실제 메모리에 할당된 객체
      • ex - 클래스 : 자동차(설계도)
      • ex - 인스터스:실제 도로 위에 있는 특정 자동차
    • 이미 생성된 인스턴스 있으면 새 인스턴스 만들지 않고 기존 인스턴스 반환
    • 애플리케이션 어디서든 동일한 인스턴스 접근 가능

import로 PrismaClient 즉 Prisma가 생성한 클라이언트 가져옴

const prismaClientSingleton = () => { return new PrismaClient(); };

PrismaClient의 새 인스턴스 생성

declare global { var prisma: undefined | ReturnType<typeof prismaClientSingleton>; }

전역 타입 선언하는데, globalThis.prisma의 타입이 먼지 알려줌

export const prisma = globalThis.prisma ?? prismaClientSingleton();

이미 전역 객체에 prisma 있으면 그것 사용하고, 없으면 새로 생성

그러면 애플리케이션 전체에서 단일 Prisma인스턴스 공유할 수 있음

여기서 Prisma는 node와 ts 애플리케이션에서 데이터베이스 작업 쉽게 해주는 ORM 도구여서 사용했는데

드디어 전에 적용하려다 안하던 DOCKER를 적용할 수 있게 되었다

Docker - 애플리케이션을 컨테이너라는 격리된 환경에서 실행하게 해주는 도구

컨테이너는 독립적이고 일관된 환경 제공

  • 환경 일관성 - 모든 컴퓨터에서 동일하게 작동
  • 격리 - 다른 시스템 환경에 영향 주지 않음
  • 이식성 - 어느 환경에서든 동일하게 실행 가능
  • 버전 관리 - 특정 버전 소프트웨어 고정하여 사용 가능

그래서 이 Docker를 사용하는 이유는 db인 PostgreSQL을 실행하기 위해서 인데,

  • 쉬운 설치 - PostgreSQL을 시스템에 직접 설치할 필요 없음
  • 격리된 환경 - 개발용 데이터베이스가 다른 시스템과 충돌하지 않음
  • 일관된 설정 - 모든 개발자가 동일한 데이터베이스 설정 사용 가능
  • 쉬운 재설정 - 문제 발생 시 컨테이너 다시 시작하면 됨

일단 오늘은 도커 설치까지~

집가서 또 할수도있긴함

docker 를 이용하면코드 배송,테스트, 배포 시 실제 운영환경에서 실행하는 사이의 지연 시간을 크게 줄일 수 있다

일단 docker를 적용하기 위해 루트 디렉토리에 docker-compose.yml 파일을 생성해서

`version: '3.8'
services:
postgres:
image: postgres:latest
container_name: lotto-postgres
environment:
POSTGRES_USER: postgres
POSTGRES_PASSWORD: postgres
POSTGRES_DB: lottodb
ports:

  • "5432:5432"
    volumes:
  • postgres-data:/var/lib/postgresql/data`

volumes: postgres-data:

이런 내용을 채우라는데 처음써보니 분석이 필요하다

YAML

YAML Ain’t Markup Language 의 약자, 데이터를 표현하기 위한 간단한 형식

사람이 읽기 쉽게 설계, 구성 파일에 자주 사용

들여쓰기와콜론을 사용하여 데이터의 계층 구조 나타냄

Docker Compose

여러 Docker컨테이너 정의하고 실행 위한 파일

여러 컨테이너 한번에 관리할 수 있게 해줌

컨테이너 - 독립된 환경에서 앱을 실행하는 가상화된 공간

version: '3.8' -- 강의에선 버전 적을 필요없다곤했는데 상관없을듯

services: 실행할 컨테이너들을 정의

PostgreSQL 데이터베이스 서비스

postgres:
image: postgres:latest
container_name: lottodolist-postgres
environment:
POSTGRES_USER: postgres
POSTGRES_PASSWORD: postgres
POSTGRES_DB: lottodolistdb
ports:
- "5432:5432"
volumes:
- postgres-data:/var/lib/postgresql/data
networks:
- lotto-network

postgres:latest 이미지를 사용

컨테이너 이름은 lottodolist-postgres로 지정

데이터베이스 계정/비밀번호/DB이름도 여기서 설정

근데 단계적으로 하나씩 세팅할 것이기에 lotto번호는 일단 제쳐두고 post관련 세팅으로 다시 구현해봤다.

postgres:
image: postgres:latest
container_name: post-postgres
environment:
POSTGRES_USER: postgres
POSTGRES_PASSWORD: postgres
POSTGRES_DB: postdb
ports:

  • "5432:5432"
    volumes:
  • postgres-data:/var/lib/postgresql/data
    networks:
  • post-network

이후 추가적인 내용을 정리하자면

포트 5432(호스트):5432(컨테이너)연결-컴퓨터의 5432포트 접속 시 컨테이너 내부 DB로 연결된단 의미

postgres-data는 볼륨에 데이터를 저장한다는 의미로 컨테이너 삭제해도 데이터 유지시킬 수 있음

post-network - 다른 컨테이너와 통신 위해 해당 네트워크에 속한다는 의미

==============================

API 서버(NestJS)

api:
build:
context: .
dockerfile: ./apps/api/Dockerfile
container_name: post-api
ports:

  • "3001:3000"
    depends_on:
  • postgres
    environment:
  • DATABASE_URL=postgresql://postgres:postgres@postgres:5432/postdb?schema=public
  • NODE_ENV=development
    volumes:
  • ./apps/api:/app/apps/api
  • ./packages:/app/packages
  • node_modules_api:/app/node_modules
    networks:
  • post-network

=============================

./apps/api/Dockerfile 생성했고 그 내용을 이용해서 이미지를 빌드한다 생각하면 된다.

지금은 컨테이너를 하나만 사용할거라 post관련된 post-api만 사용해볼 예정

포트는 백쪽이기에 3001(호스트):3000(컨테이너)로 연결

depends_on 의존성 관련된 내용같아서 postgres가 먼저 실행된 후에 이 서비스 시작하겠다는 의미

환경변수는 아직 지금 단계에선 건들건 아닌 것 같음

여기서의 볼륨 마운트는 소스코드 연결해주는건데 코드 수정 시 실시간 반영시켜준다고 함

그리고 디렉토리에서 네트워크 설정한 곳에 속한다고 네트워크까지 설정해준 모습

웹 프론트엔드(Next.js)

web:
build:
context: .
dockerfile: ./apps/web/Dockerfile
container_name: post-web
ports:

  • "3000:3000"
    depends_on:
  • api
    environment:
  • NEXT_PUBLIC_API_URL=http://api:3000
  • NODE_ENV=development
    volumes:
  • ./apps/web:/app/apps/web
  • ./packages:/app/packages
  • node_modules_web:/app/node_modules
    networks:
  • post-network

volumes:
postgres-data:
node_modules_api:
node_modules_web:

networks:
post-network:
driver: bridge

이미지 빌드는 비슷하게 ./apps/web/Dockerfile로 파일 생성

컨테이너 이름은 다 연관되어있긴하지만 구분 지을 수 있게 post-web

depends_on은 백코드가 먼저 실행 후에 서비스 시작하도록 세팅

볼륨 정의

volumes:
postgres-data:
node_modules_api:
node_modules_web:

볼륨엔 어떤 내용을 담을지 아직 모르겠음

일반적으로는 postgres-data ⇒ db데이터 보존

node 이런건 각 서비스의 node_modules 보존을 위해 적는 듯

네트워크 정의

networks:
post-network:
driver: bridge

bridge는 기본 네트워크 유형 타입

이렇게 구분지어서 설정하면

마이크로서비스 구조 - DB, 백엔드, 프론트엔드 분리해 각각 독립적 개발/배포가 가능

개발 편의성 - 코드 변경 시 볼륨 마운트로 실시간 반영 가능

의존성 관리 - depends_on으로 실행 순서 지정 DB→API→웹

환경 일관성 - 개발자 모두(물론 난 혼자) 동일한 개발 환경 사용 가능

데이터 지속성 - 볼륨으로 컨테이너 재시작해도 데이터 유지시킴

이제 POST 게시 테스트를 위해서

NestJS 백엔드

  1. Post 엔티티 만들기(제목, 내용,작성자,날짜 등)
  2. Post 모듈, 컨트롤러, 서비스 만들기
  3. CRUD API 엔드포인트 구현(게시물 생성, 조회, 수정,삭제)

Next.js 프론트

  1. 게시물 목록 페이지
  2. 게시물 작성 폼
  3. 게시물 상세보기
  4. 게시물 수정/삭제 인터페이스

일단 이중에 게시물 작성하고 보는것 먼저 시도해볼 것 같다.

일단

Dockerfile은

FROM node:18-alpine

WORKDIR /app

COPY package*.json ./

RUN pnpm install

COPY . .

EXPOSE 3000

CMD ["[pnpm", "run", "dev"]

web/api 둘다 이렇게 세팅해주고

Docker Desktop을 실행하고

터미널에서 docker-compose up 으로 실행을 진행해봤더니 에러가 발생했다

$ docker-compose up
time="2025-04-04T17:30:51+09:00" level=warning msg="C:\\Users\\gyp93\\Desktop\\mingyu\\lottolist\\docker-compose.yml: the attribute version is obsolete, it will be ignored, please remove it to avoid potential confusion"
[+] Running 10/14
...
...
...
...
=> ERROR [api 4/5] RUN pnpm install 0.5s

> [api 4/5] RUN pnpm install:
0.412 /bin/sh: pnpm: not found
> 

---

failed to solve: process "/bin/sh -c pnpm install" did not complete successfully: exit code: 127

FROM node:18-alpine

WORKDIR /app

RUN npm install -g pnpm

COPY package*.json ./

RUN pnpm install

COPY . .

EXPOSE 3000

CMD ["pnpm", "run", "start:dev"]

이렇게 pnpm을 추가를 안해서 문제가 발생한거라 설치하는걸 추가해주었다

docker-compose up 명령어를 실행했을 때 수우우우우우많은 에러를 겪었는데

  1. pnpm
    Dockerfile에 node가 기본 npm을 제공하기에 pnpm패키지 매니저를 사용할거면 설치를 진행시켜줬어야했다. RUN npm install -g pnpm 그래서 이 명령어를 추가해서 해결하였다
  2. 경로 오류
    docker-compose.yml에서 API 서비스 context 경로 오류가 있었다. 
api:
build:
context: .apps/api  # 오타: .apps/api가 아닌 ./apps/api여야 함
  1. 의존성 문제
    빌드 진행 시 API 컨테이너에서 NestJS CLI를 찾을 수 없었음 Dockerfile에서 @nestjs/cli 전역 설치 추가해서 해결함
  2. 볼륨 마운트 이슈
    로컬 디렉토리 마운트가 컨테이너 내부의 node_modules를 덮어씌워서 컨테이너 내부 node_modules 보존하게 조치했음

그래서 현재 웹 서비스Nest.js는 정상적으로 로컬호스트 3000번에서 잘 실행이 되고
API서비스인 NestJS는 TS오류가 발생중이다

  • packages/database 및 packages/ui에서 의존성 오류
  • @prisma/client를 찾을 수 없음
  • react 모듈을 찾을 수 없음
  • jsx 플래그 관련 오류

해당 부분은 내일 혹은 다음주에 건들여서 다시 해결해보도록 하겠다.. 하 도커 이 요물녀석..

==================================

prisma찾을 수 없음

지금 내 폴더 구조는 모노레포 구조에 web/api/database 나눠놨는데

api에서 prisma가 없고 지금 현재는 web/api의 Dockerfile만 작성해놨기 때문에 prisma를 찾을 수 없는건 당연한 거였다.

근데 찾다보니

image.png

docker-compose.yml에서 api쪽의 볼륨에서 이미 packages쪽을 추가시켜놨는데 컨테이너 내부에 추가가 안되고 있던건 확실히 문제상황이다

일단은 당장 문제 해결을 위해

## packages/database 폴더에서 의존성 설치
cd /app/packages/database
pnpm install

## 설치 후 다시 시도
npx prisma db push

이 방법으로 성공하긴 했다

수동 성공이였기에 원인을 찾아보자면

  1. 볼륨 마운트
    Docker 컨테이너에 로컬 폴더를 볼륨으로 마운트할 때 node_modules가 처리되지 않은 듯 함
  2. 빌드 프로세스
    Dockerfile에서 pnpm install을 실행했지만, 모노레포의 모든 패키지 의존성이 설치되지 않았을 가능성

어쨋든 prisma는 api쪽에서 사용해야할 기능이고,(아직 web쪽은 모르겟음) ui는 web쪽에서 사용해야할 패키지인데 그걸 설치를 하기위해 각각 web,api의 Dockerfile에서 해줘야 진행이 될것같다고 생각함

FROM node:18-alpine
WORKDIR /app

RUN npm install -g pnpm

COPY . .

RUN cd /app/packages/ui && pnpm install

RUN pnpm install

EXPOSE 3000

CMD ["pnpm", "run", "dev"]

웹쪽엔 ui쪽 패키지 설치 추가

FROM node:18-alpine
WORKDIR /app

RUN npm install -g pnpm

COPY . .

RUN cd /app/packages/database && pnpm install && npx prisma generate

RUN pnpm install

EXPOSE 3000

CMD ["pnpm", "run", "dev"]

api쪽엔 database쪽 설치 추가했고

version: '3.8'

services:
  # PostgreSQL 데이터베이스 서비스
  postgres:
    image: postgres:latest
    container_name: post-postgres
    environment:
      POSTGRES_USER: postgres
      POSTGRES_PASSWORD: postgres
      POSTGRES_DB: postdb
    ports:
      - "5432:5432"
    volumes:
      - postgres-data:/var/lib/postgresql/data
    networks:
      - post-network

  # API 서버 (NestJS)
  api:
    build:
      context: .
      dockerfile: ./apps/api/Dockerfile
    container_name: post-api
    ports:
      - "3001:3000"
    depends_on:
      - postgres
    environment:
      - DATABASE_URL=postgresql://postgres:postgres@postgres:5432/postdb?schema=public
      - NODE_ENV=development
    volumes:
      - ./apps/api:/app/apps/api
      - ./packages:/app/packages
      - /app/packages/database/node_modules
      - /app/packages/ui/node_modules
      - /app/node_modules
    networks:
      - post-network

  # 웹 프론트엔드 (Next.js)
  web:
    build:
      context: .
      dockerfile: ./apps/web/Dockerfile
    container_name: post-web
    ports:
      - "3000:3000"
    depends_on:
      - api
    environment:
      - NEXT_PUBLIC_API_URL=http://api:3000
      - NODE_ENV=development
    volumes:
      - ./apps/web:/app
      - ./packages:/app/packages
      - /app/packages/database/node_modules
      - /app/packages/ui/node_modules
      - /app/node_modules
    networks:
      - post-network

volumes:
  postgres-data:
  node_modules_api:
  node_modules_web:

networks:
  post-network:
    driver: bridge

docker-compose.yml엔 api와 web의 경로를 context가 아닌 dockerfile에 넣어주고 context엔 .만 추가해줬는데

context - 빌드 과정에서 Docker 데몬에 전송되는 디렉토리 지정. 이 디렉토리의 모든 파일은 빌드 과정에서 사용할 수 있음. Docker는 이 경로의 모든 파일을 빌드 컨텍스트로 사용

dockerfile - 사용할 Dockerfile의 이름과 경로 지정. 이 경로는 context에 상대적

기존 context에 있던 경로를 dockerfile쪽으로 옮긴 이유는

모노레포 구조에선 여러 애플리케이션이 공유 패키지 사용함

API, 웹 서비스 모두 packages 디렉토리에 있는 패키지에 접근해야 함

context의 .을 설정 시 Dockerfile에서 루트 디렉토리의 모든 파일에 접근할 수 있음 —- 이부분때문에 packages의 패키지에 접근하려고 .으로 설정을 바꿈

즉, context는 어떤 파일들이 빌드에 사용되는지 결정, dockerfile은 어떤 빌드 스크립트를 사용할지 결정하는 것임

그렇게 설정 시 Dockerfile에서 COPY . . 명령 사용 시 루트 디렉토리의 모든 파일이 복사되어 packages디렉토리에 접근권한이 생김

그러나 그러고 docker-compose down이후 docker-compose up —build를 진행해보니

failed to solve: error from sender: open C:\Users\gyp93\Desktop\mingyu\lottolist\packages\database\node_modules\.pnpm\node_modules\@esbuild\linux-x64: The file cannot be accessed by the system.

없던 에러가 발생했는데

Windows 시스템에서 Linux 전용 파일에 접근하려 할때 발생하는 문제라고 함

원인은

  1. 로컬에서 pnpm이용해서 패키지 설치 시, esbuild 같은 패키지는 운영체제별 바이너리 모두 설치
  2. 이러한 파일들 중 일부는 Windows에서 특별한 권한이 필요하거나 접근할 수 없는 파일 이름을 가질 수 있음
  3. Docker가 이 파일들을 빌드 컨텍스트로 복사하려할때 문제 발생

근데 그이후로 계~~속 에러가 떠서

그냥 한번에 총정리하려고 여러번 시도했다

[8:49:13 AM] Starting compilation in watch mode...
post-api       |
post-web       |    ▲ Next.js 15.2.4 (Turbopack)
post-web       |    - Local:        [http://localhost:3000](http://localhost:3000/)
post-web       |    - Network:      [http://172.18.0.4:3000](http://172.18.0.4:3000/)
post-web       |
post-web       |  ✓ Starting...
post-web       | Attention: Next.js now collects completely anonymous telemetry regarding usage.
post-web       | This information is used to shape Next.js' roadmap and prioritize features.

post-web       | You can learn more, including how to opt-out if you'd not like to participate in this anonymous program, by visiting the following URL:
post-web       | https://nextjs.org/telemetry

post-web       |
post-web       |  ✓ Ready in 4.5s

post-api       | [8:49:21 AM] Found 0 errors. Watching for file changes.
post-api       |
post-api       | [Nest] 30  - 04/05/2025, 8:49:22 AM     LOG [NestFactory] Starting Nest application...
post-api       | [Nest] 30  - 04/05/2025, 8:49:22 AM     LOG [InstanceLoader] AppModule dependencies initialized +21ms

post-api       | [Nest] 30  - 04/05/2025, 8:49:22 AM     LOG [RoutesResolver] AppController {/}: +12ms

post-api       | [Nest] 30  - 04/05/2025, 8:49:22 AM     LOG [RouterExplorer] Mapped {/, GET} route +9ms

post-api       | [Nest] 30  - 04/05/2025, 8:49:22 AM     LOG [NestApplication] Nest application successfully started +5ms

v View in Docker Desktop   o View Config

w Enable Watch

하……….. 드디어 됐네 ㅠ

거진 down && up을 10번은 넘게해서 드디어 해결된 것같은데 중간부터는 도저히 내가 해결할 수 없어서 그냥 복붙해서 계속 시도만 하였다

정리를 해보자면

Docker 문제 해결 과정

  1. 초기 문제 - pnpm 명령어 찾을 수 없음
  • 원인 : Dockerfile에 pnpm 설치 명령어가 없었음
  • 해결 : Dockerfile에 RUN npm install -g pnpm 추가
  1. 경로문제 - 컨텍스트 오타
failed to solve: error from sender: open C:\Users\gyp93\Desktop\mingyu\lottolist\.apps\api
  • 원인 : docker-compose.yml에서 context경로가 .apps/api로 지정한게 잘못된 것임
  • 해결 : 단순히 / 넣어줘서 해결 → ./apps/api
  1. 파일 접근 오류:Windows에서 Linux파일 접근 문제
failed to solve: error from sender: open C:\Users\gyp93\Desktop\mingyu\lottolist\packages\database\node_modules\.pnpm\node_modules\@esbuild\linux-x64
  • 원인 : Windows 환경에서 Linux 전용 패키지 파일 접근 문제
  • 해결 : 볼륨 마운트 설정에서 node_modules 제
volumes:
- ./apps/api:/app/apps/api
- ./packages:/app/packages
- /app/packages/database/node_modules
- /app/node_modules
  1. 워크 스페이스 의존성 문제
ERR_PNPM_WORKSPACE_PKG_NOT_FOUND In packages/ui: "@repo/eslint-config@workspace:*" is in the dependencies but no package named "@repo/eslint-config" is present
  • 원인: UI패키지 없는 워크스페이스 패키지를 참조
  • 해결:일단 당장은 UI패키지 안쓰니 웹서비스 Dockerfile에서 UI패키지 의존성 건너뛰기
  1. node_modules 경로 문제
Error: Cannot find module '/app/node_modules/next/dist/bin/next'
Error: Cannot find module '/app/apps/api/node_modules/@nestjs/cli/bin/nest.js'
  • 원인 : 의존성 설치 위치와 실행 위치 맞지 않음
  • 해결: 각 앱 디렉토리 내에서 직접 pnpm install 실행하게 Dockerfile 내부 수정

최종 해결책

  1. docker-compose.yml
services:

# PostgreSQL 데이터베이스 서비스

postgres:
image: postgres:latest
container_name: post-postgres
environment:
POSTGRES_USER: postgres
POSTGRES_PASSWORD: postgres
POSTGRES_DB: postdb
ports:
- "5432:5432"
volumes:
- postgres-data:/var/lib/postgresql/data
networks:
- post-network

# API 서버 (NestJS)

api:
build:
context: ./apps/api
dockerfile: Dockerfile
container_name: post-api
ports:
- "3001:3000"
depends_on:
- postgres
environment:
- DATABASE_URL=postgresql://postgres:postgres@postgres:5432/postdb?schema=public
- NODE_ENV=development
volumes:
- ./apps/api/src:/app/src
networks:
- post-network

# 웹 프론트엔드 (Next.js)

web:
build:
context: ./apps/web
dockerfile: Dockerfile
container_name: post-web
ports:
- "3000:3000"
depends_on:
- api
environment:
- NEXT_PUBLIC_API_URL=http://api:3000
- NODE_ENV=development
volumes:
- ./apps/web/src:/app/src
- ./apps/web/public:/app/public
networks:
- post-network

volumes:
postgres-data:

networks:
post-network:
driver: bridge
  1. API Dockerfile
FROM node:18-alpine

# NestJS CLI 전역 설치

RUN npm install -g @nestjs/cli

WORKDIR /app

# 패키지 파일만 복사

COPY package.json .
COPY tsconfig.json .
COPY nest-cli.json .

# 의존성 설치

RUN npm install

# 소스 코드 복사

COPY src/ ./src/

# 개발 서버 실행

CMD ["npm", "run", "dev"]
  1. Web Dockerfile
FROM node:18-alpine
WORKDIR /app

# 패키지 파일만 복사

COPY package.json .
COPY tsconfig.json .
COPY next.config.ts .

# 의존성 설치

RUN npm install

# 소스 코드 복사

COPY src/ ./src/
COPY public/ ./public/

# 개발 서버 실행

CMD ["npm", "run", "dev"]

결국 수많은 시행착오를 겪고, 모노레포에 Docker 적용을 성공하긴했지만, Dockerfile도 2개고 각각 package.json 위치가 제각각이여서 앞으로 내용을 추가하다보면 또 다시 에러를 많이 직면할 것 같다.

그리고 볼륨 마운트 즉, 실시간 개발 환경 구축을 위한 부분에서 node_modules를 컨테이너 내부에서 관리하도록 처리해야하는데 외부에서 설치시도하고 했던게 문제가 되었던 것 같음

그리고 세팅하다보니 lunux환경에서만 작동하는 파일 시스템도 존재했어서 크로스 플랫폼 이슈 피하기 위해 .dockerignore 파일도 세팅했어야 했다.

그리고 각 서비스를 하나하나 docker-compose에 넣어줘서 독립적으로 작동하게 구현이 되었던 것도 큰 것 같다.

일단 최초 세팅인 Docker에 대해선 성공했으니, 나머지는 실제 구현하면서 에러를 잡아가보도록 해보자~!

profile
규갓 God Gyu
웹 개발자 되고 시포용
이전 포스트

[개인 프로젝트 Lottodolist] eslint, prettier, git husky, lint-staged, commitlint 설정

다음 포스트

[개인 프로젝트 Lottodolist] C,R을 위한 prisma, nestJS 세팅하기(백엔드)

0개의 댓글