프론트엔드 개발하면서 npm run dev를 실행하면 브라우저에서 개발 서버가 뜨는 걸 볼 수 있다.
그런데 이게 Node.js를 실행한 거랑 같은 걸까? 🤔
많은 초보 개발자들이 헷갈려하는 부분이라 제대로 정리해보겠다.
🎯 1. npm run dev가 Node.js 실행이 아닐 수도 있다?
우리는 보통 npm run dev 하면 Node.js가 실행될 거라고 착각하지만, 사실 그건 어떤 스크립트가 설정되어 있느냐에 따라 달라진다.
예를 들어, package.json 파일이 이렇게 되어 있다고 해보자.
"scripts": {
"dev": "parcel index.html",
"build": "parcel build index.html"
}
이 상태에서 npm run dev를 실행하면?
➡ Node.js가 아니라 Parcel이 실행된다! 🚨
즉, npm run dev는 Node.js 서버를 띄우는 게 아니라 Parcel 번들러를 실행하는 것이다.
이런 경우, 백엔드(Node.js)가 아니라 프론트엔드(HTML, JS, CSS)를 번들링하고 개발 서버를 띄우는 것이다.
🔥 2. Parcel은 Node.js랑 무슨 관계야?
여기서 한 가지 궁금증이 생길 수 있다.
"Node.js가 실행되는 게 아니라면, 그럼 Parcel은 Node.js 없이 동작할 수 있는 거야?"
👉 아니! Parcel은 Node.js 기반으로 실행된다.
즉, Node.js는 Parcel을 실행하는 역할만 할 뿐, 직접 실행되는 건 아님.
Parcel은 프론트엔드 번들러이기 때문에, 내부적으로 fs(파일 시스템), http(서버 통신) 같은 Node.js 기능을 활용한다.
그래서 Parcel을 사용하려면 Node.js가 설치되어 있어야 한다.
하지만!
✅ Node.js는 Parcel을 실행하는 것일 뿐, Parcel이 Node.js 서버를 띄우는 건 아니다!
🧐 3. 진짜 Node.js 실행이면 어떻게 해야 해?
진짜 Node.js 서버를 실행하려면 "dev" 스크립트에서 직접 Node.js를 실행하도록 해야 한다.
예를 들어, Node.js 기반의 서버를 실행하려면 package.json을 이렇게 바꿔야 한다.
"scripts": {
"dev": "node server.js"
}
그리고 server.js 파일을 만들고, Node.js 서버 코드를 작성하면 된다.
const http = require('http');
const server = http.createServer((req, res) => {
res.writeHead(200, { 'Content-Type': 'text/plain' });
res.end('Hello, Node.js Server!');
});
server.listen(3000, () => {
console.log('Server running at http://localhost:3000/');
});
이제 npm run dev 하면 진짜 Node.js 서버가 실행된다!
➡ http://localhost:3000/에 접속하면 "Hello, Node.js Server!"라는 문구가 출력됨.
⚡ 4. npm run dev의 실행 방식 비교
실행 방식 | 동작 |
node server.js | Node.js 서버 직접 실행 |
npm run dev ("dev": "node server.js") | Node.js 서버 실행 (npm 스크립트 사용) |
npm run dev ("dev": "parcel index.html") | Parcel 실행 (프론트엔드 개발 서버 띄우기) |
✅ Node.js를 직접 실행하려면 node 명령어를 사용해야 한다.
✅ npm run dev는 그냥 "scripts"에서 설정된 명령어를 실행할 뿐이다.
✅ 네가 실행한 "dev": "parcel index.html"은 Node.js가 아니라 Parcel을 실행하는 것이다.
🚀 5. 결론
✔ npm run dev가 항상 Node.js를 실행하는 건 아니다.
✔ package.json에서 "dev" 스크립트가 무엇으로 설정되어 있는지 확인해야 한다.
✔ "dev": "parcel index.html"이면 Parcel 개발 서버가 실행되는 거지, Node.js 서버가 실행되는 게 아니다!
✔ 진짜 Node.js를 실행하려면 "dev": "node server.js"처럼 설정해야 한다.
🎯 이제 어떻게 하면 될까?
📌 원래 Node.js 서버를 실행하려고 했던 거라면?
➡ "dev": "node server.js"로 바꾸고 server.js 파일을 만들어라.
📌 프론트엔드 개발 서버를 실행하고 싶었던 거라면?
➡ "dev": "parcel index.html" 그대로 두고 npm run dev 쓰면 된다.
이제 npm run dev 실행할 때마다 이게 Node.js를 실행하는 건지, Parcel을 실행하는 건지 헷갈리지 말자! 🚀
'Frontend' 카테고리의 다른 글
[Web] LocalStorage, SessionStorage, Cookie의 차이 (0) | 2024.09.27 |
---|