테마
AI로 웹사이트 만들고 애드센스 수익화하기
학습 목표
- AI 도구(Cursor, Claude Code 등)를 활용해 직접 웹사이트를 만들 수 있다.
- 서버리스 플랫폼(Cloudflare, Supabase)을 이용해 비용 없이 배포할 수 있다.
- 구글 애드센스를 연동하여 자동 수익 시스템을 구축할 수 있다.
- 수익화에 적합한 서비스 아이디어를 스스로 기획할 수 있다.
이 학습 자료는
"코딩을 모르는 사람도 AI 도구를 활용해 웹사이트를 만들고, 구글 애드센스로 수익을 창출할 수 있다"
라는 한 문장을 증명하기 위해 만들어졌다.
과거에는 웹사이트를 만들려면 HTML, CSS, JavaScript를 직접 작성해야 했고, 서버를 구매하고 관리해야 했다. 하지만 지금은 AI가 코드를 대신 짜주고, 서버리스 플랫폼이 배포를 대신 해준다. 우리에게 필요한 것은 아이디어와 실행력 뿐이다.
이 학습 자료는 아이디어 구상부터 실제 배포, 그리고 광고 수익화까지의 전체 과정을 단계별로 안내한다.
학습 로드맵
챕터 목록
| 번호 | 제목 | 단계 | 핵심 키워드 |
|---|---|---|---|
| 00 | 목차 및 로드맵 | 개요 | 전체 구성 |
| 01 | 왜 나만의 웹사이트를 만들어야 하는가 | 기초 | 동기부여, 시스템 수익 |
| 02 | 광고 수익화 성공 사례 | 기초 | 실제 사례, 데이터 |
| 03 | 웹사이트 만들기 전 고려사항 | 기초 | 기획, CPC, SEO |
| 04 | 서비스 구조 4가지 패턴 | 구현 | 아키텍처, 서버리스 |
| 05 | 예제 아키텍처 설계 | 구현 | 날씨 추천, 실전 설계 |
| 06 | Cursor로 Frontend 만들기 | 구현 | AI 코딩, React |
| 07 | Cloudflare Pages 배포 | 구현 | 정적 호스팅, CI/CD |
| 08 | Supabase Edge Function | 구현 | 서버리스, Deno |
| 09 | 외부 API 연동 | 구현 | WeatherAPI, fetch |
| 10 | 도메인 연결과 HTTPS | 구현 | DNS, SSL |
| 11 | 반응형 웹 디자인 | 구현 | 미디어쿼리, 모바일 |
| 12 | SEO 최적화 | 운영 | 메타태그, sitemap |
| 13 | Google Search Console 등록 | 운영 | 색인, 크롤링 |
| 14 | 성능 최적화와 모니터링 | 운영 | Lighthouse, Core Web Vitals |
| 15 | 구글 애드센스 신청과 승인 | 수익화 | 정책, 심사 |
| 16 | 광고 배치 전략 | 수익화 | CTR, 위치 최적화 |
| 17 | 수익 분석과 성장 전략 | 수익화 | RPM, 트래픽 확장 |
4단계 학습 흐름
전체 학습은 4단계로 나뉜다. 각 단계를 순서대로 밟아가면 자연스럽게 수익화까지 도달할 수 있다.
| 단계 | 챕터 | 목표 | 소요 시간(예상) |
|---|---|---|---|
| 기초 | 01~03 | 동기부여와 기획 능력 확보 | 1~2일 |
| 구현 | 04~11 | 실제 웹사이트 완성 및 배포 | 1~2주 |
| 운영 | 12~14 | 검색 엔진 노출 및 안정 운영 | 3~5일 |
| 수익화 | 15~17 | 애드센스 승인 및 수익 최적화 | 1~2주 |
이런 분에게 추천한다
- 코딩 경험이 없지만 부수입을 만들고 싶은 분
- 블로그 수익화에 한계를 느끼고 서비스형 웹사이트를 만들어보고 싶은 분
- AI 도구를 활용한 실전 프로젝트를 경험하고 싶은 분
- 서버 비용 없이 웹 서비스를 운영하고 싶은 분
선행 조건
특별한 개발 지식은 필요하지 않다. 아래 정도만 준비되어 있으면 충분하다.
- 인터넷 브라우저 사용 가능
- 구글 계정 보유
- 텍스트 편집기(메모장 수준) 사용 가능
- 무엇이든 만들어보겠다는 의지