TECH STACK
기술 스택
현업에서 실제로 쓰는 도구로 배웁니다. 카드를 누르면 수업에서 어떻게 쓰는지 볼 수 있어요.
AI 코딩 에이전트
Claude Code
터미널에서 대화로 코드를 쓰고 고치고 실행합니다.수업에서는1회차부터 매 수업 씁니다. 만들고 싶은 기능을 말로 설명하고, AI가 만든 코드를 읽고 고치게 하는 대화법을 연습합니다.
Claude Code 공식 사이트 (새 창)웹 프레임워크
Next.js
화면과 서버를 한 프로젝트에서 만듭니다.수업에서는2회차 화면 만들기에서 페이지와 컴포넌트를 나누고, 서버에서 데이터를 불러오는 구조를 익힙니다.
Next.js 공식 사이트 (새 창)스타일링
Tailwind CSS
클래스 이름만으로 디자인을 입힙니다.수업에서는2회차와 4회차에 색·간격·모바일 대응을 클래스 이름으로 다듬습니다. 디자인 파일 없이도 깔끔한 화면을 만듭니다.
Tailwind CSS 공식 사이트 (새 창)데이터베이스·인증
Supabase
Postgres DB와 로그인을 설정 몇 번으로 붙입니다.수업에서는2회차에 테이블을 만들어 읽기·쓰기를 붙이고, 3회차에 로그인과 RLS(행 단위 권한)로 데이터를 안전하게 지킵니다.
Supabase 공식 사이트 (새 창)버전 관리
GitHub
작업 기록을 남기고 되돌릴 수 있게 합니다.수업에서는매 수업 작업을 커밋으로 남기고, AI가 망친 코드를 이전 상태로 되돌리는 법을 배웁니다. 수료 후 포트폴리오가 됩니다.
GitHub 공식 사이트 (새 창)배포
Vercel
push 한 번으로 전 세계에 서비스를 띄웁니다.수업에서는4회차에 내 서비스를 인터넷에 올리고, 도메인과 환경변수(비밀 키)를 안전하게 설정합니다.
Vercel 공식 사이트 (새 창)