🤔 Node.js가 없으면 바이브코딩을 할 수 없는 이유

바이브코딩(Vibe Coding)은 AI에게 "회원가입 페이지 만들어줘"라고 말하면 실제 동작하는 코드를 받는 방식입니다. 그런데 AI가 만들어준 코드는 대부분 JavaScript 기반입니다. 웹 프로젝트에서 JavaScript가 사실상 표준 언어이기 때문입니다.

Node.js는 이 JavaScript 코드를 내 컴퓨터에서 실행할 수 있게 해주는 실행 환경입니다. 엑셀이 없으면 .xlsx 파일을 열 수 없는 것처럼, Node.js가 없으면 AI가 만들어준 웹 프로젝트를 로컬에서 돌려볼 수 없습니다. 프로젝트를 생성하는 명령어(npx create-next-app)도 Node.js가 설치돼 있어야 실행됩니다.

결국 Node.js는 바이브코딩의 출발점입니다. 이 글에서는 Node.js를 설치하고, 정상 동작을 확인하고, 첫 프로젝트를 실행하기까지의 과정을 3단계로 정리합니다.

📌 시작 전에 알아야 할 핵심 개념

Node.js를 설치하기 전에 자주 등장하는 용어 세 가지를 짚고 갑니다. 이 개념을 모르면 설치 후에도 에러 메시지를 이해할 수 없어서 막히게 됩니다.

용어	의미	비유
Node.js	JavaScript를 브라우저 밖에서 실행하는 환경	한글 문서를 여는 한글 뷰어
npm	Node.js와 함께 설치되는 패키지 관리자	앱스토어처럼 필요한 도구를 설치하는 프로그램
LTS	Long Term Support, 장기 지원 안정 버전	검증된 안정판 (최신 실험 버전과 구분)

npm은 Node.js를 설치하면 자동으로 따라옵니다. 별도 설치가 필요 없습니다. LTS는 Node.js 공식 사이트에서 다운로드할 때 두 가지 버전 중 왼쪽에 있는 것이 보통 LTS입니다. 최신 기능보다 안정성이 중요한 바이브코딩에서는 항상 LTS를 선택하세요.

💡 npx는 무엇인가

npx는 npm에 포함된 명령어로, 패키지를 설치하지 않고 바로 실행할 수 있게 해줍니다. 바이브코딩에서 npx create-next-app을 사용하는 이유는, Next.js 프로젝트 생성 도구를 매번 설치할 필요 없이 한 번만 실행하면 되기 때문입니다. Node.js를 설치하면 npx도 함께 사용할 수 있습니다.

🔽 1단계: Node.js 설치

운영체제에 따라 설치 방법이 다릅니다. 자신의 OS에 맞는 섹션을 따라가세요.

🪟 Windows에서 설치

Node.js 공식 사이트(nodejs.org)에 접속하면 두 가지 버전이 나란히 표시됩니다. 왼쪽의 LTS 버전을 클릭해서 설치 파일(.msi)을 다운로드하세요. 설치 마법사가 시작되면 모든 옵션을 기본값(Next)으로 진행합니다.

설치 중 "Automatically install the necessary tools" 체크박스가 나올 수 있습니다. 이 옵션은 C++ 빌드 도구를 추가로 설치하는데, 바이브코딩 입문 단계에서는 체크하지 않아도 됩니다. 체크하면 설치 시간이 크게 늘어납니다.

설치가 끝나면 반드시 열려 있는 모든 터미널(PowerShell, cmd)을 닫고 새로 열어야 합니다. 기존 터미널에는 Node.js의 환경변수(PATH)가 반영되지 않은 상태이기 때문입니다.

🍎 macOS에서 설치

macOS에서는 두 가지 방법이 있습니다. Homebrew가 이미 설치돼 있다면 터미널에서 한 줄이면 끝납니다.

brew install node

Homebrew가 없다면 Node.js 공식 사이트(nodejs.org)에서 macOS용 LTS 설치 파일(.pkg)을 다운로드해서 실행하세요. 설치 옵션은 기본값으로 진행하면 됩니다.

Apple Silicon(M1/M2/M3/M4) Mac 사용자라면 Homebrew로 설치하는 것을 권장합니다. 공식 사이트 설치 파일이 Intel용으로 잡히는 경우가 간혹 있어서, Homebrew가 자동으로 칩 아키텍처에 맞는 버전을 설치해주는 게 더 확실합니다.

✅ 2단계: 설치 확인과 검증

설치가 끝났다고 바로 다음 단계로 넘어가지 마세요. 설치가 정상적으로 됐는지 확인하는 과정이 중요합니다. 이 단계를 건너뛰면 나중에 프로젝트를 만들 때 원인을 알 수 없는 에러를 만나게 됩니다.

터미널을 새로 열고 아래 세 가지 명령어를 순서대로 입력하세요.

node -v
npm -v
npx -v

🟢 정상 결과

명령어	예상 출력	의미
`node -v`	`v20.18.0` 등	Node.js 설치 완료
`npm -v`	`10.8.2` 등	패키지 관리자 정상
`npx -v`	`10.8.2` 등	프로젝트 생성 도구 사용 가능

세 가지 모두 버전 번호가 나오면 Node.js가 정상적으로 설치된 것입니다.

🔴 실패 시 대처

"command not found" 또는 "'node'은(는) 내부 또는 외부 명령이 아닙니다"라는 메시지가 나오면 두 가지를 확인하세요.

터미널을 새로 열었는지: 설치 직후에는 환경변수가 반영되지 않은 상태입니다. 기존 터미널을 닫고 새로 여세요.
PATH에 Node.js가 등록됐는지: Windows라면 시작 메뉴에서 "환경 변수"를 검색해서 Path 목록에 C:\Program Files\nodejs\가 있는지 확인합니다. 없으면 수동으로 추가하세요.

macOS에서 brew install node 후에도 인식이 안 되면 터미널에 아래 명령어를 입력해보세요.

eval "$(/opt/homebrew/bin/brew shellenv)"

Apple Silicon Mac에서 Homebrew의 PATH가 자동 등록되지 않은 경우에 필요한 명령어입니다. 이 명령어를 실행한 뒤 node -v가 정상 출력되면, ~/.zshrc 파일에 같은 명령어를 추가해서 터미널을 열 때마다 자동으로 적용되게 하세요.

🚀 3단계: 첫 프로젝트 실행

Node.js가 정상적으로 설치됐다면 바로 첫 웹 프로젝트를 만들어볼 수 있습니다. 이 단계에서 실제로 브라우저에서 결과를 확인하면, 개발환경이 제대로 동작하는지 최종 검증이 됩니다.

📁 프로젝트 생성

터미널에서 프로젝트를 만들고 싶은 폴더로 이동한 뒤 아래 명령어를 실행하세요.

npx create-next-app@latest my-first-site

몇 가지 옵션을 물어봅니다. 처음이라면 모두 기본값(Enter)으로 진행하면 됩니다. TypeScript를 사용할지, ESLint를 사용할지 등을 묻는데, 기본값이 바이브코딩에 적합한 설정입니다.

프로젝트 생성이 끝나면 해당 폴더로 이동합니다.

cd my-first-site

▶️ 개발 서버 실행

프로젝트 폴더 안에서 아래 명령어를 실행하세요.

npm run dev

터미널에 http://localhost:3000 주소가 표시됩니다. 이 주소를 웹 브라우저에 붙여넣으면 Next.js 기본 페이지가 나타납니다. 이 화면이 보인다면 Node.js 설치부터 프로젝트 실행까지 모든 과정이 정상적으로 완료된 것입니다.

개발 서버를 종료하려면 터미널에서 Ctrl+C를 누르세요.

🎯 여기까지 왔다면

축하합니다. 이제 AI에게 "이 프로젝트의 메인 페이지를 포트폴리오 사이트로 바꿔줘"처럼 요청하면, AI가 만들어준 코드를 이 프로젝트에 적용하고 바로 결과를 확인할 수 있습니다. 바이브코딩의 핵심 루프가 완성된 셈입니다.

⚠️ 자주 발생하는 문제와 해결 방법

🚫 "npm ERR! code EACCES" (macOS)

macOS에서 글로벌 패키지를 설치할 때 권한 오류가 나는 경우입니다. sudo를 붙여서 해결할 수도 있지만, 근본적으로는 npm의 기본 디렉토리 권한을 변경하는 게 좋습니다. 하지만 바이브코딩 입문 단계에서는 npx로 프로젝트를 생성하는 정도만 하기 때문에 이 에러를 만날 일이 드뭅니다. 만약 발생하면 Homebrew로 Node.js를 재설치하는 것이 가장 깔끔합니다.

🚫 Node.js 버전이 너무 낮다는 경고

create-next-app을 실행했을 때 "Node.js 18 이상이 필요합니다" 같은 메시지가 나오면 설치된 Node.js 버전이 오래된 것입니다. 기존 Node.js를 삭제하고 공식 사이트에서 LTS를 새로 설치하세요. Windows에서는 "프로그램 추가/제거"에서 Node.js를 삭제하면 됩니다. macOS에서 Homebrew를 쓰고 있다면 brew upgrade node로 업그레이드할 수 있습니다.

🚫 "npx: command not found"

Node.js가 설치됐는데 npx만 인식되지 않는 경우는 매우 드뭅니다. npm 버전이 5.2.0 미만일 때 발생할 수 있습니다. npm -v로 버전을 확인하고, 너무 낮다면 npm install -g npm으로 npm을 업데이트하세요. 그래도 안 되면 Node.js를 완전히 삭제하고 LTS를 새로 설치하는 게 가장 빠릅니다.

🚫 "create-next-app" 실행 중 멈춤

프로젝트 생성 명령어가 "Installing dependencies..."에서 오래 멈추는 경우가 있습니다. 네트워크 상태에 따라 5분까지 걸릴 수 있으니 조금 기다려보세요. 10분 이상 멈춰 있다면 Ctrl+C로 중단하고, 생성된 폴더를 삭제한 뒤 다시 시도하세요. 회사나 학교 네트워크에서 프록시를 사용하는 경우 npm이 차단될 수 있습니다.

🔄 LTS 버전과 Current 버전, 어떤 걸 선택할까

Node.js 공식 사이트에 가면 두 가지 버전이 나란히 있습니다. 왼쪽이 LTS, 오른쪽이 Current입니다. 바이브코딩에서는 어떤 걸 골라야 할까요?

구분	LTS	Current
안정성	높음 (검증된 버전)	보통 (새 기능 포함)
지원 기간	30개월	6개월
패키지 호환성	대부분 호환	일부 미호환 가능
추천 대상	바이브코딩, 실무	최신 기능이 필요한 개발자

결론은 명확합니다. 바이브코딩에서는 항상 LTS를 선택하세요. AI가 생성하는 코드와 사용하는 패키지들이 LTS 기준으로 테스트되기 때문에, Current 버전에서는 예상치 못한 호환성 문제가 생길 수 있습니다.

💡 Node.js 설치 후 알아두면 좋은 팁

📌 버전 관리가 필요해지면 nvm

나중에 프로젝트마다 다른 Node.js 버전이 필요해지면 nvm(Node Version Manager)을 사용할 수 있습니다. 하지만 바이브코딩을 시작하는 단계에서는 nvm 없이 LTS 하나만 설치해도 충분합니다. 프로젝트가 늘어나서 버전 충돌이 생기기 시작하면 그때 nvm을 도입해도 늦지 않습니다.

📌 터미널은 VS Code 내장 터미널을 쓰세요

VS Code가 설치돼 있다면 별도 터미널을 열 필요 없이 VS Code 안에서 바로 명령어를 실행할 수 있습니다. Ctrl+` (백틱)을 누르면 하단에 터미널이 열립니다. 코드 편집과 명령어 실행을 한 화면에서 할 수 있어서 바이브코딩 작업 흐름에 최적화돼 있습니다.

📌 node_modules 폴더는 건드리지 마세요

프로젝트를 생성하면 node_modules라는 폴더가 만들어집니다. 이 폴더에는 프로젝트에 필요한 수천 개의 패키지 파일이 들어 있습니다. 이 폴더를 직접 수정하거나 삭제하면 프로젝트가 동작하지 않습니다. 실수로 삭제했다면 프로젝트 폴더에서 npm install을 실행하면 다시 생성됩니다.

⚡ 더 빠르게: VibeStart로 한 번에 세팅

위 과정을 하나씩 따라하는 게 어렵게 느껴진다면 VibeStart를 이용해보세요. 운영체제를 선택하면 Git, Node.js, VS Code 설치 명령어를 단계별로 안내합니다. 각 명령어를 복사해서 터미널에 붙여넣기만 하면 되기 때문에, 환경변수 문제나 버전 선택에서 고민할 필요가 없습니다.

특히 Windows에서 환경변수(PATH) 문제로 막히는 경우가 많은데, VibeStart는 이런 부분을 자동으로 처리하는 스크립트를 제공합니다.

Node.js 설치부터 바이브코딩 시작까지 3단계 (2026)