React 서버 구축하기 (Node.js express)

Node.js는 Chrome V8 JavaScript 엔진으로 빌드된 JavaScript 런타임이다.

Node.js는 확장성 있는 네트워크 애플리케이션 개발에 사용되는 소프트웨어 플랫폼이다.

 

JavaScript는 프로그래밍 언어이다.

하지만 독립적인 언어가 아닌 스크립트 언어이다.

스크립트 언어는 특정한 프로그램 안에서 동작하는 프로그램이기 때문에 웹 브라우저 프로그램 안에서만 동작한다.

그래서 JavaScript는 웹 브라우저(크롬, 사파리, 인터넷익스플로러, 파이어폭스 등)가 없으면 사용 할 수 없다.

이를 Node.js가 가능하게 한다.

 

Node.js를 설치하면 터미널 프로그램(윈도우의 cmd, 맥의 terminal 등)에서 Node.js를 실행할 수 있다.

 

Node.js는 JavaScript 문법이다.

Node.js를 이용하여 서버를 만들 수 있다.

 

웹사이트를 만들 때 Client 부분은 JavaScript를 사용하고 서버는 Java 등 다른 언어를 써서 만들어야 했지만 Node.js를 사용하면 JavaScript 언어로 전체 웹 페이지를 만들 수 있다.

 

express는 Node.js를 위한 웹 프레임워크의 하나이다.

MIT 허가서로 라이선스되는 무료-오픈 소스 소프트웨어로 출시되었다.

웹 애플리케이션, API 개발을 위해 설계되었다. 

 

 

React 에서 서버를 구축해보는 과정.

 

react 프로젝트에서 client와 server 폴더를 만든다.

 

 

client 폴더에 react 프로젝트를 다 옮겼다.

 

 

server 폴더에는 server.js 파일을 만들어 주고

터미널에서 서버 폴더로 진입하여 npm init 을 입력해준다.

cd server
npm init

(package.json 기본 내용을 입력하는 것이 나온다. 그냥 엔터 막 쳐준다.)

package.json이 생성이 된다.

그리고 express를 설치한다.

터미널에 npm install express 를 입력해준다.

npm install express

설치가 완료되면 package.json 의 dependencies에 express가 추가된다.

아마 node_modules도 생긴다.

 

 

그리고 이제 준비가 되었으니 server.js 에 내용을 입력한다.

const express = require('express');
const app = express();

const PORT = process.env.PORT || 5001;

const serverTest = require('./routes/serverTest');	//express.Router()를 사용하였다.(설명생략)

//post로 body를 보내고 받기 위해 필요하다고 알고있다.-----------
app.use(express.json());	
app.use(express.urlencoded({ extended: true }));
//-------------------------------------------------------------

app.use('/serverTest', serverTest);	//역시나 router를 사용하기 위함이다.(설명생략)

//서버페이지(http://localhost:5001)에 "Server Page"라고 나온다.-----
app.get('/', function(req, res) {
    res.send("Server Page");
});
//------------------------------------------------------------------

//서버 포트를 5001로 한다.-------------------------------------------
app.listen(PORT, () => {
    console.log(`Server On : http://localhost:${PORT}/`);
});
//-------------------------------------------------------------------

 

http://localhost:5001로 접속해보면 Server Page 라는 문구가 잘 나온다.