Swagger with TypeScript in Node.js Express Project

[godtaehee]

Reference

• https://velog.io/@yongh8445/Node-Express-Swagger-%EC%97%B0%EB%8F%99

npm i swagger-ui-express swagger-jsdoc를 통해 package 들을 다운받아준다.

swagger-ui-express는 swagger-ui를 express에 쉽게 적용시킬 수 있도록 해주는 라이브러리이다.

swagger-jsdoc은 OpenAPI 형식으로 관리하기 용이하도록 해주는 라이브러리이다.

jsdoc도 한번 찾아보면 좀 감이 올것이다.

우리는 TypeScript프로젝트에 Swagger를 적용할 것이므로

@types/swagger-jsdoc와 @types/swagger-ui-express도 함께 설치해주자.

import * as swaggerJSDoc from 'swagger-jsdoc';
import * as swaggerUI from 'swagger-ui-express';

설치후 app.ts파일에 app이 listen하기전에 import해준다음 option을 설정해줘야한다.

const options = {
  definition: {
    openapi: '3.0.0',
    info: {
      title: 'LogRocket Express API with Swagger',
      version: '0.1.0',
      description:
        'This is a simple CRUD API application made with Express and documented with Swagger',
      license: {
        name: 'MIT',
        url: 'https://spdx.org/licenses/MIT.html',
      },
      contact: {
        name: 'LogRocket',
        url: 'https://logrocket.com',
        email: 'info@email.com',
      },
    },
    servers: [
      {
        url: 'http://localhost:3000/books',
      },
    ],
  },
  apis: ['./routes/books.js'],
};

const specs = swaggerJSDoc(options);

app.use('/api-docs', swaggerUI.serve, swaggerUI.setup(specs));

이렇게 option에 swagger를 OpenAPI로 사용할때의 옵션을 만들어주고 swaggerJSDoc을 이용해 문서를 만든다음,

GET요청 /api-docs로 접근했을때 문서가 보이게 하자 API 주소는 자유다.

성공적으로 api문서가 보이는것을 알수있다.

[godtaehee]

https://velog.io/@hyex/Node.js-TS-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8%EC%97%90-swagger-%EC%A0%81%EC%9A%A9%ED%95%98%EA%B8%B0-Feat.-%ED%8C%8C%EC%9D%BC-%EB%B6%84%EB%A6%AC