히치키치

📋 작업 개요Railway 플랫폼에서 nixpacks를 사용한 monorepo 프로젝트 배포 시간 최적화 및 에러 해결🚨 핵심 문제Railway HTTP 요청 타임아웃 제한: 최대 5분기존 배포 시간이 5분 이상 소요되어 지속적으로 타임아웃 발생배포 성공률 0%로 서비스 배포 불가 상태타임아웃 해결을 위한 최적화 과정에서 다양한 nixpacks 에러들을 추가로 발견 및 해결초기 설정의 타임아웃 원인:최적화 플래그 없는 npm install로 설치 시간 지연과도한 로깅과 환경 체크로 인한 시간 소요비효율적인 빌드 순서 및 워크스페이스 처리🎯 성과 요약배포 시간 단축: 5분+ → 3분 초반 (약 40% 개선)타임아웃 문제 해결: Railway 5분 제한 내 완료빌드 성공률: 0% → 100%에러 해결:..

“패키지들을 나누고, 서로 import해서 쓰면 되는데 왜 배포에선 안 되지?”- Turborepo 빌드 순서 이슈 중심으로 [INTRO][1] 간략한 개발 환경과 프로젝트 구조 소개blockie/├── apps/│ ├── web/ # Next.js (프론트엔드)│ └── api/ # NestJS (백엔드)└── packages/ ├── ui/ # 공통 컴포넌트 ├── utils/ # 유틸리티 함수 └── types/ # TypeScript 타입 기술 스택Frontend: Next.js, TypeScript, Tailwind CSS v4Backe..

[INTRO] 문제의 시작: 마이페이지의 딜레마기존 CSR 방식으로 마이페이지를 개발하면서 마주한 다음의 문제점들페이지 로드 시 로딩 스피너가 보이는 깜빡임 현상토큰 검증과 사용자 데이터 fetching이 순차적으로 발생하는 성능 이슈새로고침 시마다 반복되는 불필요한 API 호출검색 엔진이 인덱싱할 수 있는 의미 있는 콘텐츠 부재핵심 아이디어: 서버에서 미리 준비하고, 클라이언트에서 매끄럽게 이어받자!설계의 출발점은 명확한 역할 분담이었다. "서버에서 할 수 있는 일은 서버에서, 클라이언트에서 해야 할 일은 클라이언트에서"라는 원칙을 바탕으로, 각 계층의 책임을 구분하고 역할에 집중할 수 있는 구조를 고민했다. 설계 원칙 1: 서버와 클라이언트의 명확한 역할 분담서버의 역할 | 페이지 진입 전 준비인증 ..

⭐ Tailwind + PostCSS와 Rollup.js 통합- Rollup는 PostCSS 플러그인를 통해 Tailwind CSS 스타일을 처리하고 최적화하고, CSS 파일을 번들링함. - 그 결과로 dist/index.css 파일에 Tailwind CSS로 작성된 스타일을 번들에 포함시킬 수 있음. - 이를 통해 다른 프로젝트에서 해당 라이브러리 사용 시 설정한 tailwind 스타일링 사용 가능함  ⭐ 왜 rollup 사용하였는가?답변 ) UI 라이브러리 배포 프로젝트의 요구사항과 Rollup의 특성이 잘 맞았음근거 )1. UI 라이브러리 배포라는 단일 목적에 적합- Webpack은 복잡한 애플리케이션 번들링에 강점이 있지만, 라이브러리 번들링에는 과도한 설정이 필요할 수도 있음- Rollup은 불..