프레임워크 선택 플레이북 — 프로젝트별 최적 선택
프로젝트 유형별로 Next.js, Remix, Astro, SvelteKit, Nuxt 중 어떤 프레임워크를 선택해야 하는지 결정하는 실전 가이드.
프로젝트의 요구사항을 분석하고, 최적의 프레임워크를 선택한다.
전제조건
- HTML/CSS/JS 기본 지식
- 프로젝트 요구사항 정리
단계별 가이드
1
프로젝트 유형 파악
SaaS/풀스택 앱인지, 콘텐츠 사이트인지, 데이터 CRUD 앱인지 먼저 분류한다.
2
렌더링 요구사항 확인
SSR이 필요한지(SEO, 동적 데이터), SSG로 충분한지(정적 콘텐츠), 아니면 SPA인지 판단.
3
UI 프레임워크 결정
React(Next.js/Remix), Vue(Nuxt), Svelte(SvelteKit), 또는 프레임워크 무관(Astro) 중 선택.
4
배포 환경 확인
Vercel, Cloudflare, Netlify, AWS 등 배포 환경과의 호환성 확인.
5
생태계 크기 평가
필요한 서드파티 라이브러리, 컴포넌트, 튜토리얼의 가용성 확인.
6
프로토타입 테스트
최종 후보 1~2개로 간단한 프로토타입을 만들어 DX를 직접 체험.
실전 팁
확신이 없으면 Next.js를 선택하라. 가장 큰 생태계와 레퍼런스를 가지고 있다.
콘텐츠 사이트에 React 풀스택 프레임워크를 쓰면 오버엔지니어링이다. Astro를 고려하라.
팀에 Vue 개발자만 있다면 Nuxt가 가장 자연스러운 선택이다.
사용 도구
Next.js프레임워크
React 기반 풀스택 프레임워크. SSR/SSG/ISR, API Routes, App Router를 제공한...
Remix프레임워크
Web 표준 기반 풀스택 프레임워크. Loader/Action 패턴으로 데이터 중심 웹앱에 적합.
Astro프레임워크
콘텐츠 중심 프레임워크. Islands 아키텍처로 JS를 최소화하고 빌드 속도가 빠르다.
SvelteKit프레임워크
컴파일러 기반 프레임워크. 런타임 없이 순수 JS로 변환되어 번들이 작고 빠르다.
Nuxt프레임워크
Vue 기반 풀스택 프레임워크. Vue 생태계에서 Next.js의 위치에 해당한다.