Note

#2 INTRODUCTION

#2.2 Recording Plan

  1. 기존의 풀스텍 강의는 백엔드를 먼저 작업하였다.
    1. 서버를 먼저 구축 하고
    2. 데이터 베이스를 만들고
    3. API를 만든 다음
    4. 인증 부분을 만들고
    5. 백엔드를 다 만든 후에 UI(프론트엔드)를 만들었다.
    6. 그리고 UI를 백엔드랑 연결 하였다.
  2. 이번 강의에서는 Serverless 어플리케이션을 만들 것이기 때문에 서버를 만들 필요가 없다. 그래서 이번에는 반대 순서로
    1. UI(프론트엔드)를 먼저 만든다.
      • 한 섹션은 온전히 UI를 구현하는 장이 될 것이다.
      • 원래 Style 구현은 따로 강의하지 않지만, 이번에는 제공한다.
      • Tailwind, flex, grid 등을 연습한다.
    2. Tailwind 로 CSS를 편리하게 조작하는 방법을 배운다.
      • 외우는 것보다는 체험해보는 개념으로 듣자.
      • 가짜 데이터를 이용해서 UI를 구현한다.
    3. 모든 UI를 만들고 나면 백엔드로 실제 데이터로 작동하는 로직을 만든다.
      • 백엔드에 대한 설명은 그때 한 번 더 한다.
      • Prisma, SWR, Login, Twilio, Sendgrid, Next Auth 를 알아본 후
      • 페이지에 API를 연결한다.

#3 SETUP

NextJS Setup, TailwindCSS Setup

#3 SETUP

#4 TOUR OF TAILWIND

#4 TOUR OF TAILWIND

#5 TAILWIND PRACTICE

#5 TAILWIND PRACTICE

#6 DATABASE SETUP

Prisam, PlanetScale, Vitess, API Routes

#6 DATABASE SETUP

#7 REACT HOOK FORM