VibeCoding 365 처음이라면 여기부터 · 겁먹지 말고 10분만
어디서부터 시작할지 막막하죠? 준비물은 딱 두 개, 외울 흐름은 한 줄이면 끝납니다. 아래 순서대로만 따라오면 누구나 첫 화면을 띄울 수 있어요.
그냥 이 글부터 열기18분 가이드 · 첫 화면 띄우기까지복잡한 말 몰라도 됩니다. 일단 실행 버튼 누를 준비만 해요.
Cursor로 시작해도 되고, Codex·Claude Code도 흐름은 같습니다.
만들고 싶은 걸 한국어로 말하고, 에러는 그대로 복붙하세요.
코딩 한 번 안 해본 쌩초보가 자기 컴퓨터에서 첫 웹 앱을 띄우기까지. Node.js와 커서 딱 두 개만 깔고, 계획→요청→질문→반복 루프만 익히면 됩니다. 커서로 시작하되 코덱스·클로드 코드·오픈코드·안티그래비티+GLM도 같은 방식이라는 점을 함께 정리했습니다.
3 steps
복잡한 설치는 필요 없어요. Node.js와 코딩 툴(커서) 두 개만 깔면 출발 준비 끝. 나머지는 AI가 알아서 도와줍니다.
바로 "다 만들어 줘"라고 하기보다, AI에게 무엇을 만들지 계획(README·플랜)부터 정리시키면 훨씬 매끄럽게 흘러갑니다.
원하는 걸 한국어로 말하고, 에러가 나면 그 메시지를 그대로 AI에게 붙여넣으세요. 이 반복이 바이브 코딩의 거의 전부입니다.
처음 듣는 단어는 짧은 설명과 예시로 바로 확인하세요.
막히면Q&A로 질문하기상황과 목표만 적으면 공개 답변 흐름으로 정리됩니다.
더 깊게바이브코딩 학습 허브기초부터 자동화 운영까지 단계별 가이드로 이어집니다.
전체 가이드
쌩초보 완전 가이드
<div class="beginner-hero"> <span class="beginner-hero-eyebrow">코딩 1도 몰라도 OK</span> <p class="beginner-hero-title">쌩초보도 됩니다<br />읽지 말고 그냥 따라만 하세요</p> <p class="beginner-hero-sub">딱 3개만 하면 내 컴퓨터에 첫 화면이 뜹니다. 어려운 설명은 아래에서 천천히 풀어줄게요.</p> <div class="beginner-hero-steps"> <div class="beginner-hero-step"><span class="beginner-hero-step-no">1</span><span class="beginner-hero-step-label">Node.js 설치</span><span class="beginn…