Build a Simple JSON API with Express.js on a Local Server

Pranesh Chowdhury - May 15 - - Dev Community

Creating a simple server looks like an exciting thing to do. If you're fetching data from other sites, why not create your own server for accessing API data?

It's Easy!!

Image description

Let's learn how to make a local server using express.js for your project by following these steps:

Image description

First, you need to install Node.js. I assume that you have already installed Node.js on your computer.

Install and setup the server:

First, create the backend server:

mkdir my-app-server
Enter fullscreen mode Exit fullscreen mode

Go to the folder path:

cd my-app-server
Enter fullscreen mode Exit fullscreen mode

npm init:

npm init -y
Enter fullscreen mode Exit fullscreen mode

npm install express:

npm install express
Enter fullscreen mode Exit fullscreen mode

Install cors:

npm install cors
Enter fullscreen mode Exit fullscreen mode

Cors gives access to the server for your project (API call). Otherwise API call in your project will show 'failed to load'.

Then create a file 'index.js'. Now write code in 'index.js'.

const express = require('express');
const app = express();
const cors = require('cors');
const port = process.env.PORT || 5000;

const categories = require('./data/categories.json');

app.use(cors());

app.get('/', (req, res) => {
    res.send("Server is running");
});

app.get('/categories', (req, res) => {
    res.send(categories); 
})

app.listen(port, () => {
    console.log(`Server (categories) is running on port: ${port}`);
})

Enter fullscreen mode Exit fullscreen mode

Our data file is categories.json.

Image description

Data of categories.json file:

[
    {
        "id": 1,
        "category": "World",
        "total_news": 150
    },
    {
        "id": 2,
        "category": "Politics",
        "total_news": 120
    },
    {
        "id": 3,
        "category": "Business",
        "total_news": 100
    },
    {
        "id": 4,
        "category": "Technology",
        "total_news": 80
    },
    {
        "id": 5,
        "category": "Sports",
        "total_news": 90
    }
]
Enter fullscreen mode Exit fullscreen mode

Run the server:

Run the server using nodemon:

nodemon index.js
Enter fullscreen mode Exit fullscreen mode

Nodemon helps to update the server in real-time.

Open your web browser and go to http://localhost:5000. You should see "Server is running" displayed on the page.

Image description

If you go to http://localhost:5000/categories. Then you can see some categories of data.

Image description

Now you can easily access this data for your project.

Image description

That's why I'm here:

YouTube Tutorial: https://youtu.be/u6q5yqlc8bM?si=RQeVvzZRNYdUA0Wc

Thank You.

Image description

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