How to Install Swagger Editor and UI Locally

How to Install Swagger Editor and UI Locally ?


As you already know data scientist usually works mostly on the API endpoints. These endpoints give some responses in a structure or formatted object. JSON is one of the most used formats to get and post the responses through the endpoint. But the major problem I have found is how to document them so that each team member in a project can understand them easily. There are various tools for API documentation. But the popular one is SWAGGER. In this post, you will learn how to install and use Swagger locally.

If you really want to understand the basics of swagger and API , Do not forget to checkout this video tutorial on Rest API design and development. This video course is very concise and focused so it will save your lot of time and trust you will achieve 80 % percent of relevant knowledge by investing 20 % of your time.

What is Swagger?

Swagger is a tool that helps you to design, build better APIs, and document it throughout the API lifecycle. Such that any developer can use the APIs effortlessly. You can think of it as a tool to build and follow a design approach, such that these APIs can easily integrate with the web, mobile, and other third-party applications easily. Swagger is available in both free and pro versions. The Swagger Editor, Swagger UI, and Swagger Codegen are free and open-source tools while Swagger Hub is free for one user and paid for organizations and teams. Swagger Inspector is for testing the APIs endpoints in the cloud and it is paid. In this post, you will learn only to install Swagger Editor and Swagger UI.

How to Install Swagger Locally?

In this section, you will learn how to install Swagger Editor and Swagger UI in your operating system step by step.

Step 1: Download and Install NodeJs

Swagger Editor and Swagger are coded in Javascript language, therefore, to build and run it you have to use NodeJs. Go to the NodeJs official site and download the LTS (Stable) version according to your operating system. Install it in your operating system.

Step 2: Download the Swagger Editor and UI

You can directly install the Swagger using the npm command but after installing it requires some other commands that you don’t remember. Therefore the best way is to install it using the source code. Go to the official Swagger GitHub page. There you will find the swagger-UI and swagger-editor links. Click on them and download the latest releases.


swagger ui latest releases

Step 3: Install the HTTPS Sever

You have to first install the Sever as a localhost to run the Swagger Editor and UI. Open your command prompt and type the following command

npm install -g http-server

Step 4: Install and Build the Source Code

For installing you can use any terminal or command prompt. Here I am using Windows Command prompt for building the source code. Unzip the download Swagger Editor and go, insider, the folder and type the following command

npm install

It will take some minutes to install the source code.

npm install command prompt

Step 5: Run the Swagger Editor

After installing the swagger editor locally now type the following command to start a server for the editor

npm start

npm start server

Hurray, You have successfully installed the Swagger Editor and easily deployed it on your localhost. In the same way, you can use the same commands to install and run the swagger UI locally.

swagger editor


Installation of Swagger UI

npm install

npm start 

npm start swagger ui

Other Information

How to install swagger in ubuntu

You can install swagger in ubuntu in ubuntu. To do so you have to run the following lines of code.

npm install -g http-server

git clone

http-server -p 8080 swagger-editor

It will successfully launch the editor on port 8080. But make sure the port must not be occupied by the other services.

Fast API uses Swagger UI


You will very excited to know that Now you can automatically make documentation of API endpoints using swagger. There is a python package Fast API that allows you to make endpoints with documentation. Documentation of the endpoints is easily created by using the wrapper above the function. If you have already knowledge of Flaks then it’s very easy to learn Fast API.


Data Science Learner Team

Join our list

Subscribe to our mailing list and get interesting stuff and updates to your email inbox.

Thank you for signup. A Confirmation Email has been sent to your Email Address.

Something went wrong.

Thank you For sharing.We appreciate your support. Don't Forget to LIKE and FOLLOW our SITE to keep UPDATED with Data Science Learner