Node.js 시작하기: 설치부터 첫 프로젝트까지 완벽 가이드

1. Node.js 설치: 든든한 첫걸음

Node.js를 사용하기 위한 첫 번째 단계는 바로 설치입니다. 아래 단계를 따라 차근차근 진행해보세요.

1.1. 공식 웹사이트 방문 및 다운로드

먼저, Node.js 공식 웹사이트에 접속합니다. 홈페이지에서 두 가지 버전의 Node.js를 확인할 수 있습니다.

• LTS (Long Term Support): 안정성과 호환성이 중요한 프로젝트에 적합하며, 장기적인 지원을 보장합니다.
• Current: 최신 기능이 포함되어 있지만, 업데이트가 잦을 수 있습니다. 새로운 기능을 실험해보고 싶을 때 유용합니다.

일반적으로는 LTS 버전을 선택하는 것을 추천합니다. 자신의 운영체제(Windows, macOS, Linux)에 맞는 설치 파일을 다운로드하세요.

1.2. 설치 마법사 실행 및 설정

다운로드한 설치 파일을 실행하면 설치 마법사가 시작됩니다. 대부분의 경우 기본 옵션을 그대로 유지하고 진행해도 무방합니다.

• "Add to PATH" 옵션: 이 옵션을 선택하면 명령 프롬프트나 터미널에서 node 명령어를 바로 사용할 수 있도록 환경 변수에 Node.js 경로가 추가됩니다. 편리한 사용을 위해 체크하는 것을 권장합니다.

1.3. 설치 확인: 제대로 설치되었는지 확인

설치가 완료되면, 터미널(macOS, Linux) 또는 명령 프롬프트(Windows)를 열고 다음 명령어를 입력하여 Node.js와 npm이 정상적으로 설치되었는지 확인합니다.

node -v
npm -v

각 명령어는 설치된 Node.js와 npm의 버전을 출력합니다. 버전 정보가 정상적으로 출력된다면 성공적으로 설치된 것입니다.

추가 확인: Node.js 버전뿐만 아니라, 함께 설치된 npm 패키지의 상세 정보도 확인해볼 수 있습니다.

npm list -g --depth=0 # 전역으로 설치된 패키지 목록 확인

이 명령은 사용자 컴퓨터에 전역으로 설치된 npm 패키지 목록을 보여줍니다. --depth=0 옵션을 추가함으로써 직접 설치한 패키지만 볼 수 있습니다.

1.4. 환경 변수 설정 (선택 사항, Windows)

Windows 사용자 중, Node.js를 기본 경로가 아닌 다른 위치에 설치한 경우, 시스템 환경 변수에 Node.js 경로를 직접 추가해야 할 수 있습니다.

1. 제어판 > 시스템 및 보안 > 시스템 > 고급 시스템 설정으로 이동합니다.
2. '환경 변수' 버튼을 클릭합니다.
3. '시스템 변수' 항목에서 'Path' 변수를 찾아 편집을 클릭합니다.
4. '새로 만들기'를 클릭하고 Node.js가 설치된 경로(예: C:\Program Files\nodejs\)를 추가합니다.
5. '확인'을 눌러 변경 사항을 저장합니다.

설정 확인: 설정된 환경 변수를 확인하고 싶다면, 명령 프롬프트에서 다음 명령어를 입력해보세요.

echo %PATH%

이 명령은 현재 시스템에 설정된 모든 환경 변수 경로를 보여줍니다. 출력된 결과에서 Node.js 설치 경로가 포함되어 있는지 확인할 수 있습니다.

728x90

2. npm (Node Package Manager): 패키지 관리 도구 활용법

npm은 Node.js 생태계의 핵심 요소 중 하나로, 다양한 패키지(라이브러리, 모듈)를 관리하는 도구입니다. npm을 이용하면 필요한 패키지를 쉽게 설치, 업데이트, 삭제할 수 있습니다.

2.1. 기본 명령어 익히기

• 프로젝트 초기화 (npm init): 새로운 Node.js 프로젝트를 시작할 때 사용하는 명령어입니다. 프로젝트 폴더를 생성하고 해당 폴더 내에서 npm init -y 명령어를 실행하면 package.json 파일이 자동 생성됩니다. -y 옵션은 모든 질문에 기본값으로 대답하도록 합니다.세부 설정: npm init 명령어를 옵션 없이 실행하면, 프로젝트 이름, 버전, 설명 등 여러 가지 정보를 직접 입력할 수 있습니다.이 방법을 사용하면 package.json 파일을 더 세밀하게 설정할 수 있습니다.
• npm init
• mkdir my-project # my-project라는 디렉토리 생성 cd my-project # 생성한 디렉토리로 이동 npm init -y # package.json 파일 자동 생성
• 패키지 설치 (npm install): 프로젝트에 필요한 패키지를 설치합니다.예를 들어, Express 웹 프레임워크를 설치하려면 다음과 같이 입력합니다.개발 의존성 설치: 패키지를 설치할 때 --save-dev 옵션을 사용하면, 해당 패키지를 개발 의존성으로 설치할 수 있습니다. 개발 의존성은 개발 과정에서만 필요하고 실제 애플리케이션 실행에는 필요하지 않은 패키지(예: 테스트 프레임워크)를 관리하는 데 유용합니다.이 명령은 테스트 프레임워크인 mocha를 개발 의존성으로 설치합니다.
• npm install mocha --save-dev
• npm install express
• npm install <패키지명>
• 패키지 제거 (npm uninstall): 더 이상 필요하지 않은 패키지를 제거합니다.
• npm uninstall <패키지명>
• 패키지 검색 (npm search): npm 저장소에서 사용 가능한 패키지를 검색합니다.
• npm search <검색어>
• 설치된 패키지 목록 확인 (npm list): 현재 프로젝트에 설치된 패키지 목록을 확인합니다.--depth=0 옵션은 프로젝트에 직접적으로 설치된 패키지만 보여줍니다.

  npm view express

  이 명령어는 express 패키지의 최신 버전, 설명, 의존성 등 다양한 정보를 보여줍니다.
• 패키지 정보 확인: 특정 패키지의 정보를 자세히 보고 싶다면 npm view 명령어를 사용할 수 있습니다.
• npm list --depth=0
• 패키지 전역 설치 (npm install -g): 특정 패키지를 컴퓨터 전역에서 사용하고 싶을 때 (예: CLI 도구) 사용하는 옵션입니다.nodemon은 코드가 변경될 때 자동으로 서버를 재시작해주는 유용한 도구입니다.

  npm update -g nodemon

  이 명령은 전역으로 설치된 nodemon 패키지를 최신 버전으로 업데이트합니다.
• 전역 패키지 업데이트: 전역으로 설치된 패키지를 업데이트하려면 npm update -g <package-name> 명령어를 사용할 수 있습니다.
• npm install -g nodemon

2.2. package.json 파일과 스크립트 활용

package.json 파일은 프로젝트의 메타데이터와 의존성 패키지 정보를 담고 있는 중요한 파일입니다. 또한, "scripts" 항목을 통해 자주 사용하는 명령어들을 단축 명령어로 정의할 수 있습니다.

{
  "name": "my-project",
  "version": "1.0.0",
  "description": "My first Node.js project",
  "main": "index.js",
  "scripts": {
    "start": "node index.js",
    "dev": "nodemon index.js",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "dependencies": {
    "express": "^4.18.2"
  }
}

위 예시에서 npm start를 실행하면 node index.js가 실행되고, npm run dev를 실행하면 nodemon index.js가 실행됩니다. dev 스크립트는 개발 과정에서 유용하게 사용할 수 있습니다.

사용자 정의 스크립트 추가: package.json 파일의 scripts 항목에 사용자 정의 스크립트를 추가할 수도 있습니다. 예를 들어, 데이터베이스 마이그레이션을 실행하는 스크립트를 추가하려면 다음과 같이 작성할 수 있습니다.

"scripts": {
  "start": "node index.js",
  "dev": "nodemon index.js",
  "test": "echo \"Error: no test specified\" && exit 1",
  "migrate": "node db/migrate.js"
}

이제 npm run migrate 명령어를 실행하면 node db/migrate.js 스크립트가 실행됩니다.

3. Node.js 프로젝트 생성 및 초기화: 첫 애플리케이션 개발

이제 Node.js와 npm에 대한 기본적인 이해를 바탕으로, 첫 번째 Node.js 프로젝트를 생성하고 간단한 웹 서버를 만들어 보겠습니다.

3.1. 프로젝트 디렉토리 생성 및 초기화

1. 터미널 또는 명령 프롬프트를 열고 원하는 위치에 프로젝트 디렉토리를 생성합니다.

    mkdir my-first-node-app
    cd my-first-node-app

2. npm init -y 명령어를 실행하여 package.json 파일을 생성합니다.

3.2. Express를 이용한 간단한 웹 서버 만들기

이번 예제에서는 Express 프레임워크를 사용하여 간단한 "Hello, World!" 웹 서버를 만들어 보겠습니다.

1. Express 패키지를 설치합니다.
2. npm install express
3. 프로젝트 루트 디렉토리에 index.js 파일을 생성하고 아래 코드를 작성합니다.
4. // index.js const express = require('express'); // Express 모듈을 불러옵니다. const app = express(); // Express 애플리케이션을 생성합니다. const port = 3000; // 서버가 사용할 포트 번호를 지정합니다. // '/' 경로로 GET 요청이 오면 "Hello, World!"를 응답합니다. app.get('/', (req, res) => { res.send('Hello, World!'); }); // 지정된 포트에서 서버를 실행합니다. app.listen(port, () => { console.log(`Example app listening at http://localhost:${port}`); });
5. package.json 파일의 scripts 부분을 다음과 같이 수정하여 start 스크립트를 추가합니다.
6. "scripts": { "start": "node index.js" }
7. 터미널에서 npm start 명령어를 실행하여 서버를 시작합니다.
8. npm start
9. 웹 브라우저에서 http://localhost:3000에 접속하면 "Hello, World!" 메시지를 확인할 수 있습니다.

정적 파일 제공: Express를 사용하여 정적 파일(HTML, CSS, 이미지 등)을 제공하는 서버를 만들어 보겠습니다.

1. 프로젝트 루트 디렉토리에 public 폴더를 생성합니다.
2. public 폴더 안에 index.html 파일을 생성하고 다음과 같이 작성합니다.
3. <!DOCTYPE html> <html> <head> <title>Static File Server</title> </head> <body> <h1>This is a static HTML file.</h1> </body> </html>
4. index.js 파일을 다음과 같이 수정합니다.
5. // index.js const express = require('express'); const app = express(); const port = 3000; // 'public' 디렉토리에 있는 정적 파일들을 제공합니다. app.use(express.static('public')); app.listen(port, () => { console.log(`Static file server listening at http://localhost:${port}`); });
6. 서버를 재시작하고 웹 브라우저에서 http://localhost:3000에 접속하면 index.html 파일의 내용이 표시됩니다.

3.3. HTTP 모듈을 활용한 기본적인 웹 서버 구축

Express를 사용하지 않고 Node.js의 내장 http 모듈만으로도 간단한 HTTP 서버를 만들 수 있습니다.

1. 프로젝트 루트 디렉토리에 server.js 파일을 생성하고 아래 코드를 작성합니다.
2. // server.js const http = require('http'); // http 모듈을 불러옵니다. const hostname = '127.0.0.1'; // 서버의 호스트 주소를 지정합니다. const port = 3000; // 서버의 포트 번호를 지정합니다. // HTTP 서버를 생성합니다. const server = http.createServer((req, res) => { res.statusCode = 200; // 응답 상태 코드를 200 OK로 설정합니다. res.setHeader('Content-Type', 'text/plain'); // 응답 헤더를 설정합니다. res.end('Hello World\n'); // "Hello World" 메시지를 응답합니다. }); // 지정된 호스트와 포트에서 서버를 실행합니다. server.listen(port, hostname, () => { console.log(`서버가 http://${hostname}:${port}/ 에서 실행 중입니다.`); });
3. 터미널에서 node server.js 명령어를 실행하여 서버를 시작합니다.
4. node server.js
5. 웹 브라우저에서 http://localhost:3000 또는 http://127.0.0.1:3000에 접속하여 "Hello World" 메시지를 확인합니다.

요청 URL에 따른 다른 응답: 요청 URL에 따라 다른 메시지를 응답하는 서버를 만들어 보겠습니다.

// server.js

const http = require('http');

const hostname = '127.0.0.1';
const port = 3000;

const server = http.createServer((req, res) => {
  res.statusCode = 200;
  res.setHeader('Content-Type', 'text/plain');

  if (req.url === '/') {
    res.end('This is the home page.\n');
  } else if (req.url === '/about') {
    res.end('This is the about page.\n');
  } else {
    res.statusCode = 404;
    res.end('Page not found.\n');
  }
});

server.listen(port, hostname, () => {
  console.log(`서버가 http://${hostname}:${port}/ 에서 실행 중입니다.`);
});

이제 서버를 재시작하고 http://localhost:3000, http://localhost:3000/about 등의 URL에 접속하여 각각 다른 응답을 확인해 보세요.

마무리

이 가이드를 통해 Node.js 설치, npm 사용법, 그리고 첫 번째 프로젝트 생성까지 Node.js 개발의 첫걸음을 함께 했습니다. 이 기본적인 지식을 바탕으로 더 복잡한 애플리케이션을 개발하고, 다양한 패키지를 활용하여 Node.js의 강력한 기능을 경험해 보시기 바랍니다. Node.js와 함께 즐거운 코딩 여정을 시작하세요!