📘 Next.js 기초 강좌

여기까지 기초 커리큘럼을 통해 Next.js의 핵심 개념과 사용법을 실습하며 학습했습니다.

이제부터는 중급/실전 커리큘럼으로 넘어가 실제 서비스에 필요한 기능들을 구현하면서,

“토이 프로젝트 수준”을 넘어 실무에 바로 쓸 수 있는 Next.js 앱을 만들게 됩니다.

👉 정리하자면:

• 기초: Next.js 기본기를 익히고, 블로그 프로젝트로 감각 잡기
• 중급: 인증, DB, 서버 액션, SEO, 구조화를 배우며 실무형 앱 설계
• 실전: 블로그 확장 + 사용자 기능 + 최적화 배포까지 완성

🎯 다음 단계

중급 1강에서는 NextAuth.js를 이용한 GitHub/Google 로그인 구현을 실습하면서,

사용자 인증과 세션 관리의 기본기를 잡는 것부터 시작합니다.

중급 커리큘럼 안내

1단계: 인증과 세션 관리 (NextAuth 중심)

• NextAuth.js 기본 개념 이해
• GitHub / Google 로그인 구현 (Provider 활용)
• getServerSession으로 서버 컴포넌트에서 세션 확인하기
• 커스텀 로그인 UI 페이지 제작
• 역할(Role) 기반 권한 처리 (예: admin, user 구분)

2단계: 데이터베이스 연동 (Firebase Firestore)

• Firestore 기본 구조 (Collection / Document) 이해
• Firebase SDK 설치 및 .env.local 환경변수 세팅
• NextAuth Adapter로 Firestore 연동 (로그인 사용자 저장)
• 게시글 CRUD 구현
  • 글 목록 불러오기 (getDocs)
  • 글 작성하기 (addDoc)
  • 글 수정/삭제 (updateDoc, deleteDoc)
  • 작성자 UID 기반 접근 제어
• Firestore Security Rules 기초 소개

3단계: 서버 액션 & Mutations

• Next.js Server Actions 개념과 활용
• Firestore와 Server Action 연동 (Form → DB 업데이트)
• Optimistic UI (낙관적 업데이트) 구현
• React Query와 비교 → Next.js 내장 방식 vs 라이브러리 방식

4단계: 고급 SEO & 최적화

• Dynamic Metadata API 활용
• Open Graph / Twitter 카드 자동화
• Sitemap & RSS 자동 생성
• Web Vitals 측정 및 성능 최적화

5단계: 프로젝트 설계 & 구조화

• 실무형 폴더 아키텍처 (features / entities / shared 패턴)
• 모노레포 vs 단일 레포 구조 이해
• 환경별(.dev / .staging / .prod) 배포 전략
• GitHub Actions & Vercel CI/CD 기초

6단계: 실전 프로젝트 – 블로그 확장

• Firestore 기반 블로그 완성
  • 로그인 사용자만 글 작성/수정 가능
  • 댓글 & 좋아요 기능 추가
• Firestore Security Rules 적용
• SEO 대응 + Vercel 배포 최종 완성