Next.js, Google Maps, PostgreSQL을 활용하여 동적인 여행 플래너 앱을 구축하며 풀스택 웹 개발의 모든 과정을 배울 수 있습니다. 🚀
Next.js, Prisma 경험이 없거나 풀스택 기술 향상을 목표로 하는 초보자를 위해 특별히 설계된 강좌입니다. 👶
Next.js (빠른 SSR, React), Prisma ORM (직관적, 타입 안전), Tailwind CSS (아름다운 UI), Neon DB (서버리스 PostgreSQL), NextAuth.js (인증), UploadThing (이미지 저장), React Google Maps (지도), Rex UI (UI 컴포넌트), DND (드래그 앤 드롭) 등 최신 기술 스택을 활용합니다. 🛠️
사용자 인증, 여행 계획 및 상세 일정 생성, Google Maps를 통한 여정 시각화, 방문 국가를 표시하는 3D 지구본을 통한 여행 기록 전시, 이미지 업로드 기능 등을 포함한 주요 앱 기능을 구현합니다. 🗺️
Neon DB는 서버리스 PostgreSQL로, 원활한 확장성, 즉각적인 데이터베이스 브랜칭, 컴퓨팅과 분리된 데이터 저장으로 성능 및 비용 효율성을 제공하며 백엔드 관리를 간소화합니다. 💡
npx create-next-app을 통한 Next.js 프로젝트 생성 (TypeScript, ESLint, Tailwind, App Router, Turbo Pack 포함), 다양한 패키지 설치, Tailwind CSS 색상(OKLCH 형식) 및 기본 클래스 정의 과정을 상세히 다룹니다. 🎨
Next.js의 Image 및 Link 컴포넌트를 활용하여 로고, 웹사이트 제목, 'My Trips', 'Globe' 링크, GitHub 계정으로 로그인할 수 있는 버튼을 포함한 반응형 내비게이션 바를 구축합니다. 🧭
Neon DB에서 PostgreSQL 데이터베이스를 생성하고 연결하는 방법과 npx prisma init 명령어를 통해 Prisma ORM을 초기화하여 schema.prisma 파일을 생성하는 과정을 설명합니다. 💾