Hands-on Practice 1

Step-by-Step Coding Procedure:

Setup and Initialize Project:
- Create a project folder express-crud-app.
- Initialize Node project and install Express:
  mkdir express-crud-app && cd express-crud-app npm init -y npm install express
Create Basic Server (index.js):
- Set up basic Express server index.js for Managing User

// Create index.js:

const express = require('express');
const app = express();
const PORT = 3000;

// Middleware to parse JSON bodies
app.use(express.json());

// Sample user data
let users = [
  { id: 1, name: 'Alice', email: '[email protected]' },
  { id: 2, name: 'Bob', email: '[email protected]' },
];

// GET all users
app.get('/users', (req, res) => {
  res.json(users);
});

// GET a specific user by ID
app.get('/users/:id', (req, res) => {
  const user = users.find(u => u.id === parseInt(req.params.id));
  if (user) {
    res.json(user);
  } else {
    res.status(404).send('User not found');
  }
});

// POST a new user
app.post('/users', (req, res) => {
  const newUser = { id: users.length + 1, ...req.body };
  users.push(newUser);
  res.status(201).json(newUser);
});

// PUT to update a user
app.put('/users/:id', (req, res) => {
  const index = users.findIndex(u => u.id === parseInt(req.params.id));
  if (index !== -1) {
    users[index] = { id: parseInt(req.params.id), ...req.body };
    res.json(users[index]);
  } else {
    res.status(404).send('User not found');
  }
});

// DELETE a user
app.delete('/users/:id', (req, res) => {
  users = users.filter(u => u.id !== parseInt(req.params.id));
  res.status(204).send();
});

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

Implement CRUD Operations:

Create RESTful API routes for managing users as shown above.
RESTful API Routes for Managing Users:

// index.js
const express = require('express');
const app = express();
const PORT = 3000;

app.use(express.json()); // Middleware to parse JSON bodies

let users = [
  { id: 1, name: 'Alice', email: '[email protected]' },
  { id: 2, name: 'Bob', email: '[email protected]' }
];

// GET all users
app.get('/users', (req, res) => {
  res.json(users);
});

// GET a specific user by ID
app.get('/users/:id', (req, res) => {
  const user = users.find(u => u.id === parseInt(req.params.id));
  if (user) {
    res.json(user);
  } else {
    res.status(404).send('User not found');
  }
});

// POST a new user
app.post('/users', (req, res) => {
  const newUser = { id: users.length + 1, ...req.body };
  users.push(newUser);
  res.status(201).json(newUser);
});

// PUT to update a user
app.put('/users/:id', (req, res) => {
  const index = users.findIndex(u => u.id === parseInt(req.params.id));
  if (index !== -1) {
    users[index] = { id: parseInt(req.params.id), ...req.body };
    res.json(users[index]);
  } else {
    res.status(404).send('User not found');
  }
});

// DELETE a user
app.delete('/users/:id', (req, res) => {
  users = users.filter(u => u.id !== parseInt(req.params.id));
  res.status(204).send();
});

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

Testing with Postman:

4. Testing with Postman:

GET: Retrieve All Users
- Open Postman.
- Select GET from the dropdown.
- Enter http://localhost:3000/users in the URL field.
- Click Send.
- Expected Result: A list of all users in JSON format.
POST: Add a New User
- Select POST from the dropdown.
- Enter http://localhost:3000/users in the URL field.
- Go to the Body tab, select raw, and choose JSON format from the dropdown.
- Enter the following JSON data:
  { "name": "Charlie", "email": "[email protected]" }
- Click Send.
- Expected Result: The new user object is returned with an assigned ID.
PUT: Update User Details
- Select PUT from the dropdown.
- Enter http://localhost:3000/users/1 (replace 1 with the user ID you want to update).
- Go to the Body tab, select raw, and choose JSON format.
- Enter the updated JSON data:
  { "name": "Alice Updated", "email": "[email protected]" }
- Click Send.
- Expected Result: The updated user object is returned.
DELETE: Remove a User
- Select DELETE from the dropdown.
- Enter http://localhost:3000/users/1 (replace 1 with the user ID you want to delete).
- Click Send.
- Expected Result: No content returned (status code 204), indicating the user was successfully deleted.
By following these steps, you'll be able to effectively test your RESTful API endpoints using Postman.

Student Activity:

Build a RESTful API to manage a "tasks" list (similar CRUD operations as above).
Test all API endpoints using Postman.
Bonus: Add validation to ensure all fields are correctly provided before adding or updating a user.

By the end of this session, students will understand key Node.js and Express concepts, be able to build web applications, and create RESTful APIs with real-world examples.

PreviousLesson 3: How to create Layouts and Pages NextHands on Practice 2

Last updated 5 months ago