33개 문서가 "vibe-coding" 태그에 분류되었습니다

Claude Code의 공식 프론트엔드 디자인 스킬. 슬래시 커맨드 한 줄로 다양한 미학 방향 중 하나를 골라 프로급 UI를 뽑아냅니다.

한 번에 전부 만들지 말고, 기능 하나씩 완성하고 커밋하는 수직 슬라이싱 기법을 배웁니다. 10분 안에 확인 못 하면 너무 큰 겁니다.

HTML+CSS에서 한 단계 올라가, Next.js 프레임워크로 진짜 서비스의 화면을 만들어봅니다. 컴포넌트는 레고 블록, Tailwind CSS는 색칠 스티커예요.

새로고침해도 안 사라지는 데이터를 만들려면 데이터베이스가 필요해요. Supabase로 테이블을 만들고 CRUD(만들기/읽기/수정/삭제)를 실습합니다.

혼자 다 만들 필요 없어요. 날씨, 지도, AI 같은 남의 서비스를 내 앱에 가져다 쓰는 방법을 배웁니다. API라는 주문 창구를 통해서요.

누가 쓰는지 알아야 '내 데이터'를 보여줄 수 있어요. Supabase Auth로 이메일 로그인과 소셜 로그인을 만들고, RLS로 내 데이터를 보호하는 법을 배웁니다.

에러 메시지를 읽을 줄 몰라도 괜찮아요. 복사해서 AI에게 붙여넣기만 하면 됩니다. 바이브 코딩에서 에러를 대하는 완벽한 자세와 디버깅 방법을 알아봅니다.

Vercel을 이용해 내 프로젝트를 인터넷에 공개하는 전 과정을 안내합니다. 환경 변수 설정, 자동 배포, 커스텀 도메인 연결까지 클릭 몇 번이면 충분해요.

배포 후 사용자 피드백을 수집하고 지속적으로 앱을 개선하는 사이클을 배웁니다.

스타일 이름을 알면 AI에게 정확한 주문이 가능해요. /frontend-design 스킬로 프로 수준의 UI를 만드는 법을 알아봐요.

매일 반복하는 작업이 있다면 한 번만 만들어두면 끝이에요. 크론과 웹훅의 개념부터 GitHub Actions 실전까지 안내합니다.

AI에게 방향만 알려주면 코드가 완성되는 새로운 개발 방식, 바이브 코딩의 세계에 오신 걸 환영합니다.

웹사이트인데 앱처럼 쓸 수 있어요. PWA로 홈 화면 설치, 오프라인 동작까지 가능한 모바일 앱을 만드는 법을 알아봐요.

프롬프트, 토큰, 프론트엔드, 백엔드, API, 데이터베이스... AI에게 올바른 지시를 하려면 알아야 할 핵심 용어를 생활 속 비유로 풀어드려요.

전시월·포토월 디자인을 업로드하면 2D/3D 목업으로 즉시 확인 — Vanilla JS + Three.js + Vercel Serverless

GitHub 가입부터 Claude Code 설치, 에디터 선택, 터미널 기초까지. 이 30분이 수백 시간을 좌우해요.

바이브 코딩의 관제탑, VS Code를 내 손에 맞게 세팅해서 작업 속도를 2배로 올려보세요.

바이브 코더를 위한 Git과 GitHub의 기초 개념을 게임 세이브 비유로 쉽고 재미있게 배웁니다.

아이디어를 찾는 4가지 방법과, Claude에게 PRD를 작성시키는 실전 기획법을 배웁니다.

같은 AI인데 결과가 10배 달라지는 비밀. 프롬프트 3요소와 나쁜/좋은 프롬프트 비교 5쌍, 레퍼런스 활용법까지 실전으로 배웁니다.

7강에서 배운 프롬프트 기술을 총동원해서, HTML+CSS로 개인 웹페이지를 만들고 GitHub Pages로 무료 배포합니다. 오늘 끝나면 내 이름이 적힌 URL이 생겨요.

CLAUDE.md에 프로젝트 규칙을 한 번 적어두면, AI가 매번 알아서 따릅니다. context7 설치, settings.json 설정, 메모리 시스템까지 한 번에 세팅하세요.

Claude Code Pro 구독만으로 토큰이 부족할 때, Gemini 구독을 로컬 프록시로 연결해서 글 생성 같은 대량 작업을 처리하는 방법을 알려드려요.

AI가 최신 공식 문서를 직접 참고해서 코드를 짜게 해주는 MCP 서버. 라이브러리 버전 문제로 배포가 막히는 경험, 이제 안 해도 돼요.

애플·스트라이프·노션 같은 유명 브랜드의 디자인 시스템을 DESIGN.md 파일 하나로 받아서, AI 코딩 에이전트가 일관된 UI를 만들도록 시키는 방법을 알려드릴게요.

대행사 견적 월 300만 원짜리 마케팅 컨설팅을 월 12,900원 AI로 압축. 코드 한 줄 쓸 줄 모르는 디온웍스 대표가 바이브 코딩만으로 설계·개발·운영 중인 AI 네이티브 SaaS, 그 전 과정을 해부합니다.

SVG 한국 지도로 전국 맛집을 기록하고 공유하는 맛집 큐레이션 서비스 — Next.js + Supabase

코드 한 줄 없이 Flutter Android 앱을 30일 만에 Google Play 정식 출시. AdMob·Google Ads 캠페인 인프라까지 100% AI 네이티브로 완성한 꿈해몽·타로·사주 앱 '몽타주' 의 제작기.

어떤 기술로 만들어야 할지 모르겠을 때, AI에게 세계적인 서비스를 벤치마킹시키면 맞춤 기술 스택을 추천받을 수 있습니다.

제품 정보 3개만 입력하면 AI가 상품 카피·상품명·검색태그를 한번에 생성 — Next.js + Gemini + 네이버 API

Claude Code에서 프레젠테이션을 만드는 세 가지 방법(slide-creator, PPTX 직접 생성, frontend-design)의 차이를 비교하고, 상황별 최적 선택을 안내합니다.

코드 한줄도 모르는 내가, 이제는 개발자 — 설계하고, 대화하고, 검증한다.

팀원 일정·배송·날씨를 한 화면에 — Next.js + Supabase 팀 캘린더