독도갈매기의 개발 블로그

[Node.js] Node.js로 프로젝트 만들어보자 -0- 본문

Node.js

[Node.js] Node.js로 프로젝트 만들어보자 -0-

독도갈매기 2020. 10. 8. 10:47

아직 확실한 프로젝트는 정해지지 않았지만 그래도 살짝 맛보기 겸 기초 겸 겸사겸사 글을 써볼게요

Node.js 설치하기

img

nodejs.org에서 왼쪽에 있는 LTS버전을 다운로드 받아주세요!
왼쪽과 오른쪽의 차이는 왼쪽은 안정화된 버전이고, 오른쪽은 최신버전이라고 생각하면 편합니다.

다운로드 할 때는 쭉 next버튼만 계속 눌러주시면 됩니다.

폴더 만들기

img

먼저 폴더를 만들곳에 가주시고 mkdir 폴더명을 사용해서 node.js프로젝트를 만들 프로젝트를 만들어주세요
꼭 powershell로 안해도 됩니다. 바탕화면에서 새폴더를 생성하시면 되지만 꼭 영어로 이름을 설정해주세요

에디터 실행하기

img

저는 평소 에디터를 visual studio code를 사용해서 콘솔창에 code .를 입력하면 그 디렉토리에서 vscode가 실행됩니다.
만든 폴더로 옮기지 않았다는건 버그....

NPM(Node Package Manager)

node를 설치하면 자동으로 설치되는 npm에서는 node에서 사용할 수 있는 package들을 명령어로 다운로드 받을 수 있습니다.
그럼 저희는 흔히 사용하는 express를 설치해주어 프로젝트를 생각해봅시다.
참고로 installi로 생략 가능합니다.

만들어준 폴더로 들어가서 해주세요! ㅎㅎ

img

index.js 만들기

index.js로 만들어 아래 코드를 복사 해주세요 그리고 설명은 주석에 달아놓았습니다.
코드에서 질문이 있거나 오류가 발생하면 댓글로 달아주시면 대답해드리겠습니다.

const express = require('express'); // express 변수에 express.js를 담아왔습니다. <- import문이라고 생각하시면 됩니다.
const app = express(); // app 변수에 express함수를 담았습니다.

// Get Main Page.
app.get('/', (req, res) => {
    res.send('Im Main Page'); // localhost:3000/ 일 때 일어날 콜백함수를 작성했습니다. 사용자가 '/' 경로로 오게 되면 Im Main Page가 뜨는 함수입니다.
})

// port 변수에 3000을 담습니다.
const port = 3000;

// 서버에 3000포트로 설정합니다.
app.listen(port, () => { // 포트 설정 후 콜백함수 정의
    console.log(`server is running on port ${port}`); // 서버가 open되었을 때 콜백으로 이 문자열이 실행됩니다.
})

node로 실행하기

디렉토리가 바뀐건 기분탓입니다;;

포트번호 3000으로 서버가 열렸다고 떴으니 크롬이나 엣지 같은 웹 브라우저로 가서 localhost:3000으로 가줍니다.

img

확인 해보기

img




오늘의 포스팅은 node.js를 설치해보고 간단하게 express로 웹 서버를 열어봤습니다.
이번 포스팅도 읽어주셔서 감사합니다.

Comments