Next.js with Swagger

salon_sue

Is there a way to have a swagger documentation for NEXT.js API routes? I'm using Next.js for both front-end and back-end development and I want to have a swagger documentation for the APIs I develop with Next.js.

Originally asked by Ehsan Shekari on Stack Exchange (stackoverflow) (CC BY-SA 4.0).

uphilltech

Great question — answering as the UphillTech team:

You can use the following project to bootstrap the integration between Next.js and Swagger https://github.com/jellydn/next-swagger-doc https://www.npmjs.com/package/next-swagger-doc Demo yarn add next-swagger-doc swagger-ui-react import { GetStaticProps, InferGetStaticPropsType } from 'next'; import { createSwaggerSpec } from 'next-swagger-doc'; import SwaggerUI from 'swagger-ui-react'; import 'swagger-ui-react/swagger-ui.css'; const ApiDoc = ({ spec }: InferGetStaticPropsType<typeof getStaticProps>) => { return <SwaggerUI spec={spec} />; }; export const getStaticProps: GetStaticProps = async ctx => { const spec: Record<string, any> = createSwaggerSpec({ title: 'NextJS Swagger', version:...

Full answer by kachar: https://stackoverflow.stackexchange.com/a/69109293 (CC BY-SA 4.0).

Need it done for your business? UphillTech.