Day 119:00 - 21:00
AI 코딩의 시작
Cursor 설치부터 첫 번째 웹사이트 배포까지
Overview
AI 코딩의 혁명을 직접 경험합니다. 복잡한 설치 과정 없이 Cursor 하나로 개발 환경을 구축하고, 단 2시간 만에 나만의 웹사이트를 만들어 인터넷 세상에 배포합니다.
학습 목표
AI 코딩 도구(Cursor)의 기본 원리 이해
개발 환경 설정 및 기본 단축키 습득
HTML/CSS의 기초 구조 파악
Vercel을 통한 원클릭 배포 경험
사용 기술
Cursor
AI가 내장된 차세대 코드 에디터
Vercel
만든 웹사이트를 전 세계에 배포하는 도구
Step-by-Step 가이드
STEP 1
🛠️ 도구 설치
Cursor 에디터 다운로드 및 설치
AI Prompt
Cursor 공식 홈페이지 접속 → Download for Windows/Mac
STEP 2
👋 Hello World
첫 번째 HTML 파일 생성
AI Prompt
자기소개 페이지를 만들고 싶어. 검정색 배경에 네온 사인 효과로 내 이름을 가운데 띄워줘.
KeyCtrl+K (AI에게 코드 작성 요청)
STEP 3
🚀 실시간 배포
Vercel로 전 세계에 공유
AI Prompt
GitHub 연동 → Import Project → Deploy
준비물
- 노트북 (Windows/Mac)
- 구글 크롬 브라우저 설치
- GitHub 계정 생성
AI와 대화하는 3단계 공식
- 1. 역할 부여: "너는 세계 최고의 웹 디자이너야"
- 2. 상황 설명: "포트폴리오 사이트를 만들고 있어"
- 3. 구체적 요청: "모던하고 심플한 스타일로 만들어줘"
강사 노트 (Tip)
✅ 수업 전 준비
수강생들의 GitHub 계정 생성 여부를 미리 확인해주세요. 2단계 인증 문제로 시간이 지체될 수 있습니다.
⚠️ 돌발 상황 대처
Vercel 배포 시 에러가 발생하면, 프로젝트 이름을 변경해서 다시 시도하도록 안내해주세요. (중복된 이름 문제)
Next Session
계산기 만들기
바로가기