바이브 코딩 With Claude Code로 웹 서비스 만들기

코딩 처음부터 내 웹 서비스 운영까지 한 번에?! 기본기와 실전을 하나로 잇는, 웹 빌드 올인원.

🔥 강의 등록부터 영상 업로드까지, 지식공유자 기능을 그대로 구현해보는 실전 풀스택 강의입니다. Next.js 15와 NestJS를 활용해 강의 생성, 커리큘럼 구성, 썸네일 및 영상 업로드, 상세 소개 작성까지 실제 인프런 흐름을 따라 만들며, Prisma 모델링, JWT 인증, S3 + CloudFront 업로드, Swagger API 설계 등 실무에 가까운 경험을 쌓을 수 있습니다.

HTML, CSS, JavaScript만으로 OpenAI API를 연동한 AI 웹서비스를 직접 구현합니다. Netlify Functions를 활용해 API 키를 안전하게 보호하고, 정적 프론트엔드 + 서버리스 백엔드 구조로 실제 배포까지 진행합니다. 단순 데모가 아닌, 수익화 가능한 구조의 MVP를 처음부터 끝까지 IDE 라이브로 완성합니다.

생성형 AI를 활용해 기획부터 디자인, 구현, 배포까지 한 번에 완성하는 실전 웹개발 프로젝트 강의입니다. Stitch와 Figma Make를 활용해 디자인을 만들고, AI Studio로 코드를 생성하여 실제 서비스로 배포합니다. 코드를 많이 몰라도 AI와 함께 개발하는 방법을 배우며, 나만의 AI 웹앱을 완성합니다. 이제 여러분도 AI와 협업하는 개발자가 됩니다.

Next.js로 개인 블로그를 만들며 Next.js를 손에 익혀봐요!

초보자, 개발 입문자들도 충분히 따라할 수 있는 튜토리얼식 클로드 코드 개발 강의입니다. 기획자, 디자이너, 비 개발자를 대상으로 오프라인에서 강의한 경험을 토대로 책에 다루지 않는 초급 예제부터 중급 개발 예제까지 한 흐름으로 배울 수 있습니다. 클로드 코드를 활용해 Hello World부터 럭키드로우, 클로드 디자인 + 엑셀 데이터 연동을 통한 디바이스별 최적화 카페 메뉴 관리 웹 페이지, DB와 클라우드 서비스에 올릴 수 있는 SaaS 웹 애플리케이션까지 단계별로 개발하는 과정을 경험합니다. 이론/실습/프로젝트의 단계별로 튜토리얼이 제공되며, 6단계 레벨별 실습을 통해 AI 협업 개발 방법론을 익히고, 클라우드 배포와 운영까지 전체 개발 사이클을 경험합니다.

"왜 AI가 이런 코드를 짰지?", "왜 방금 말한 걸 기억 못 하지?" 클로드 코드(Claude Code)와 같은 AI 도구를 쓰다 보면 마주하는 답답함, 그 원인은 도구가 어떻게 동작하는지 모르니까입니다. 이 강의는 그 블랙박스를 투명하게 열어젖힙니다. 우리는 25강에 걸쳐 LLM에게 파일을 보는 '눈(Read)', 코드를 고치는 '손(Edit)', 명령을 수행하는 '발(Bash)'을 직접 달아주며, 실제 현업 도구와 똑같이 동작하는 나만의 Coding Agent를 밑바닥부터 구현합니다. 단순히 라이브러리 사용법을 배우는 것이 아닙니다. AI가 어떻게 프로젝트 구조를 파악하고, 왜 긴 대화에서 기억을 잃는지, 그것을 기술적으로 어떻게 해결하는지(Sliding Window, Summary) 직접 코드로 구현하며 체득합니다. 이 과정을 통해 여러분은 AI 도구의 단순한 '사용자'에서, 작동 원리를 꿰뚫고 도구를 내 입맛대로 개조하고 평가할 수 있는 'AI 공급자'의 시야를 갖게 될 것입니다.

테스트를 먼저 설계하면, 구현은 AI가 대신합니다. 개발 속도와 품질을 동시에 잡는 실무형 개발 방식!

라이브러리는 선택이지만, 웹 표준 기술은 필수입니다. 웹 애니메이션의 새로운 표준인 Web Animation API에 남들보다 빠르게 적응하고, 실무에도 바로 활용해보세요!

애플 웹사이트에 자주 등장하는 고급 인터랙션 효과들을 처음부터 직접 개발하는 방법을 배울 수 있습니다.

CSS Grid는 복잡한 레이아웃도 간단하고 직관적으로 구현할 수 있는 강력한 도구입니다. 이번 강의에서는 CSS Grid의 핵심 개념부터 실전 활용법까지 단계별로 쉽게 배울 수 있도록 구성했습니다. 이제 복잡한 float과 flexbox에 얽매이지 말고, 효율적인 레이아웃 설계의 정석을 배워보세요! 지금 바로 시작하세요!

코딩 몰라도 OK! 당신의 아이디어를 단 4주 만에 실제 수익으로 바꿔보세요. AI와 최신 도구를 활용해, 웹사이트와 앱을 동시에 만들고 바로 서비스까지 연결합니다.

AI 시대에 반드시 필요한 AI를 활용하여 최적의 결과물을 얻고 싶으신 분들을 위해 준비했습니다. 2시간 만에 AI 활용을 코딩으로 제대로 알아보실 수 있습니다.

Unity와 Claude Code를 MCP로 연결해 코딩 지식 없이도 AI에게 개발을 요청하는 방식으로 매칭3 게임을 완성합니다. 환경 세팅부터 게임 시스템 구현, 모바일 대응, 광고 수익화까지 실전 게임 개발의 전 과정을 경험할 수 있습니다.

단순히 화면을 그려내는 것을 넘어, '진짜 시스템'을 고민해 본 적 있으신가요? 많은 개발자가 공통으로 마주하는 진짜 문제는 따로 있습니다. 겉보기엔 그럴듯한데 데이터 동기화는 수시로 꼬이고, 속도는 답답하며, 기능이 조금만 추가되어도 어디서부터 손을 댈지 모르게 되는 '가짜 풀스택'의 한계죠. 이건 단순히 Next.js의 기능을 하나 더 외운다고 해결될 문제가 아닙니다. 본 강의는 이 답답함을 뿌리부터 해결해 드릴게요. 기능을 나열하는 백과사전식 수업은 지루하잖아요? 대신 컴퓨터 과학(CS)의 근본 원리와 Next.js의 심화 아키텍처를 아주 끈끈하게 결합했습니다. 수백만 명의 트래픽이 몰려도 유연하게 버텨내고, 데이터의 일관성을 완벽하게 유지하는 엔터프라이즈급 설계 능력을 여러분의 손끝에 직접 이식해 드립니다.

코딩 처음부터 내 앱 출시까지 한 번에?! 기본기와 실전을 하나로 잇는, 앱 빌드 올인원.

4개 강좌로 구성된 자바스크립트 바이블 강좌의 1번째 강좌입니다. 기본에 충실하였습니다. 자바스크립트의 근본을 이해하는데 중점을 두었습니다. 자바스크립트 스펙의 95% 이상을 다룹니다.

AI는 딱 당신만큼만 훌륭합니다. AI 활용법 → 기초 핵심 지식 → 프로젝트 개발 3단계로 완성하는 완벽한 바이브 코딩. 바이브 코딩을 제대로 배워보고 싶은 분들을 위해, 어떤 AI를 사용하더라도 변하지 않는 핵심 개념들을 한 입 크기로 잘라 전달해 드립니다.

웹 개발을 활용해서 Android와 IOS에 서비스 가능한 모바일앱 개발을 할 수 있도록 도와주는 강의입니다.

클로드코드 강의는 이걸로 종결하겠습니다. 이 강의는 클로드 코드가 어떻게, 그리고 왜 그렇게 동작하는지를 끝까지 파고들고, 하네스 엔지니어링의 구성요소를 직접 적용하는 법은 물론 공개된 프로덕션 코드까지 직접 해부합니다. 10년+ 현업 개발자의 노하우를 그대로 가져가, AI 에이전트 시대에서 핵심인재로 거듭나세요.