How to Create a Simple CRUD Application with Express.js

Creating a CRUD (Create, Read, Update, Delete) application is one of the foundational tasks for any web developer. Express.js, a minimalist web framework for Node.js, makes building such applications straightforward and efficient. In this article, we will walk you through the process of creating a simple CRUD application using Express.js. We’ll cover the necessary tools, structure our application, and provide code snippets to illustrate each step.

What is CRUD?

CRUD represents the four basic operations you can perform on data:

• Create: Add new data.
• Read: Retrieve existing data.
• Update: Modify existing data.
• Delete: Remove existing data.

CRUD applications are essential in various scenarios, such as managing user data, inventory systems, and blogging platforms.

Prerequisites

Before we start building our application, ensure you have the following installed:

• Node.js: The runtime environment for executing JavaScript on the server.
• npm: Node package manager that comes with Node.js.
• A code editor (like Visual Studio Code).

Step 1: Setting Up Your Project

Begin by creating a new directory for your project and navigating to it through the terminal.

mkdir express-crud-app
cd express-crud-app

Initialize a new Node.js project using npm:

npm init -y

This command creates a package.json file that manages the project’s dependencies.

Step 2: Installing Dependencies

Next, we need to install Express.js and a few other packages that will help us manage our application:

npm install express body-parser mongoose

• express: The web framework.
• body-parser: Middleware to parse incoming request bodies.
• mongoose: MongoDB object modeling tool to interact with the database.

Step 3: Setting Up the Server

Create an index.js file in the root of your project. This file will be the entry point of your application.

const express = require('express');
const bodyParser = require('body-parser');
const mongoose = require('mongoose');

const app = express();
const PORT = process.env.PORT || 3000;

// Middleware
app.use(bodyParser.json());

// Connect to MongoDB
mongoose.connect('mongodb://localhost:27017/crudApp', {
    useNewUrlParser: true,
    useUnifiedTopology: true
});

// Basic route
app.get('/', (req, res) => {
    res.send('Welcome to the CRUD API!');
});

// Start the server
app.listen(PORT, () => {
    console.log(`Server is running on http://localhost:${PORT}`);
});

Explanation

1. Express Setup: We initialize the Express application.
2. Body-Parser Middleware: This middleware allows us to parse JSON data from incoming requests.
3. Mongoose Connection: We connect to a MongoDB database named crudApp. Make sure MongoDB is running locally.

Step 4: Creating a Model

In order to manage our data, we need to define a model. Create a new directory named models and create a file named Item.js:

const mongoose = require('mongoose');

const itemSchema = new mongoose.Schema({
    name: {
        type: String,
        required: true
    },
    quantity: {
        type: Number,
        required: true
    }
});

module.exports = mongoose.model('Item', itemSchema);

Explanation

• We define a schema for our items, which include a name and a quantity.

Step 5: Implementing CRUD Operations

Now, let’s implement the CRUD operations in your index.js file.

Create

Add this route to create new items:

const Item = require('./models/Item');

// Create Item
app.post('/items', async (req, res) => {
    const { name, quantity } = req.body;
    const newItem = new Item({ name, quantity });
    try {
        await newItem.save();
        res.status(201).json(newItem);
    } catch (error) {
        res.status(400).json({ message: error.message });
    }
});

Read

To retrieve all items, add this route:

// Get All Items
app.get('/items', async (req, res) => {
    try {
        const items = await Item.find();
        res.json(items);
    } catch (error) {
        res.status(500).json({ message: error.message });
    }
});

Update

To update an item, use this route:

// Update Item
app.put('/items/:id', async (req, res) => {
    try {
        const item = await Item.findByIdAndUpdate(req.params.id, req.body, { new: true });
        res.json(item);
    } catch (error) {
        res.status(400).json({ message: error.message });
    }
});

Delete

Finally, to delete an item, add this route:

// Delete Item
app.delete('/items/:id', async (req, res) => {
    try {
        await Item.findByIdAndDelete(req.params.id);
        res.status(204).send();
    } catch (error) {
        res.status(400).json({ message: error.message });
    }
});

Step 6: Testing the Application

To test your CRUD API, you can use tools like Postman or curl. Here are some example requests:

• Create: Send a POST request to http://localhost:3000/items with a JSON body.
• Read: Send a GET request to http://localhost:3000/items.
• Update: Send a PUT request to http://localhost:3000/items/{id} with a JSON body.
• Delete: Send a DELETE request to http://localhost:3000/items/{id}.

Conclusion

In this article, we walked through creating a simple CRUD application using Express.js. We set up a server, connected to MongoDB, and implemented essential CRUD operations. This foundational knowledge will serve you well as you develop more complex applications with Express.js.

Key Takeaways

• Express.js simplifies building web applications with Node.js.
• Understanding CRUD operations is crucial for data management.
• Using Mongoose makes it easier to interact with MongoDB.

Now that you have a basic CRUD application up and running, you can expand it further by adding features like user authentication, front-end integration, or deploying it to a cloud service. Happy coding!