포인트
로딩중
쿠폰
내 강의실
국비 신청 내역
증명서
계정
로그아웃
강의
학습 질문
부가 서비스
최종 금액490,000원
490,000원

웹개발이 처음이어도
쉽게 배우는 GPT 웹개발

기획부터 구현까지 AI를 활용하여 코드를 하나하나 치지 않아도,
AI로 웹 개발하는 순서와 방법을 배울 수 있어요

39개 수업총 6시간 59분

490,000원
수강 전 유의사항
권장 기기사항
- Window : 버전 10 이상 / RAM 8G 이상 / i5 이상 / 64bit 이상
- Mac : 11.7 (Big Sur) 이상
[기기 사양 확인법]
- Window : 컴퓨터 설정 → 시스템 → 정보
- Mac : 화면 왼쪽 상단 Apple 로고 → 이 Mac에 관하여
유의사항
* 국비지원 강의의 경우, 하루 최대 16강까지 수강할 수 있습니다(실습 포함). 한번에 몰아듣기가 불가하므로, 1일 최대 수강 가능 강의 수를 고려해 수강 계획을 세워주세요.

* 국비지원 강의는 명의 양도 방지를 위해 수강하시는 날 최초 1회 본인인증이 필요합니다.
인증은 본인 명의의 휴대폰으로 진행할 수 있으며, 해외 수강 시 국내 발송 문자 수신이 가능해야 수강하실 수 있습니다.
웹 개발을 처음부터
차근차근 배우고 싶어요.
코딩 왕초보
HTML·CSS·JavaScript로
웹사이트를 직접 만들고 싶어요.
웹 제작 입문자
AI를 활용해
나만의 웹 서비스를 만들어보고 싶어요.
서비스 제작 도전자

지금 주목받는 방식, AI로 웹을 만드는 법

기획부터 구현까지 AI를 활용하여 코드를 하나하나 치지 않아도, AI로 웹 개발하는 순서와 방법을 배울 수 있어요!

웹개발이 처음이어도 쉽게 배우는 GPT 웹개발

수강 기간

35일

소장 기간

수강 후 평생소장

수료 조건

수강 기간 내 100% 학습 시

학습 분량

39개 수업 ・ 총 6시간 59분

실습

null 0개 제작

수준

사전 지식 없이 수강 가능

[기기 사양 확인법]
- 윈도우: 컴퓨터 설정 → 시스템 → 정보
- Mac: 화면 왼쪽 상단 Apple 로고 → 이 Mac에 관하여

[상세 사양]
- 윈도우 : 버전 10 이상 / RAM 8G 이상 / i5 이상 / 64bit 이상 - Mac : 11.7 (Big Sur) 이상

이 강의를
들어야 하는 이유

01
코드를 외우지 않는 웹개발 입문
웹개발이 처음인 사람도 직관적으로 이해할 수 있도록, AI를 활용하여 개발하는 바이브코딩 기초 방식을 배웁니다.
02
ChatGPT와 함께하는 ‘화면 조립’ 방식의 개발
무엇을 만들지 말로 정리하고, AI와 대화하며 화면을 설계하고 구현하는 과정을 반복하며 조립하는 방식으로 웹을 만듭니다.
03
기획 → 설계 → 구현까지 한 번에 경험
PRD 작성 → 화면 구조 설계 → 실제 웹 구현 → 테스트 → 배포까지 하나의 서비스를 만들어보는 경험을 제공합니다.

핵심 스킬 3가지

AI로 웹 화면
직접 만들기
ChatGPT와 Lovable을 활용해 기획한 화면을 실제 동작하는 웹 페이지로 구현합니다.
프롬프트 기반
웹 기획 역량
AI에게 일을 잘 시키는 프롬프트를 설계해 화면 구조와 서비스 기획을 정리하는 능력을 기릅니다.
AI 웹 서비스
완성 및 배포
계산기·챗봇 등 AI 기능이 결합된 웹 서비스를 테스트하고 배포까지 완료하는 경험을 합니다.
커리큘럼
5주 과정
사용 기술
ChatGPT, Lovable, OpenAI API
구현 기능
ChatGPT 를 활용한 웹 화면 기획안(PRD) 도출 Lovable을 활용해 설계한 화면을 실제 동작하는 웹 페이지로 제작 AI 기능이 결합된 인터랙티브 웹 서비스 구현
7강
총 1시간 30분
1-1
웹은 선택이 아닌 필수
1-2
웹을 구성하는 언어를 알아보자 (1)
1-3
웹을 구성하는 언어를 알아보자 (2)
1-4
웹 개발에 필요한 AI는?
1-5
ChatGPT와 Lovable AI 실습하기 (1)
1-6
ChatGPT와 Lovable AI 실습하기 (2)
1-7
1챕터 숙제
7강
총 1시간 27분
2-1
이번 시간에 만들 것
2-2
인스타그램 화면 크게 보기
2-3
인스타그램 화면 구조 뜯어보기
2-4
프롬프트 작성하기
2-5
ChatGPT로 PRD 만들기
2-6
Lovable로 웹사이트 만들기
2-7
2챕터 숙제
7강
총 1시간 26분
3-1
이번 시간에 만들 것
3-2
웹에서 데이터를 다루는 방법
3-3
서비스 기획하기
3-4
프롬프트 작성 팁
3-5
ChatGPT와 PRD 작성하기
3-6
Lovable로 웹사이트 만들기
3-7
3챕터 숙제
9강
총 1시간 15분
4-1
이번에 만들 것
4-2
What is 생성형 AI? & Lovable?
4-3
서비스를 만든다는 것(기획)
4-4
ChatGPT와 연금 계산기 기획하기
4-5
Lovable 구조 살펴보기
4-6
Lovable로 연금 계산기 개발하기
4-7
연금 계산기 테스트하기
4-8
연금 계산기 배포 & Wrap UP
4-9
4챕터 숙제
9강
총 1시간 19분
5-1
이번에 만들 것
5-2
What is 생성형 AI? & Lovable?
5-3
서비스를 만든다는 것(기획)
5-4
운세 서비스 기획하기(핵심 개념)
5-5
운세 서비스 기획하기
5-6
운세 서비스 개발하기
5-7
오늘의 운세 테스트하기
5-8
운세 서비스 배포 & Wrap UP
5-9
5챕터 숙제

실습 결과물 4개

인스타그램 웹페이지 만들기
서비스 구조 분석
화면 분해 설계
AI 프롬프트 기반 UI 생성
인스타그램 화면을 바탕으로 프로필·피드·스토리 구조를 분석하고, ChatGPT와 Lovable로 화면 요소를 설계해 웹 화면을 완성하며, 웹개발 전체 흐름을 익힙니다.
휴대폰 요금제 추천 웹페이지 만들기
데이터 조건 설계
사용자 흐름 기획
AI 기반 화면 구현
사용자의 선택에 따라 결과가 달라지는 웹 페이지를 제작합니다. 서비스 기획부터 화면 구현까지 AI와 함께 진행하며 데이터 기반 웹서비스 제작 방식을 익힙니다.
연금 계산기 웹서비스 만들기
계산 로직 설계
인터랙션 구현
테스트 및 배포
입력값에 따라 결과가 계산되는 웹 서비스를 구현합니다. AI 를 활용하여 구현 부터 배포까지 순차적으로 진행하며, 배포 전에 실제 QA 과정을 경험하여 완성도를 높입니다.
AI 운세봇 만들기
OpenAI API 연동
챗봇 시나리오 설계
AI 응답 제어
OpenAI API를 활용해 사용자 입력에 따라 운세를 생성하는 나만의 AI 챗봇 서비스를 제작합니다.
튜터 소개
구민정
현) 항공사 IT 프론트엔드 개발자
전) 웹/이벤트 페이지 제작 1인 기업 대표
전) 여행 스타트업 풀스택 개발자
전) SK 주식회사 선임 개발자
데이빗
핀테크 스타트업 창업 / 웰니스 스타트업 창업 투자유치 및 팁스등 총 20억 이상 자본유치 / 디캠프 디데이 우승
서울 AI허브 Say Track 스타트업 전담 코치
팀스파르타 창업 트랙 튜터
바이브 코딩 프로젝트 10여건 진행
AI / 자동화 관련 강의 진행 다수
완강까지 책임지는 학습 관리 시스템
결국 끝까지 듣고 내 것으로 만드는 게 가장 중요해요. 나에게 필요한 학습 관리 서비스를 선택해 보세요.*수강 신청 단계에서 선택할 수 있는 부가 서비스
학습 관리 - 학습 알림
문자, 알림톡으로 학습 공지 및 독려 메시지를 보내드려요.
학습 질문 - 일반문답
공부하다가 궁금한 점이 생기면 언제든 학습 질문 게시판에 질문을 남겨요. 튜터에게 24시간 이내 답변을 받을 수 있어요.
FAQ