메타버스 백엔드 웹반

[Node.js] 서버 구현 및 API 테스트: Express와 POSTMAN 활용

thisnorm 2025. 1. 13. 18:46

1. 서버 구현

📌서버 구현 코드

똑같이

git init 으로 초기화해주고

npm i(install) express --save
를 입력하여 express 라이브러리를 설치해준다

.gitignore 파일을 생성하여
node_modules 파일을 가려주고
**app.js 파일을 하나 만들어
const express = require('express')
const app = express()

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

app.listen(3000)
이 코드 내용을 입력해준다.
이로써 서버 구현은 끝났다.

이때, function(req, res) 부분에서 function 부분을 ⇒ 로 대체 가능

따라서 (req, res) ⇒ 이걸로 바꿀 수 있다.

 

여기에 메소드를 추가해보자

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

app.get('/', (req, res) => {
    console.log('Got a GET request from Client')
    res.send('Got a response from Server')
})

app.post('/', (req, res) => {
    console.log('Got a post request from Client')
    res.send('Got a response from Server')
})

app.put('/user', (req, res) => {
    console.log('Got a put request from Client')
    res.send('Got a response from Server')
})

app.delete('/user', (req, res) => {
    console.log('Got a delete request from Client')
    res.send('Got a response from Server')
})

app.listen(port, () => {
    console.log(`Node Legacy App listening on port ${port}`)
})
node app.js 를 통하여 서버를 여고 cmd창으로 이동한다.

curl localhost:3000 를 실행하면 출력이 된다.

curl -X (GET/POST/PUT/DELETE) localhost:3000
4가지 메소드 중에 하나를 실행해보자

메소드는 반드시 대문자로 작성해야 한다.

그러면 CMD 창에는 Got a response from Server가 출력되고

node창에는 GOT A (GET/POST/PUT/DELETE) request from Client가 출력된다.

 

수정된 부분은 app.listen부분으로 직접 하드코딩되었던 port 번호가 코드 상단에 변수로 선언 및 할당되고 화살표함수를 통해 로그를 프린트하는 console.log함수가 추가되었다. 로그 기능 외에는 사실 동일한 코드라고 볼 수 있다.

PORT란?

포트 번호란 간단히 말하면 IP주소가 집주소라고 가정하면, 그 집의 방 번호라고 볼 수 있다.

인터넷 프로토콜(IP)을 사용하여 컴퓨터 네트워크에서 통신을 할 때, 포트 번호는 특정 프로세스 또는 애플리케이션이 네트워크로부터 데이터를 수신하거나 보낼 수 있는 위치를 나타내는 숫자이다. 포트 번호는 통신을 하는 두 컴퓨터 간의 어떤 프로세스나 애플리케이션이 통신을 시작하고, 데이터를 주고 받을 때 필요하다.

app.listen()?

app은 선언된 변수를 따라 보면 결국 express 프레임워크를 지칭하고 있다. 따라서 app객체는 express() 메소드 호출로 생성되는 익스프레스 서버 객체를 의미한다.

그럼 도트구분자(.)를 통해 포함의 관계를 따라서 express가 가지고 있는 함수인 listen()은 무엇일까?

app.listen(port, () => {
  console.log(`Example app listening on port ${port}`)
})

IDE를 통해 Ctrl+클릭으로 express 프레임워크가 정의한 listen()의 세부 내용을 볼 수 있다.

첫 파라미터로 port 번호, 콜백함수로 정의된 것이 보인다.

app.listen() 함수는 프레임워크 내부적으로 HTTP 서버 인스턴스를 리턴하는것으로 구성되어 있다. 이에 따라 app.listen(3000)은 3000번 포트에서 서버의 연결을 말하며 해당 포트로의 요청을 청취하는 중인 것으로 이해하면 된다. typescript에서 보았던 문법적 표현으로 port, callback?, : http.Server가 각각 지정된 것을 이해 할 수 있다.

위 아래로도 호스트이름 등 더 많은 파라미터를 받는 함수가 여러개 정의된 것을 볼 수 있다. 메서드 오버로딩 개념으로 다양한 타입 또는 갯수의 인수를 받아 서버를 실행 할 수 있도록 구성되어 있음.

 

콜백 함수(Callback Function)

비동기 작업이 완료된 뒤에 실행되도록 하는 함수를 의미한다. 후행작업이라고 생각하면 된다.

 

오버로딩(Overloading)

  • 오버로딩이란 같은 이름을 가진 함수가 서로 다른 매개변수 형식, 갯수를 지원할 수 있도록 하는 것이다. 사실 함수의 이름이 같을 뿐 매개변수의 갯수(타입 등)가 다른 호출에서 전달하는 인수에 따라 전혀 다른 메서드를 호출 하는 개념임. 그래서 오버로딩은 New 의 개념
  • ps) 오버라이딩은 상속받은 부모의 메소드를 재정의하는 것을 의미한다. 오버라이딩은 상속과 연결지어 생각해야 하며, 따라서 새로움 보다는 수정 Modify의 개념
  • 하지만 JavaScript에서 오버로딩과 오버라이딩은 정확한 키워드로는 존재하지 않는다.
    • 오버로딩: JavaScript에서는 전통적인 의미의 오버로딩이 존재하지 않지만, 함수 이름이 동일할 경우, 후에 선언된 함수가 이전의 함수를 덮어쓰게 됨. 인자의 개수나 타입에 따라 다른 동작을 수행하는 전통적인 오버로딩은 구현하기 까다로움(조건문을 통한 제어 또는 가변개수 변수 활용 등)
      • 하지만 Express는 어떻게 오버로딩을 구현한 것일까? 
      • 설치한 Express의 경로를 보면 TypeScript 구조를 가지고 있어 오버로딩을 자연스럽게 사용 하고 있음. 이처럼 많은 JavaScript 모듈 또한 TypeScript를 통해 더욱 발전 하는 중
    • 오버라이딩: JavaScript에서는 같은 이름의 함수가 후에 선언될 때, 이전의 함수가 재정의되는 현상은 오버라이딩이라고 볼 수 있음. 즉, 하나의 이름을 가진 함수가 다른 구현으로 덮어쓰여지기 때문에, 실제로 오버라이딩의 개념은 구현 할 수 있음

app.get()?

상단에는 Express가 get()이라는 함수를 가지고 있는것도 확인 할 수 있다.

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

get()은 주소창에 입력 받았을 때 실행할 사항들을 나타내는 라우트 함수, 라우터 등으로 불리운다. ‘/’ 가 엔드포인트를 말하며 이를 통해 브라우저에서 Hello World! 라는 문자열이 응답으로 출력된 것을 확인한 것이다.

라우터는 클라이언트의 요청 경로(path)를 보고 이 요청을 처리할 수 있는 곳으로 기능을 전달해주는 역할을 한다. 이러한 역할, 기능 자체를 라우팅이라고 하는데, 애플리케이션 엔드 포인트 (URI)의 정의, 그리고 URI가 클라이언트 요청에 응답하는 방식을 의미한다.

HTTP 요청은 get, post, put, head, delete, options 등이 있다. 위 코드는 HTTP 요청 방식 중 Get 요청에 대한 부분이 구현된 것으로 볼 수 있으며 엔드포인트가 /이므로 localhost:3000/ 에 대한 요청으로 콜백 함수인 res(ponse)로 ‘Hello World!’ 문자열을 응답한다고 볼 수 있다.

2. POSTMAN 설치

위 처럼 요청을 테스트하는데 CLI 환경은 비효율적이다. 요청 및 응답을 테스트하는 도구인 POSTMAN을 설치하여 테스트 하자.

  • Postman이란 API 개발시 도와주는 소프트웨어 플랫폼
  • API 즉, 요청 양식 맞춰서 HTTP 요청을 서버에 보내고 응답을 확인하는 과정을 반복해 나가게 되므로 클라이언트 테스트 자체가 편리해야 할 필요가 있음
  • 이러한 요청 테스트 작업을 간편하게 할 수 있도록 도와주는 플랫폼 중 하나가 Postman이며 브라우저처럼 하나의 클라이언트라 생각 하면 됨
    • 각 Method를 선택 할 수 있으며 해당 요청문 자체를 저장, 계층화 저장, 이후 API 문서화 까지 도와주는 기능
  • 위 요청들을 간단히 실행 할 수 있음

  • 왼쪽 위에 버튼을 통하여 폴더를 생성하여 관리할 수 있다. (Blacnk collection)