220113_TIL_04

express

: Node에서 쉽게 웹 서버를 개발할 수 있도록 도와주는 프레임워크

• 요청과 응답을 도와주는 역할

express 설치

• yarn init 으로 package.json 파일 설치
• package.json 파일에 “type": "module" 추가
• yarn add express : express 설치
• package.json 파일에 express 가 추가되었는지 확인 ( package.json 파일에는 설치목록만 알려주고 있는것이고 실제 설치된 파일들은 node_modules 폴더안에 존재하는것 )
• 따라서, package.json에는 express가 있는데, node_modules 폴더가 없으면 다시 yarn install 해주어야지 express를 사용할 수 있는것
• 📌node_modules 폴더 는 깃허브에 올리지 않음 -> 파일이 너무 크기에
  • gitignore 파일을 만들어서 안에 node_modules 작성하면 깃허브에 해당 파일이 올라가지 않음

express 사용

: 방금 설치한 express 를 사용하려면 함수를 불러와야함

• import 를 사용하여 express 불러오면되는것!

import express from 'express'

npm 사이트에 나온 설명을 참고해 API 만들기

import express from 'express' // 다른 파일에서 express 불러오기
const app = express() //express를 실행하여 실행된 결과를 새로운 변수 app 에 담아준것 
----------------------------------------------------------------------
// app 사용 (app.post / app.delete/ app.update / app.get)
// '/'의 endpoint 를 가진 get 방식의 api 만들기
app.get('/', function (req, res) {   
  res.send('Hello World') // GET 요청이 들어왔을 때 Hello World라고 응답을 보내주는것
})
app.listen(3001) // 고유 포트번호 : 서버를 3001번 포트에서 실행되도록 설정하는것

API 실행

1) node index.js 명령어로 서버를 켜기
2) postman에서 GET으로 http://localhost:3001 요청을 보내기

• 고유 포트번호로 요청을 보내야하는것! (다른 포트번호로 요청을 보내면 응답없음 상태가 뜨게됨)

3) 응답으로 Hello World 를 받게됨
⭐️ 서버를 종료하고 싶다면 터미널에서 컨트롤 + c 눌러주면 됨

라우팅

: URI(또는 경로) 및 특정한 HTTP 요청 메소드(GET, POST 등)인 특정 엔드포인트에 대한 클라이언트 요청에 애플리케이션이 응답하는 방법을 결정하는 것

Swagger

: REST API를 쉽게 문서화하고 테스트할 수 있도록 도와주는 도구

swagger 설치 및 사용

• yarn add swagger-ui-express
• yarn add swagger-jsdoc
• 설치하고 나면 import 해주기

import swaggerUi from 'swagger-ui-express';
import swaggerJsdoc from 'swagger-jsdoc'

• app.use 작성 => npm 사이트 swagger-jsdoc 참고
  ( app. use = 미들웨어 역할 : 양 쪽을 연결하여 데이터를 주고 받을 수 있도록 중간에서 매개 역할을 하는 소프트웨어)

app.use('/api-docs', swaggerUi.serve, swaggerUi.setup(swaggerJsdoc));

• swaggerJsdoc 부분에 설정파일(option) 넣어주기 => npm 사이트 swagger-jsdoc 참고

import express from 'express'
import {checkValidationPhone, getToken, sendTokenTOSMS} from './phone.js' 
import swaggerUi from 'swagger-ui-express';
import swaggerJsdoc from 'swagger-jsdoc'
import {options} from './swagger/config.js'

const app = express()    
app.use(express.json())  
app.use('/api-docs', swaggerUi.serve, swaggerUi.setup(swaggerJsdoc(options)));
app.get('/', (req, res) => {res.send('Hello World!');});

• options 을 config.js 파일에서 import 해오기
  (아래 내용은 npm 사이트 swagger-jsdoc 참고 )

export const options = {
    definition: {
      openapi: '3.0.0',
      info: {
        title: '나만의 미니프로젝트 API 명세서',  
        // title = swagger 접속했을때의 제목부분
        version: '1.0.0',
      },
    },
    apis: ['./swagger/*.js'], // files containing annotations as above
  };

API-Docs 만들기

/**
 * @openapi
 * /board:
 *   get:
 *     summary: 게시글 가져오기
 *     tags: [Board]
 *     parameters:
 *         - in: query
 *           name: number
 *           type: int
 *     responses:
 *       200:
 *         description: 성공
 *         content:
 *              application/json:
 *                  schema: 
 *                      type: object
 *                      properties:
 *                          number:
 *                              type: int
 *                              example: 1
 *                          writer:
 *                              type: string
 *                              example: 철수
 *                          title:
 *                              type: string
 *                              example: 제목입니다!~~~
 *                          contents:
 *                              type: string
 *                              example: 내용입니다!!!
 */



/**
 * @openapi
 * /board:
 *   post:
 *     description: Welcome to swagger-jsdoc!
 *     responses:
 *       200:
 *         description: Returns a mysterious string.
 */