Web 백엔드 (2) / node.js와 npm 설치하기, 기본 구조 설계하기

 

지난시간에 백엔드를 위한 기본적인 것들을 배웠으니 이제 서버에 대한 내용을 공부해보자!

이 글에 작성된 내용은 아래 강좌에서 배운 내용들을 기반으로 한다.

 

 

 

클래스 101 [유료강좌]

개발자 사관학교 - [웹 개발자 단과반 2교시] MySQL, Node.js 백엔드 속성 실무!

https://class101.net/ko/products/5fac071c1105fb001383cd2a

[웹 개발자 단과반 2교시] MySQL, Node.js 백엔드 속성 실무! | 개발자 사관학교

 

 

 

 

 

CHAPTER 2: 본격! 백엔드 다루기, Node.js의 모든 것

[1. 자바스크립트로 만드는 서버 구조와 Node.JS 소개]

 

서버를 만드는데 도와줄 Node.js에 대해 알아보자.

 

Node.JS는 Javascript의 Runtime이다.

이 의미는 javascript programm을 실행할 수 있게 해준다는 뜻이라고 한다.

여기서 Runtime이라는 말이 헷갈리는데, 간단히 이야기하자면 프로그램이 구동되는 환경이다.

즉, 자바스크립트가 실행되는 환경이 Node.JS이다.

 

그렇다면 어떻게 Node.JS에서 자바스크립트를 실행할 수 있을까?

명령어로 컴퓨터에서 자바스크립트를 실행 가능하며 결과 또한 명령어로 실행한 검은 화면에서 확인이 가능하다.

 

Node.JS의 구조는 아래와 같다.

우선 맨 위, 최상단에 "Node.js Core Library"가 있다.

그리고 그 아래에는 여러가지 통신할 수 있는 도구들, Node.js Bindings(socket,http)가 있다.

 

최하단에는 V8엔진 (javascript Engine)과 libuv library(이벤트기반, 논블로킹I/O)가 존재한다.

V8엔진은 자바스크립트를 실행할 수 있게 해주는 역할을 한다.

 

Node.js의 가장 큰 세가지 특징은 다음과 같다.

- 이벤트기반

- 쓰레드 기반

- 논 블로킹 I/O

아직 node.js를 사용해보지 않은 상황에서 이것들을 이해하기가 힘들다.

앞으로 공부를 이어가보면서 하나씩 어떤 얘기들인지 이해해보는 것이 좋을 듯 하다.

 

= 쉬운말로 node.js를 정리하자면 다음과 같이 말할 수 있다.

자바스크립트로 서버를 만들 수 있는, 자바스크립트로 만든 서버를 실행할 수 있는 환경.

 

 

 

 

 

- 우리가 만들 일반적인 서버 구조

 

Model (데이터베이스) - Router(주소/url) - View(html/화면)

 

주소로 들어오면 해당 데이터의 유무를 확인하고 있다면 화면에 띄워준다.

이 모든 환경이 node.js에서 돌아간다.

서버 환경을 쉽게 구축할 수 있도록 도와주는 것이 Express이다.

마치 css코드를 하나하나 입력하지 않아도 부트스트랩을 이용해 쉽게 구현할 수 있는 것처럼

Express를 이용하면 비교적 쉽게 서버를 만들 수 있다.

 

그렇다면 서버를 다 만들었다면 어떻게 실행시켜줄까?

명령어를 통해 자바스크립트 파일을 실행해주는 역할은 app.js가 담당한다.

마치 컴퓨터 본체를 키듯 app.js 파일에서 서버를 실행/중지/관리한다.

 

이야기를 들었을때는 뭔가 굉장히 복잡하게 생겼을 것 같지만,

model, router, view는 각각 다 하나의 폴더이며 app.js는 하나의 js파일이다.

model, router, view 폴더 안에도 마찬가지로 js파일들이 있다.

 

 

 

Express는 어떻게 사용할 수 있을까?

npm을 다운로드하면 쉽게 express도구와 그리고 해킹방지도구까지 사용할 수 있다.

 

=> 그렇기 때문에 node.js와 npm을 다운받아 서버제작환경을 준비해보자!

 

 

 

 

 

 

 

- Node.JS (+npm) 설치하고 확인하기

 

아래 node.js 공식 사이트에 들어가보자.

https://nodejs.org/en

Node.js

 

 

 

왼쪽에 LTS를 눌러 다운받아준다.

 

 

Node.js와 npm까지 설치가 완료되었다.

 

 

 

 

 

마지막으로 터미널에서 node.js와 npm이 잘 설치되었는지 확인해보자.

 

 

 

터미널에 들어가 node -v 그리고 npm -v라는 명령어를 입력했을때,

각각의 버전이 나오면 설치가 잘되었다고 볼 수 있다.

 

 

 

 

 

 

 

 

 

 

 

[2. 첫 Node.JS 프로젝트 폴더 생성과 구조 살펴보기]

 

Node.js를 사용하기 위한 폴더와 파일 구조를 세팅해보자.

 

- 터미널을 켜서 작업할 폴더에 들어가 node.js를 설치해주어야 한다.

 

 

npm init 명령어를 입력해 node.js를 설치한다.

(위와 같은 내용이 나오면 설치가 잘된것 같다..)

 

 

 

 

package name에는 간단히 원하는 이름을 쓰고 엔터를 누른다.

버전을 확인하고.. 엔터를 누른다.

설명에는 만들 내용에 대해 간단히 쓰고 엔터를 누른다.

entry point, test command에도 엔터를 눌러 넘겨준다.

그 다음은 git repository인데 이미 따로 git에서 repository를 만들고 폴더까지 연결했기 때문에

앞으로도 터미널을 통해 직접 업로드해줄 것이다. 때문에 엔터를 눌러 패스해준다.

keywords도 그대로 엔터.. author에는 이름을 써주고 엔터, license까지 엔터를 눌러주면...

(엔터 남발해준다.)

 

 

 

 

 

 

작성한 내용을 한번 확인해주는 내용이 나온다. Is this OK?라는 물음에 다시 엔터를 눌러 긍정해준다 :)

 

 

 

 

뭔가 npm이 업데이트가 된 내용이 있나보다. 어쨌든 fail이나 빨간글씨가 없으면 잘 통과되었다고 봐도 될 것 같다.

 

 

ls -al 명령어를 통해 폴더 내부의 파일들을 다시 확인해준다.

package.json 파일이 있으면 설치가 정상적으로 완료된 것이다.

 

 

 

 

 

이제 아래와 같은 핵심 폴더들과 파일을 만들어줄 것이다.

앞서 말한것처럼 서버 개발에 있어 필수적인 구조들이다.

 

*폴더

- model

- views

- router

 

*파일

- app.js

 

 

 

폴더를 만드는 mkdir 명령어와 파일을 만들어주는 touch 명령어를 통해 파일들을 채워준다.

구조가 잘 만들어졌는지 vscode에서 마저 확인해보자.

 

 

 

 

 

 

- package.json

package.json를 열면 json파일 형식으로 작성되어 있다.

json파일은 javascript에서 배운 객체(딕셔너리)형식의 파일이다.

key와 value쌍으로 내용이 채워져있다.

자세히 내용을 살펴보면, 앞서 터미널에서 작성했던 내용들이 쓰여있다.

 

package.json은 이 프로젝트를 대표하는 첫페이지 같은 역할을 담당한다.

또한 추후에 express같은 개발을 도와주는 도구들을 설치하면 어떤 도구들이 설치되었는지 이 파일에 나열된다.

 

 

- app.js

서버의 설정에 관한 코드들이 들어가게 된다.

 

그외 폴더들은 하나씩 서버를 개발하며 더 자세히 살펴보는 것으로 하고,

각각 폴더 안에 들어가게 될 다른 파일들을 미리 만들어줄 것이다.

 

 

 

 

 

 

 

*서버개발 기본 폴더 구조

 

model안에는 db.js를 router안에는 mainRouter.js를 views안에는 index.html을 추가적으로 만들어주었다.

 

model폴더의 db.js에는 데이터베이스의 설정에 관한 내용 뿐 아니라 데이터에 관한 모든 내용들이 담길 것이다.

mainRouter.js는 여러가지 내용에 따라 userRouter.js등 다양한 이름의 파일이 될 수 있다.

즉, 어떤 내용 로직이냐에 따라 다른 파일로 이름 붙여져 관리될 예정이다.

 

마지막으로 views 폴더에는 화면을 구성하는 html파일이 들어간다.

 

이처럼 서버개발을 한다는 것은 폴더관리와 같다고 쉽게 생각해볼 수도 있다.

위 폴더의 구조는 대부분의 서버개발시 기본이 되는 구조로 흔히 사용된다.

(현업에서도 이렇게 기본 구조로 많이 사용한다고 한다.)

 

 

 

 

 

 

 

 

 

 

 

Node.js와 npm를 설치하고 환경 설계까지 완료하였다.

이제 만들어진 환경에 express를 이용해 작업을 시작해보자.

아직 처음 부분이지만 프론트보다는 진입장벽도 높게 느껴지고

버벅거리게 된다.. 앞으로의 내용도 잘 따라가보자!

 

 

 

 

 

 

출처: 클래스101 / [웹 개발자  단과반 2교시] MySQL, Node.js 백엔드 속성 실무! - 개발자 사관학교