<프로그래머스 데브코스 풀스택>2026-01-19 TIL

http vs Express

http : 웹서버처럼 활동할 수 있는 모듈

 

express : Node.js 위에서 동작하는 웹 애플리케이션 프레임워크로, HTTP 서버 로직을 구조화하고 단순화해줌

express 설치

npm i express

index.js : 보통 웹의 첫페이지 이름

 

1️⃣ http 기준 서버 열기

let http = require('http');

function onRequest(request, response){
    response.writeHead(200, {'Content-Type' : 'text/html'});
    response.write('Hello Node.js');
    response.end();
}

http.createServer(onRequest).listen(8888);
//http 모듈에 creawteServer 함수에서 할일을 다 한 다음에
//onRequest 콜백 함수를 실행시켜달라고 매개변수로 던짐

 

2️⃣ express 기준 서버 열기(npm 사이트에 적혀있음)

import express from 'express'

const app = express()

app.get('/', (req, res) => {
  res.send('Hello World')
})

app.listen(3000, () => {
  console.log('Server is running on http://localhost:3000')
})

1. express 가져옴.

2. express 호출해서 app에 담음

3. '/' 로 요청이 들어오면, 콜백함수 실행 됨 

 

 

실습

import express from 'express'

const app = express()

// API 테스트
// GET + "/"
app.get('/', (req, res) => {
  res.send('Hello World')
})

// API : GET + "http://localhost:3000/test"
// "TEST SUCCESS"
app.get('/test', (req, res) => {
    res.send('TEST SUCCESS')
})

// API : GET + "HTTP://Localhost:3000/test/1"
// "One!!"
app.get('/test/1', (req, res)=> {
    res.send('One!!')
})

app.listen(3000, () => {
  console.log('Server is running on http://localhost:3000')
})

 

 

get으로 '/test'이 날라오면, 매개변수로 전달받은 콜백 함수를 호출하겠어. => 서버에 세팅

 

app.listen : 서버 셋팅 : 포트 넘버로 셋팅 (순서 상관 X)

 

---

🤔⚠️ 실행 중의 warning

(node:7565) [MODULE_TYPELESS_PACKAGE_JSON] Warning: Module type of file:///Users/admin/Desktop/BootCamp/node-base/express-demo.js is not specified and it doesn't parse as CommonJS.

Reparsing as ES module because module syntax was detected. This incurs a performance overhead.

To eliminate this warning, add "type": "module" to /Users/admin/Desktop/BootCamp/node-base/package.json.

(Use `node --trace-warnings ...` to show where the warning was created)

Server is running on http://localhost:3000

강의 중에 이러한 warning이 떴다. 

번역하면 

모듈 유형이 지정되지 않았으며 CommonJS로 파싱되지 않습니다.
모듈 구문이 감지되었으므로 ES 모듈로 다시 파싱합니다. 이로 인해 성능 오버헤드가 발생합니다.

지피티와 토론 결과, 

CommonJS방식이 디폴트인데, ES Module을 사용하고 있어서, 일단 ES Module로 해석을 하긴했는데

이건 성능성 손해이니, 명확하게 설명해라 

라는 것이다.

원래는 한 번에 CommonJS로 파싱해야하는데,

CommonJS 실패 => ES Module 로 다시 파싱되어 손해를 본다는 것이다. 

 

여기서 나는 두 방식이 뭔지도 몰라서.. 이것도 찾아봄

 

CommonJS 방식

const express = require('express');
module.exports = app;

 

ES Module 방식

import express from 'express';
export default app;

 

 

이고, 

ES Module이 더 좋은 이유

- ES Module은 ECMAScript 표준 / CommonJS은 Node.js전용 구현
 : ECMAScript가 전 세계 공통 규칙, CommonJS은 Node.js가 편하자고 만든 규칙  

    👉🏻 브라우저 / Node.js / 번들러 등의 환경 통합이 된다 (CommonJS은 브라우저 불가)

- 정적 분석 가능(Tree Shaking 가능) : 실행 전에 어떤 모듈쓰는지, 어떤 함수 쓰는지 도구가 미리 알 수 있음

    👉🏻 번들 크기 감소, 빌드 최적화, 로딩속도 증가 / CommonsJS는 불가능.

- 브라우저에서 바로 사용가능 

<script type="module">
  import app from './app.js';
</script>

 

- Node 공식 권장 방향, ESM-only 패키지가 점점 증가함

 

➡️ package.json에 

"type" : "module"

---

 

app.get('/products/1', (req, res) => {
    res.send('Node.js를 배워보자 (책)')
    res.send(2000)
})

이렇게 보내면 첫번째 send만 받아버림.

=> 자바스크립트 객체로 보내버리자. 

 

객체란?

: 데이터를 하나씩 X => 데이터를 모아모아 덩어리로 보내겠다!

ex. "Node.js를 공부해보자.라는 책" 

- 상품명 : Node.js를 공부해보자

- 가격 : 20000

- 상품소개 : 책에 대한 설명입니다

 

json이란?

: javascript object notation 

: 자바스크립트 객체가 어떻게 생겼나 = 어떤 형태인가

let nodejsbook = {
	title : "Node.js를 공부해보자",
    price : 20000,
    description : "책에 대한 설명입니다",
}

function print(book){
    console.log(book.title)
    console.log(book.price)
    console.log(book.description)
}

print(nodejsbook)

 

 

 

app.get('/', (req, res) => {
  res.json({
    say : '안녕하세요'
  })
})

 

 

프론트엔드가 이 값으로 처리해서 보여줌.

 

app.get('/products/1', (req, res) => {
    res.json({
        title : "Node.js를 배워보자 (책)",
        price : 20000,
        description : "이 책에 대한 설명입니다."
    })
})

or

let nodejsbook = {
	title : "Node.js를 공부해보자",
    price : 20000,
    description : "책에 대한 설명입니다",
}

app.get('/products/1', (req, res) => {
    res.json(nodejsbook)
})

 

app.get('/products/1', (req, res) => {
    res.json({
        num : 1
    })
})

app.get('/products/2', (req, res) => {
    res.json({
        num : 2
    })
})


app.get('/products/3', (req, res) => {
    res.json({
        num : 3
    })
})

을 한번에

app.get('/products/:n', (req, res) => {
    //: => 나한테 URL로 매개변수를 전달 해줄 거구나 
    // products/__ 빈칸에 오는 값을 n이라는 변수에 담아줘
    //console.log(req.params) ==> {n: '3'}
    //console.log(req.params.n) ==> {3}
    res.json({
        num : req.params.n
    })
})