🌟 Awesome Next.js

Next.js 개발자를 위한 최고의 라이브러리, 도구, 리소스 모음 2025년 React 프로덕션 프레임워크의 생태계를 정리합니다.

🧩 핵심 라이브러리

Next.js 코어

• Next.js ⭐ 127k – React 프로덕션 프레임워크
• Next.js Canary – 최신 실험적 기능
• Create Next App – 공식 프로젝트 생성기

관련 프레임워크

• React ⭐ 229k – 기반 라이브러리
• Remix ⭐ 30k – 경쟁 프레임워크
• Astro ⭐ 47k – 정적 사이트 빌더
• Blitz.js ⭐ 14k – Next.js 풀스택 확장

호스팅 & 배포

• Vercel – Next.js 공식 플랫폼
• Netlify – JAMstack 호스팅
• Cloudflare Pages – 엣지 배포
• Railway – 풀스택 호스팅

🎨 UI & 스타일링

컴포넌트 라이브러리

• shadcn/ui ⭐ 75k – Radix + Tailwind 컴포넌트
• Radix UI ⭐ 16k – Headless 컴포넌트
• NextUI ⭐ 22k – 현대적 UI 라이브러리
• Mantine ⭐ 27k – 풀스택 컴포넌트

스타일링

• Tailwind CSS ⭐ 83k – 유틸리티 퍼스트 CSS
• styled-components ⭐ 41k – CSS-in-JS
• Emotion ⭐ 17k – CSS-in-JS 라이브러리
• CSS Modules – 스코프된 CSS

애니메이션

• Framer Motion ⭐ 24k – 프로덕션 애니메이션
• React Spring ⭐ 28k – 스프링 물리 애니메이션
• Auto Animate ⭐ 13k – 자동 DOM 애니메이션

🔀 상태 관리

클라이언트 상태

• Zustand ⭐ 48k – 간단한 상태 관리
• Jotai ⭐ 19k – 원자적 상태 관리
• Recoil ⭐ 20k – Facebook의 상태 관리
• Redux Toolkit ⭐ 11k – Redux 공식 도구

서버 상태

• TanStack Query ⭐ 42k – 서버 상태 관리
• SWR ⭐ 31k – Vercel의 데이터 페칭
• Apollo Client ⭐ 19k – GraphQL 클라이언트
• tRPC ⭐ 35k – End-to-end 타입 안전 API

폼 관리

• React Hook Form ⭐ 41k – 고성능 폼
• Formik ⭐ 34k – 폼 라이브러리
• Zod ⭐ 34k – 스키마 검증

🔐 인증 & 보안

인증 라이브러리

• NextAuth.js (Auth.js) ⭐ 25k – 완전한 인증 솔루션
• Clerk – 사용자 관리 플랫폼
• Lucia ⭐ 10k – 간단한 세션 기반 인증
• Kinde – 인증 & 사용자 관리

OAuth & SSO

• next-auth – OAuth 프로바이더 지원
• Auth0 – 엔터프라이즈 인증
• Supabase Auth – Supabase 인증

보안

• next-safe-action ⭐ 2k – 타입 안전 Server Actions
• iron-session ⭐ 4k – 암호화된 세션

🗃️ 데이터베이스 & ORM

ORM / Query Builder

• Prisma ⭐ 40k – 차세대 ORM
• Drizzle ORM ⭐ 25k – TypeScript ORM
• Kysely ⭐ 11k – 타입 안전 SQL 빌더
• TypeORM ⭐ 34k – TypeScript ORM

BaaS (Backend as a Service)

• Supabase ⭐ 73k – Firebase 대안
• Firebase – Google BaaS
• Neon – Serverless Postgres
• PlanetScale – MySQL 플랫폼

CMS

• Sanity – 헤드리스 CMS
• Contentful – 콘텐츠 플랫폼
• Strapi ⭐ 64k – 오픈소스 헤드리스 CMS
• Payload ⭐ 26k – 헤드리스 CMS

🚀 배포 & 인프라

호스팅 플랫폼

• Vercel – Next.js 최적화 플랫폼
• Netlify – JAMstack 배포
• AWS Amplify – AWS 통합
• Render – 클라우드 호스팅

Serverless

• Vercel Functions – 서버리스 함수
• AWS Lambda – 서버리스 컴퓨팅
• Cloudflare Workers – 엣지 컴퓨팅

분석 & 모니터링

• Vercel Analytics – 웹 애널리틱스
• PostHog ⭐ 22k – 제품 분석
• Sentry ⭐ 39k – 에러 모니터링
• OpenTelemetry – 관찰 가능성

🧪 테스팅

유닛 & 통합 테스트

• Vitest ⭐ 13k – Vite 네이티브 테스트
• Jest ⭐ 44k – JavaScript 테스팅
• React Testing Library ⭐ 19k – 컴포넌트 테스트

E2E 테스트

• Playwright ⭐ 67k – 브라우저 자동화
• Cypress ⭐ 47k – E2E 테스팅

시각적 테스트

• Chromatic – 시각적 회귀 테스트
• Percy – 시각적 테스트 플랫폼

🔧 개발자 도구

VS Code 확장

• ES7+ React Snippets – 스니펫
• Tailwind CSS IntelliSense – Tailwind 자동완성
• Prisma – Prisma 확장

개발 도구

• React DevTools – React 디버깅

린팅 & 포매팅

• ESLint ⭐ 25k – 코드 분석
• Prettier ⭐ 49k – 코드 포매팅
• eslint-config-next – Next.js ESLint 설정

📦 유용한 패키지

SEO & 메타데이터

• next-seo ⭐ 8k – SEO 관리
• next-sitemap ⭐ 3k – 사이트맵 생성
• @vercel/og – OG 이미지 생성

국제화 (i18n)

• next-intl ⭐ 3k – Next.js i18n
• next-i18next ⭐ 6k – i18next 통합
• Lingui ⭐ 4k – JS i18n

이미지 & 미디어

• next/image – 이미지 최적화
• Cloudinary – 미디어 관리
• Uploadthing ⭐ 4k – 파일 업로드

이메일

• React Email ⭐ 14k – 이메일 컴포넌트
• Resend – 이메일 API

🎓 학습 자료

공식 문서

• Next.js Documentation – 공식 문서
• Next.js Learn – 공식 튜토리얼
• Vercel Guides – Vercel 가이드

온라인 코스

• Next.js by Example – 예제 모음
• Total TypeScript – TypeScript 학습
• Josh Comeau – React/Next.js 가이드

커뮤니티

• r/nextjs – Reddit 커뮤니티
• Next.js Discord – 공식 Discord
• Vercel Community – GitHub Discussions

🆕 2025 Highlights

Next.js 15+ 새 기능

• Turbopack Stable: Webpack 대체 빌드 도구
• Partial Prerendering: 부분 사전 렌더링
• Server Actions Improvements: 서버 액션 강화
• Enhanced Caching: 개선된 캐싱 전략

App Router 패턴

• Parallel Routes: 병렬 라우트
• Intercepting Routes: 인터셉트 라우트
• Route Groups: 라우트 그룹화
• Loading UI: 로딩 상태 관리

성능 최적화

• React Server Components: 서버 컴포넌트
• Streaming: 점진적 렌더링
• Edge Runtime: 엣지 실행 환경
• Image Optimization: 이미지 최적화

AI 통합

• AI SDK by Vercel: AI 통합 SDK
• OpenAI API: GPT 통합
• Langchain.js: LLM 체인
• v0.dev: AI 기반 UI 생성

한국 Next.js 생태계

• 토스: Next.js 기반 핀테크
• 당근마켓: Next.js 프론트엔드
• 네이버: Next.js 서비스
• 카카오: Next.js 활용

📋 스타터 템플릿

공식 스타터

• create-next-app – 기본 스타터
• Next.js Examples – 공식 예제

커뮤니티 스타터

• T3 Stack ⭐ 25k – tRPC + Prisma + NextAuth
• Taxonomy ⭐ 18k – shadcn/ui 기반 앱
• Next.js SaaS Starter ⭐ 6k – SaaS 템플릿
• Next.js Commerce ⭐ 11k – 이커머스 템플릿

콘텐츠 업데이트 요청은 요청 게시판에 써주세요