Autogenerated documentation API with OpenAPI and Swagger for NodeJS and Express

Luiz Calaça - Feb 15 '22 - - Dev Community

Hi, Devs!

That's really important a documentation and good patterns of our API, it shows in cleanable way what is available.

There are OpenAPI for good patterns and Swagger for help us to generate the documentation using OpenAPI.

OpenAPI is:

The OpenAPI Specification (OAS) defines a standard, programming language-agnostic interface description for HTTP APIs, which allows both humans and computers to discover and understand the capabilities of a service without requiring access to source code, additional documentation, or inspection of network traffic. When properly defined via OpenAPI, a consumer can understand and interact with the remote service with a minimal amount of implementation logic. Similar to what interface descriptions have done for lower-level programming, the OpenAPI Specification removes guesswork in calling a service.

And Swagger can help us to generate the documentation with the good standard from OpenAPI. Look at one example:

Swagger and OpenAPI

We also could execute our routes and get the data through Swagger docs on web. It uses curl to get data from our URL.

Swagger running routes

A great tool!

So let's see how we can use it. In the root of your project create swagger.js:

const swaggerAutogen = require('swagger-autogen')()

const outputFile = './swagger_output.json'
const endpointsFiles = ['./routers/personRouter.js']

swaggerAutogen(outputFile, endpointsFiles)
Enter fullscreen mode Exit fullscreen mode

The outputFile will have the file configuration about our routes that are executing on Express. The endpointFiles is our path to routes to be documented.

Naturally, after we need to install swagger-autogen and swagger-ui-express.

npm install swagger-autogen and swagger-ui-express
Enter fullscreen mode Exit fullscreen mode

In our package.json we need to add:

  "scripts": {
    "start": "node index.js",
    "swagger-autogen": "node swagger.js"
  },
Enter fullscreen mode Exit fullscreen mode

At the command line in root of our folder we can write and execute:

npm run swagger-autogen
Enter fullscreen mode Exit fullscreen mode

And the swagger_ouput.json will generate. And we can add into the index.js:

const express = require('express');
const swaggerUi = require('swagger-ui-express')
const swaggerFile = require('./swagger_output.json')
const router = require('./routers/personRouter')

const router = express.Router();
const app = express();

app.use(express.json());
app.use('/person', router.personRouter))
app.use('/doc', swaggerUi.serve, swaggerUi.setup(swaggerFile))

app.listen(3000, () => {
  console.log(`Running on 3000`);
});

Enter fullscreen mode Exit fullscreen mode

I'm using personRouter as an example that has some routes, you can use any file that you have the Express routes e references on the swagger.js. At the end you can access:

http://localhost:3000/doc
Enter fullscreen mode Exit fullscreen mode

Use it like a playground.

Curl and Post a Person

Save this article, I'm sure that you need to do that in some projects in your life. And if you have any doubt, share on comments.

Contacts
Email: luizcalaca@gmail.com
Instagram: https://www.instagram.com/luizcalaca
Linkedin: https://www.linkedin.com/in/luizcalaca/
Twitter: https://twitter.com/luizcalaca

. . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Terabox Video Player