Blog
//
Blog
About Me
//

[Node.js] 1. 기본 환경구축 및 Express 프레임워크 설치

Category
Author
citeFred
citeFred
PinOnMain
1 more property
Node.js로 백엔드 구성하기
Table of Content

Node.js란?

Node.js는 Chrome V8 JavaScript 엔진으로 빌드된 JavaScript 런타임입니다. -Node.js는 공식 홈페이지-
Node.js는 비동기 이벤트 기반 JavaScript 런타임이다. - MDN
•
JavaScript는 HTML을 동적(Dynamic)하게 바꿔주는 기능을 하게 하는 스크립트이다.
•
2008년에 구글이 V8 엔진을 사용하여 크롬을 출시했는데, V8 엔진은 엄청 빨랐고, 오픈 소스로 코드도 공개되었. 그 기능을 좀 더 더해서 V8 엔진 기반에 노드 프로젝트를 시작했고, Node.js(V8)이 등장했다.
•
웹 서버와 같이 확장성 있는 네트워크 프로그램 제작을 위해 고안되었다.
쉽게 말해 JavaScript 기반 런타임 환경으로 브라우저 내에서 말고도 다른 환경에서 자바스크립트를 사용할 수 있게 해주는 실행환경이다.
Node.js가 자바스크립트를 컴퓨터에서 쉽게 실행시켜줬기 때문에 자바스크립트를 프로그래밍 언어처럼 사용하기 시작했다.

Node.js를 서버로 만드는 이유?

Node.js의 핵심은 크게 3가지이다.
1.
Non-blocking I/O
2.
코드가 매우 짧고 쉬워서 빠른 개발 가능
3.
웹서비스 제작에 적합
여기서 특히 Non-blocking I/O 특징을 통해 Node.js로 구현하면, 요청이 많거나 오래 걸리는 요청이 있어도 멈추거나 요청 대기시간이 없다는 것이다.
말이 어렵지만 동기방식 vs 비동기방식의 차이를 알아야 하는데, Node.js는 비동기 10를 지원하며 Single-Thread 기반으로 동작하는 서버이기 때문에 요청을 처리하면서 다음 요청을 받을 수 있다.
병렬처리를 Thread 로 처리하지 않으므로 Multi-Thread가 갖는 근원적인 문제에서 자유로운 특징이 있다.(멀티스레드는 스레드 1개의 오류가 전체 프로세스에 영향을 주는 등)
Node.js: 비동기 프로그래밍 이해
대부분의 기업형 애플리케이션은 중앙의 서버에서 동작합니다. 이러한 서버는 Web을 위한 HTTP 서버 또는 소켓 통신을 위한 네트워크 서버 등이 있습니다. 서버는 중앙집중형태로 클라이언트의 요청을 받으므로 병목현상이 발생하기 쉬우며 처리 성능에 항상 주목해야 합니다. 클라이언트의 요청이 많은 경우 서버는 병목 구간이 발생합니다. 이러한 병목구간을 분석해 보면 대부분 프로그램 로직보다는 입출력(IO)
https://www.nextree.co.kr/p7292/

Node.js 환경 구축(MacOS기준)

1. Homebrew를 통한 NVM 설치

brew install nvm
Shell
복사
그리고 nvm 이 설치되어있는지 nvm -v 을 쳐보면 command not found : nvm 이라고 뜰 것이다.

2. bash_profile 혹은 zshrc에 nvm 환경변수 추가

nvm이 설치 되었지만 현재는 nvm이라고 터미널에 입력하면 인식하지 못하는 상태이다.
우선 nvm의 설치 경로를 확인해야 한다.
맥OS기준 homebrew 설치 경로는 /usr/local/Cellar/nvm/0.39.7 처럼 나타난다. 환경마다 일부 상이 할 수 있다 직접 finder를 통해서 경로를 확인할 필요가 있다. 일부 환경은 /opt/… 처럼 경로가 나타나기도 하기 때문에 본인의 homebrew를 통한 패키지 설치 경로는 평상시 알아두는것이 좋다.
여기서 nvm.sh 파일의 경로, nvm 파일의 경로를 확인해두어야 한다.
•
/usr/local/Cellar/nvm/0.39.7/nvm.sh
•
/usr/local/Cellar/nvm/0.39.7/etc/bash_completion.d/nvm
vim ~/.zshrc
Shell
복사
vi에디터를 통해 터미널의 환경변수/패스 설정이 필요하다.(타 GUI 에디터도 상관없다.)
다음과 같이 두개의 경로의 파일명, 확장자를 정확히 확인하고 각각 입력한다.
export NVM_DIR="$HOME/.nvm" [ -s "/usr/local/Cellar/nvm/0.39.7/nvm.sh" ] && \. "/usr/local/Cellar/nvm/0.39.7/nvm.sh" # This loads nvm [ -s "/usr/local/Cellar/nvm/0.39.7/etc/bash_completion.d/nvm" ] && \. "/usr/local/Cellar/nvm/0.39.7/etc/bash_completion.d/nvm" # This loads nvm bash_completion
Shell
복사
이후 :wq로 저장한 뒤 아래 명령어로 환경변수 설정을 적용시켜준다.
source ~/.zshrc
Shell
복사
터미널을 재시작한 뒤 nvm -v로 nvm의 환경 변수 설정이 적용된 것을 확인한다.

3. nvm 을 통한 Node.js 설치

nvm이 설치 되었으면 이를 통해 Node.js를 설치한다.
특정 버전을 명시적으로 설치 할 수도 있다.
nvm install v18.15.0
Shell
복사
lts버전(long term support)을 설치 할 수도 있다. 본인은 lts버전을 설치하고자 한다.
nvm install --lts
Shell
복사

4. Node.js, npm 설치 버전 확인

패키지, 라이브러리 등을 설치하면 항상 버전을 확인하여 정상적으로 설치된 것을 확인해야 한다. 특히 CLI 환경은 가독성이 떨어지기 때문에 더블체크는 필수이다.
node -v
Shell
복사
npm -v
Shell
복사
설치된 Node 목록을 보면 다음과 같다.
nvm ls
Shell
복사

5. Node.js 작동 확인

터미널을 통해서 간단한 Node.js 설치 상태와 정상 작동을 확인해보고자한다.
node
Shell
복사
명령어를 통해서 node 콘솔을 진입하게 된다. 이 상태가 node 런타임이 실행되고 있는 상태인 것이다.
console.log('hello')
Shell
복사
위 명령어를 입력하면 JavaScript에서 로그를 확인하던 것이 실행중인 환경처럼 나타나게 된다. 이것이 node가 실행중인 상태의 정상적인 모습이다.
VSCode 에디터를 통해 실습할 프로젝트에서 index.js라는 파일을 생성했다. 아래처럼 로그 명령어를 삽입하고 저장한 상태이다.
node app.js
Shell
복사
위 명령어를 사용하면 app.js라는 파일이 실행되는 것을 확인 할 수 있다. 이는 마치 Java에서 명령어로 자바 파일을 실행하는 것(JRE)과 비슷한 느낌이다. 결과적으로 동일한 것이라는 것 java Application.java

Express.js란?

오픈 소스 소프트웨어로 출시되었다. 웹 애플리케이션, API 개발을 위해 설계되었다. Node.js의 사실상의 표준 서버 프레임워크로 불리고 있다. - 위키백과
Express는 웹 및 모바일 애플리케이션을 위한 일련의 강력한 기능을 제공하는 간결하고 유연한 Node.js 웹 애플리케이션 프레임워크입니다. - https://expressjs.com/ko/ 공식 홈페이지
Node.js는 실행환경이라 하면 Express.js는 웹 어플리케이션을 만들 수 있는 프레임워크로 쉽게 웹 서비스를 구축 할 수 있는 도구(라이브러리 등)을 가지고 있다.

1. Express.js 설치

공식 홈페이지의 안내 처럼 npm을 통해 간단하게 설치 할 수 있다.
npm install express --save
Shell
복사
터미널에서 위 명령어로 설치하고 나면 해당 프로젝트 폴더에 package-lock.json, package.json이 생성되고 node_modules 폴더가 생성된다.

2. git, .gitignore 설정

우선 해당 프로젝트 폴더를 git으로 관리하기 위하여 초기화해준다.
git init
Plain Text
복사
Express를 설치하면서 추가된 기본 프레임워크 라이브러리들이 node_modules 폴더에 생성된다. 이 파일은 package.json을 통해서 자동으로 해당 환경에 설치되기 때문에 이 파일은 git에서 추적을 멈추고 github로도 업로드할 필요가 없다. 따라서 아래처럼 .gitignore 파일을 작성하여 불필요한 파일의 추적을 제거한다.
node_modules
Shell
복사

NVM vs NPM?

두 용어가 나타나서 혼동될 수 있지만 풀어쓰면 명확해진다.

nvm - Node Version Manager

nvm 은 Node.js 를 설치하는 툴이라 이해하자.
Node.js 의 각 버젼을 유지하면서 시스템을 구성해야 하는 경우를 위해 사용하는 경우에 많이 이용된다. 다시말해 같은 시스템 안에서 여러 Node.js 를 사용하기 위해 버젼별로 Node.js 환경을 격리시키는 역할

npm - Node Package Manager

node에서 다양한 라이브러리를 다운로드하는 패키지 매니저로 보면 된다.
노드 패키지 매니저. 간단하게 얘기하면 npm 서비스를 통하여 Node.js 로 개발된 프로그램을(npm 패키지) 편리하게 설치, 업데이트 및 삭제를 해 주는 프로그램이다.
Node.js 를 설치하면 npm 도 같이 설치된다.
Java를 기준으로 생각하면 maven과 같이 다양한 패키지들을 다운로드 할 수 있는 경로로도 알고 있으면 된다. Java의 MavenCentral처럼 npm에서도 다양한 라이브러리 의존성(node진영에선 주로 모듈이라고 부르는것 같다.)들을 검색하고 다운로드 할 수 있다.
모듈과 패키지, 라이브러리 모두 결국 함수의 집합이다. 물론 정확한 개념은 차이가 있지만 메인언어의 진영마다 통상적으로 부르는 용어의 차이가 존재하는것으로 보인다. 자바진영에서는 코드상의 동작과 관련된 개념은 대부분 메서드라는 명칭을 쓰지만 JS진영에서는 대부분 함수(function)이라고 부르는 것처럼 라이브러리나, 모듈이나 결국 특별한 기능을 하는 함수의 집합이라고 보는게 편하다.
nvm 과 npm 구별하기 - LYNMP
사용을 하면서도 가끔가다 둘의 차이가 뭐였더라? 하는 의문을 갖게되는 nvm 과 npm. 아마도 알파벳 하나의 차이 때문이라고, 비영어권 사용자의 애환이라고 변명을 하는것도 슬슬 졸업을 해야겠다 싶어 기록을 해 둡니다.nvm - Node Version Manager풀어쓰면 너무너도 명확하게 알 수 있습니다. Node.js 의 버젼 관리자… 라고 하기에는 의미가 조금 더 넓습니다. 버젼 관리자라고 이해를 하면 업데이트 하는 프로그램? 정도로 생각하기 쉬운데, 이 보다는 Node.js 의 각 버젼을 유지하면서 시스템을 구성해야 하는 경우를 위해 사용하는 경우에 많이 이용됩니다. 다시말해 같은 시스템 안에서 여러 Node.js 를 사용하기 위해 버젼별로 Node.js 환경을 격리시키는 역할로써 더 많이 사용되지 ...
https://lynmp.com/ko/article/tb585d114096490055
Search

1. MVC 디자인 패턴

[Node.js] 13. MVC 디자인 패턴과 리팩토링

1. 플러그인 설치

Marketplace에서 아래 키워드로 검색하여 각각 설치한다.
•
SQLTools
•
@tag:sqltools-driver

2. 설치 후 커넥션 추가

•
좌측 하단 원통형 DB 아이콘이 생성되고 Add New Connection으로 DB와 연결해야 한다.
•
드라이버 플러그인도 설치가 정상적으로 되었다면 아래와 같이 아이콘이 나타난다. MySQL 선택
[Node.js] 12. 데이터베이스 GUI VSCode 플러그인

Ajax → Fetch API

이전 Ajax를 통해서 REST 아키텍처를 갖추었지만 jQuery AJAX는 요청을 보내고, 성공 및 오류에 대한 각각의 콜백 함수를 직접 구현하고 있었다. success 부분의 function, error 부분의 function 이를 통해 비동기 요청을 처리하는 기능은 구현되고 있는 것이다.
하지만 여러 콜백함수를 직접 작성, 사용해야 하므로 코드가 다소 복잡해질 수 있는 문제점이 있었다.
이러한 문제점을 개선 할 수 있었던건 Promise객체로 실패, 성공 상태를 가지는 객체로써 Fetch API 함수는 항상 이 객체를 반환하는 것으로 설계되었다.
따라서, fetch() 메서드를 통해서 메서드 체이닝(. 연결)을 통해 .then()과 .catch() 메서드를 사용 할 수 있어 구조적으로 가독성을 높이는 역할을 하게 되었다.
•
Ajax 요청의 일반적인 형태
•
Fetch API 요청의 일반적인 형태
[Node.js] 10. 모던 자바스크립트 스타일Fetch API 요청 리팩토링

Visual Studio Code에서 EJS 문법 인식 불가

문법의 기능은 정상 작동되는데 아래처럼 IDE가 인식하지 못하는 경우가 발생한다.
마켓플레이스에서 관련 플러그인을 설치해도 해당 문제는 해결되지 않는다.

HTML 설정 변경으로 해결

에디터 우측 하단의 HTML부분을 누르면 드롭다운 메뉴로 HTML 언어 설정에 대한 부분이 나타난다.
해당 부분을 선택하면 settings.json 파일이 열리며 설정값이 있는 상단 중괄호에 , 를 추가하여 구분해주고 아래 처럼 코드를 추가하면 해당 오류를 제거 할 수 있다.
[Node.js] 11. Visual Studio Code에서 EJS 문법 <% … %> 빨간줄 인식불가 해결

REST API

HTML 폼(form) 요소는 기본적으로 GET과 POST 메서드만 지원하고 있다. 프론트의 form action의 method 속성을 put으로 변경하고 백엔드 라우터 또한 app.put()으로 변경해도 작동하지 않는다.
현재 CRUD 기능에서 Create(POST), Read(GET), Update(POST), Delete(POST)으로 구성되어 있다.
하지만 하지만 우리는 RESTful API에서 각 기능별 적절한 HTTP Method를 선택해야하기 때문에 REST API를 지향하기 위해서는 요청 메소드 자체의 문제가 있다. 일반적으로 RESTful API 디자인에서는 업데이트는 PUT 메서드, 삭제는 DELETE 메서드를 사용하는 것이 관례적이다.

Ajax요청을 위한 jQuery 참조

HTML 폼에서는 PUT과 DELETE 메서드를 지원하지 않기 때문에 외부 라이브러리를 사용해야 한다. 우선 현재까지도 활용 되는 레거시 프로젝트 중에 AJAX 라이브러리가 있다. AJAX는 전통적인 HTML <form>에서 RESTful 아키텍처로 발전하는 데 중요한 전환점이 된 모듈 중 하나다.
•
하지만 아래와 같은 코드 처럼 아직까지 복잡해보이는 코드 구조를 가지고 있었다. 첫줄에서처럼 XMLHttpRequest 객체를 통해 처리했음
•
하지만 jQuery라는 라이브러리를 통해서 위 Ajax 요청을 더욱 쉽고 가독성 높게 아래 처럼 변경되었다. 보다 개발자 친화적으로 사용하기 편리하여 현재까지도 사용되기도 한다.
[Node.js] 9. REST API를 위한 리팩토링 jQuery+Ajax

테이블 수정

우선 현재 테이블의 구조는 다음과 같다.
여기에 status라는 글의 상태를 추가하여 ongoing(진행중), done(완료) 로 문의에 대한 답변 상태를 추가하고자 한다. 따라서 문의가 생성되면 기본값으로 ongoing상태를 가져야 하며 관리자가 글의 상태를 변경(업데이트) 할 수 있도록 한다.
테이블에 status라는 컬럼을 추가해야 한다. 테이블을 변경하는 것이기 때문에 alter table로 시작되며 status 컬럼을 추가(add)하게 된다. default로 ongoing 값을 가지도록 설정했다.
기본값 설정에 따라 기존 모든 데이터들도 기본값이 적용되어 ongoing 상태로 나타나는 것을 볼 수 있다.

Update API 작성

app.js Update API 작성

post요청을 통해 id를 PathVariable로 받아온다. update 쿼리를 통해서 해당 id의 row중 status 컬럼값을 done으로 수정한다.
[Node.js] 8. CRUD-Update 기능 추가

조회 READ(select문) 기능

app.js의 조회 API 작성

우선 READ기능인 select 쿼리문을 실행할 수 있는 로직이 담긴 ‘/contactList’ 엔드포인트의 GET요청 API를 작성한다.
쿼리 결과로 result를 반환하며 lists라는 변수에 담아서 contactList.ejs로 render되도록 작성한다. 아래는 조회 결과인 result에 담긴 데이터이다.

목록 뷰 페이지 contactList.ejs

등록된 문의사항을 볼 수 있는 페이지를 만들어보자.
API에서 lists에담긴 데이터들은 forEach를 통해 테이블을 통해서 데이터들을 순회하면서 1개의 데이터(row)마다 tr태그를 생성하도록 설정한다. ejs 템플릿의 반복문 및 대입 문법인 <% … %>에서 forEach와 =대입연산자를 활용해야 한다.
서버를 실행하여 contactList 엔드포인트의 API로 요청하면 다음과 같이 데이터베이스의 자료를 조회한 데이터를 목록으로 볼 수 있다.
[Node.js] 7. CRUD-Read, Delete 기능 추가

express에서 정적 파일 경로 지정

웹 페이지에서 정적 파일들을 불러와서 나타내야 할 경우가 있다. 이런 경우 아래처럼 index.ejs에서 img src 태그를 사용하는데 express에서는 단순히 불러와지지 않는다.
Express에서는 정적 파일을 제공하기 위해 express.static 미들웨어를 사용해야 한다.

express.static 사용하기

express에 내장된 static이라는 미들웨어를 통해서 정적 파일의 경로를 지정 할 수 있다. 기본값으로 public이란 명칭의 폴더를 사용한다. 위 코드를 작성하여 정적 파일을 사용 할 수 있도록 설정한다.
샘플 이미지 파일을 root/public/ 폴더로 이동시키고 로드해본다.
index.ejs에 작성한 태그를 통해 정상적으로 정적 이미지가 나타나는것을 확인 할 수 있다.
[Node.js] 5. express에서 정적(static) 파일 경로 지정

데이터 요청의 body-parser 필요

우선 프론트엔드에서 문의하기 부분의 다음 코드로 기본적인 데이터 요청을 테스트하고자 한다.
contact.ejs
Frontend 커밋 이후 → master 체크아웃 → 현재까지 변동사항 master로 병합 (git merge Frontend)
또는 GUI로 Merge
이후 Backend는 커밋이 뒤처져있으므로 Backend 체크아웃 → 변동사항 적용 (git rebase master)
app.js에서 위 form의 요청을 받고 응답을 보낼 라우터를 아래와 같이 작성하고 서버를 실행해둔다.
위 작성된 문의하기 폼을 통해서 각 필드값들 form을 통해 post 요청할 수 있다.
[Node.js] 6. Bodyparser사용 및 MySQL2, dotenv 미들웨어로 DB연결하기(CRUD-Create 기능)

HTML 표준 레이아웃

여러 홈페이지들의 외관을 살펴보면 비슷한 레이아웃을 보여준다. 이런 모습들이 웹 표준을 따르기 위함이라고 볼 수 있다.
이를 통해 사용자들에게 익숙한 경험을 제공하면서 접근성을 높일 수 있는 방법론에서 시작하기도 한다. 개발자가 UX/UI 관점의 개발을 고려해야 하는 이유이다. 또한 재활용성, 유지보수성은 표준화, 규칙 들에서 관리되기 쉽다.

웹 표준

브라우저 종류 및 버전에 따른 기능 차이에 대하여 호환이 가능하도록 제시된 표준으로, 다른 기종 혹은 플랫폼에 따라 달리 구현되는 기술을 동일하게 구현함과 동시에 어느 한쪽에 최적화되어 치우치지 않도록 공통요소를 사용하여 웹 페이지를 제작하는 기법을 의미한다.
물론 프로젝트마다 회사마다 그 스타일의 차이가 있지만 공통적으로 웹 표준을 지키려고 노력하고 있는것으로 보여진다. 이를 통해 소스를 살펴보더라도 개발자 입장에서도 해당 부분들의 코드 파악이 용이하다.

웹 표준의 장점

•
수정 및 운영관리 용이
•
접근성 향상
[Node.js] 4. 웹표준과 간단 레이아웃 구조화

View Template Engine이란?

웹 페이지를 구성하는 주된 마크업 언어(Markup Language)는 HTML이며, 이는 정적인 언어. 따라서, Javascript의 반복문을 사용하여 간단하게 처리할 수 있는 동적 연산을 HTML로 표현하려면 직접 코드를 작성해야 하는 불편함이 있다.
•
템플릿 엔진(Temlplate Engine)은 위에서 언급한 불편한 상황을 해소시키기 위한 도구
•
템플릿 프로세서를 이용하여 웹 페이지를 동적으로 구현할 수 있는 시스템
•
Node.js의 대표적인 템플릿 엔진으로는 Pug(Jade), EJS, Handlebars 등이 있음
•
템플릿 엔진은 웹 템플릿들과 웹 컨텐츠 정보를 처리하기 위해 설계된 소프트웨어
•
템플릿 엔진은 view code(html)와 data logic code(db connection)을 분리해주는 기능을 한다.
•
필요성

Express와 뷰 템플릿 엔진

Express에서의 뷰 템플릿 엔진 시작 공식문서에서는 기본적으로 Pug라는 뷰엔진을 사용하는 실습 코드를 제공하고 있다. 하지만 Pug라는 뷰 엔진에 대해서 처음 들어보았기 때문에 정보가 필요하다.
Java를 배우면서도 JSP, Thymeleaf, Mustache 등 여러 뷰 템플릿 엔진이 있었고 특히 문법들에 차이가 있을 수 있어서 뷰 템플릿 엔진도 그 부분을 먼저 살펴볼 필요가 있었다.
[Node.js] 3. 뷰 템플릿 엔진비교와 EJS 사용

Express 첫 시작

npm 공식 홈페이지를 통해 다양한 Node.js 패키지들을 검색할 수 있다. 이중 Express라는 웹 프레임워크 패키지를 설치했었다.

라우트 함수의 구조

라우팅은 URI(또는 경로) 및 특정한 HTTP 요청 메소드(GET, POST 등)인 특정 엔드포인트에 대한 클라이언트 요청에 애플리케이션이 응답하는 방법을 결정한다.
기본적인 라우트 함수의 구조는 아래와 같이 작성할 수 있다.
•
app은 express의 인스턴스
•
METHOD는 HTTP 요청 메소드 종류
•
PATH는 서버에서의 URL 경로(엔드포인트)
•
HANDLER는 라우트가 일치할 때 실행되는 함수
공식 문서에서 확인할 수 있는 CRUD에 필수적인 요청 샘플은 다음과 같다. 하지만 우선 Express를 통해 서버를 실행 시키는 부분을 확인해야 하므로 아래 부터 진행 하면서 아래 예제를 다뤄보고자 한다.
[Node.js] 2. Express의 HTTP 라우팅 함수 기초

Node.js란?

Node.js는 Chrome V8 JavaScript 엔진으로 빌드된 JavaScript 런타임입니다. -Node.js는 공식 홈페이지-
Node.js는 비동기 이벤트 기반 JavaScript 런타임이다. - MDN
•
JavaScript는 HTML을 동적(Dynamic)하게 바꿔주는 기능을 하게 하는 스크립트이다.
•
2008년에 구글이 V8 엔진을 사용하여 크롬을 출시했는데, V8 엔진은 엄청 빨랐고, 오픈 소스로 코드도 공개되었. 그 기능을 좀 더 더해서 V8 엔진 기반에 노드 프로젝트를 시작했고, Node.js(V8)이 등장했다.
•
웹 서버와 같이 확장성 있는 네트워크 프로그램 제작을 위해 고안되었다.
쉽게 말해 JavaScript 기반 런타임 환경으로 브라우저 내에서 말고도 다른 환경에서 자바스크립트를 사용할 수 있게 해주는 실행환경이다.
Node.js가 자바스크립트를 컴퓨터에서 쉽게 실행시켜줬기 때문에 자바스크립트를 프로그래밍 언어처럼 사용하기 시작했다.

Node.js를 서버로 만드는 이유?

Node.js의 핵심은 크게 3가지이다.
1.
Non-blocking I/O
2.
코드가 매우 짧고 쉬워서 빠른 개발 가능
3.
웹서비스 제작에 적합
여기서 특히 Non-blocking I/O 특징을 통해 Node.js로 구현하면, 요청이 많거나 오래 걸리는 요청이 있어도 멈추거나 요청 대기시간이 없다는 것이다.
말이 어렵지만 동기방식 vs 비동기방식의 차이를 알아야 하는데, Node.js는 비동기 10를 지원하며 Single-Thread 기반으로 동작하는 서버이기 때문에 요청을 처리하면서 다음 요청을 받을 수 있다.
병렬처리를 Thread 로 처리하지 않으므로 Multi-Thread가 갖는 근원적인 문제에서 자유로운 특징이 있다.(멀티스레드는 스레드 1개의 오류가 전체 프로세스에 영향을 주는 등)

Node.js 환경 구축(MacOS기준)

1. Homebrew를 통한 NVM 설치

그리고 nvm 이 설치되어있는지 nvm -v 을 쳐보면 command not found : nvm 이라고 뜰 것이다.

2. bash_profile 혹은 zshrc에 nvm 환경변수 추가

nvm이 설치 되었지만 현재는 nvm이라고 터미널에 입력하면 인식하지 못하는 상태이다.
우선 nvm의 설치 경로를 확인해야 한다.
맥OS기준 homebrew 설치 경로는 /usr/local/Cellar/nvm/0.39.7 처럼 나타난다. 환경마다 일부 상이 할 수 있다 직접 finder를 통해서 경로를 확인할 필요가 있다. 일부 환경은 /opt/… 처럼 경로가 나타나기도 하기 때문에 본인의 homebrew를 통한 패키지 설치 경로는 평상시 알아두는것이 좋다.
여기서 nvm.sh 파일의 경로, nvm 파일의 경로를 확인해두어야 한다.
•
/usr/local/Cellar/nvm/0.39.7/nvm.sh
•
/usr/local/Cellar/nvm/0.39.7/etc/bash_completion.d/nvm
vi에디터를 통해 터미널의 환경변수/패스 설정이 필요하다.(타 GUI 에디터도 상관없다.)
다음과 같이 두개의 경로의 파일명, 확장자를 정확히 확인하고 각각 입력한다.
이후 :wq로 저장한 뒤 아래 명령어로 환경변수 설정을 적용시켜준다.
터미널을 재시작한 뒤 nvm -v로 nvm의 환경 변수 설정이 적용된 것을 확인한다.

3. nvm 을 통한 Node.js 설치

nvm이 설치 되었으면 이를 통해 Node.js를 설치한다.
특정 버전을 명시적으로 설치 할 수도 있다.
lts버전(long term support)을 설치 할 수도 있다. 본인은 lts버전을 설치하고자 한다.

4. Node.js, npm 설치 버전 확인

패키지, 라이브러리 등을 설치하면 항상 버전을 확인하여 정상적으로 설치된 것을 확인해야 한다. 특히 CLI 환경은 가독성이 떨어지기 때문에 더블체크는 필수이다.
설치된 Node 목록을 보면 다음과 같다.

5. Node.js 작동 확인

터미널을 통해서 간단한 Node.js 설치 상태와 정상 작동을 확인해보고자한다.
명령어를 통해서 node 콘솔을 진입하게 된다. 이 상태가 node 런타임이 실행되고 있는 상태인 것이다.
위 명령어를 입력하면 JavaScript에서 로그를 확인하던 것이 실행중인 환경처럼 나타나게 된다. 이것이 node가 실행중인 상태의 정상적인 모습이다.
VSCode 에디터를 통해 실습할 프로젝트에서 index.js라는 파일을 생성했다. 아래처럼 로그 명령어를 삽입하고 저장한 상태이다.
위 명령어를 사용하면 app.js라는 파일이 실행되는 것을 확인 할 수 있다. 이는 마치 Java에서 명령어로 자바 파일을 실행하는 것(JRE)과 비슷한 느낌이다. 결과적으로 동일한 것이라는 것 java Application.java

Express.js란?

오픈 소스 소프트웨어로 출시되었다. 웹 애플리케이션, API 개발을 위해 설계되었다. Node.js의 사실상의 표준 서버 프레임워크로 불리고 있다. - 위키백과
Express는 웹 및 모바일 애플리케이션을 위한 일련의 강력한 기능을 제공하는 간결하고 유연한 Node.js 웹 애플리케이션 프레임워크입니다. - https://expressjs.com/ko/ 공식 홈페이지
Node.js는 실행환경이라 하면 Express.js는 웹 어플리케이션을 만들 수 있는 프레임워크로 쉽게 웹 서비스를 구축 할 수 있는 도구(라이브러리 등)을 가지고 있다.

1. Express.js 설치

공식 홈페이지의 안내 처럼 npm을 통해 간단하게 설치 할 수 있다.
터미널에서 위 명령어로 설치하고 나면 해당 프로젝트 폴더에 package-lock.json, package.json이 생성되고 node_modules 폴더가 생성된다.

2. git, .gitignore 설정

우선 해당 프로젝트 폴더를 git으로 관리하기 위하여 초기화해준다.
Express를 설치하면서 추가된 기본 프레임워크 라이브러리들이 node_modules 폴더에 생성된다. 이 파일은 package.json을 통해서 자동으로 해당 환경에 설치되기 때문에 이 파일은 git에서 추적을 멈추고 github로도 업로드할 필요가 없다. 따라서 아래처럼 .gitignore 파일을 작성하여 불필요한 파일의 추적을 제거한다.

NVM vs NPM?

두 용어가 나타나서 혼동될 수 있지만 풀어쓰면 명확해진다.

nvm - Node Version Manager

nvm 은 Node.js 를 설치하는 툴이라 이해하자.
Node.js 의 각 버젼을 유지하면서 시스템을 구성해야 하는 경우를 위해 사용하는 경우에 많이 이용된다. 다시말해 같은 시스템 안에서 여러 Node.js 를 사용하기 위해 버젼별로 Node.js 환경을 격리시키는 역할

npm - Node Package Manager

node에서 다양한 라이브러리를 다운로드하는 패키지 매니저로 보면 된다.
노드 패키지 매니저. 간단하게 얘기하면 npm 서비스를 통하여 Node.js 로 개발된 프로그램을(npm 패키지) 편리하게 설치, 업데이트 및 삭제를 해 주는 프로그램이다.
Node.js 를 설치하면 npm 도 같이 설치된다.
Java를 기준으로 생각하면 maven과 같이 다양한 패키지들을 다운로드 할 수 있는 경로로도 알고 있으면 된다. Java의 MavenCentral처럼 npm에서도 다양한 라이브러리 의존성(node진영에선 주로 모듈이라고 부르는것 같다.)들을 검색하고 다운로드 할 수 있다.
모듈과 패키지, 라이브러리 모두 결국 함수의 집합이다. 물론 정확한 개념은 차이가 있지만 메인언어의 진영마다 통상적으로 부르는 용어의 차이가 존재하는것으로 보인다. 자바진영에서는 코드상의 동작과 관련된 개념은 대부분 메서드라는 명칭을 쓰지만 JS진영에서는 대부분 함수(function)이라고 부르는 것처럼 라이브러리나, 모듈이나 결국 특별한 기능을 하는 함수의 집합이라고 보는게 편하다.
nvm 과 npm 구별하기 - LYNMP
사용을 하면서도 가끔가다 둘의 차이가 뭐였더라? 하는 의문을 갖게되는 nvm 과 npm. 아마도 알파벳 하나의 차이 때문이라고, 비영어권 사용자의 애환이라고 변명을 하는것도 슬슬 졸업을 해야겠다 싶어 기록을 해 둡니다.nvm - Node Version Manager풀어쓰면 너무너도 명확하게 알 수 있습니다. Node.js 의 버젼 관리자… 라고 하기에는 의미가 조금 더 넓습니다. 버젼 관리자라고 이해를 하면 업데이트 하는 프로그램? 정도로 생각하기 쉬운데, 이 보다는 Node.js 의 각 버젼을 유지하면서 시스템을 구성해야 하는 경우를 위해 사용하는 경우에 많이 이용됩니다. 다시말해 같은 시스템 안에서 여러 Node.js 를 사용하기 위해 버젼별로 Node.js 환경을 격리시키는 역할로써 더 많이 사용되지 ...
https://lynmp.com/ko/article/tb585d114096490055
　｜　Main Page　｜　Category　｜　 Tags　｜　About Me　｜　Contact　｜　Portfolio
[Node.js] 1. 기본 환경구축 및 Express 프레임워크 설치
　｜　Main Page　｜　Category　｜　 Tags　｜　About Me　｜　Contact　｜　Portfolio