Skip to content
Go to the official Postman download page, select the installer for the operating system (Windows, macOS, Linux), and download the app.For Windows, run the downloaded .exe file and follow the prompts to install.youtube+1For Linux, use Snap with sudo snap install postman, or download and extract from the official site. Optionally, create a desktop entry for easy launching.After installation, launch Postman, create or sign in to a Postman account (required for full functionality), and optionally set up a workspace to organize requests.youtube+1Validates that API endpoints (URIs) return expected responses, status codes, and data formats via different HTTP methods (GET, POST, PUT, DELETE).Allows testing of authentication, headers, payloads, and query parameters for API requests.youtubeFacilitates writing tests in JavaScript to automate checks for response status, data, and error handling, supporting contract, unit, and integration testing.Supports organizing requests into collections, running sequences of tests, and maintaining environment variables for multiple setups (dev, QA, production).Enables debugging of APIs during development and documents API behavior for team collaboration.Streamlines learning about RESTful APIs, HTTP methods, and client-server communication.youtubeHelps QA engineers and developers rapidly find bugs and regressions in evolving APIs.Supports demoing, sharing, and collaborating on API requests via collections and environments.
Lab 1: Basic GET (no parameters) - simplest starting pointLab 2: Query parameters in URLs - form data with GETLab 3: Route parameters - resource identificationLab 4: POST with form data - first mutationLab 5: POST with JSON - modern API approachLab 6: REST pattern - same URL, different methodsLab 7: Validation - proper error handlingLab 8: Complete CRUD - full lifecycleLab 9: Advanced search - complex filteringLab 10: E-commerce app - everything combined
Postman installation guide at the startMix of GET and POST throughout with clear distinctionsQuery parameters and route parameters explainedForm data and JSON body examplesValidation and error handling patternsReal-world scenarios (task manager, e-commerce, employee search)
Download the version for your operating system (Windows, Mac, or Linux)Install and launch PostmanYou can create a free account or click "Skip and go to the app"Create a new Collection called "MADS 4012 Labs" to organize your requests
Open PostmanClick "New" → "HTTP Request"Set Method: Select GET from dropdownEnter URL: http://localhost:3000/welcomeClick "Send"
GET requests retrieve data without modifying anythingNo parameters needed for simple data retrievalStatus code 200 means successResponse time shows server performance
Click "Save" buttonName it "Lab 1 - Basic Welcome"Add to your "MADS 4012 Labs" collection
Method: GETURL: http://localhost:3001/greetClick "Send"Method: GETURL: http://localhost:3001/greet?firstName=John&lastName=Doe&age=25Click "Send"Method: GETURL: http://localhost:3001/greetClick "Params" tabAdd Key-Value pairs:firstName = SarahlastName = Smithage = 30Notice how Postman builds the URL automatically!Click "Send"
Query parameters appear after ? in the URLMultiple parameters separated by &Form data sent via GET becomes visible in URL {url re writing}Use req.query to read query parameters in ExpressPostman's Params tab makes testing easier
Open browser to http://localhost:3001Fill out the form and submitObserve the URL changes with query parametersData is visible in the browser address bar
Method: GETURL: http://localhost:3002/studentsClick "Send"Method: GETURL: http://localhost:3002/students/101Click "Send"Note status code: 200 OKMethod: GETURL: http://localhost:3002/students/999Click "Send"Note status code: 404 Not Found
Route parameters are part of the URL path: /students/:studentIdUse req.params to access route parametersRoute parameters vs Query parameters:Route: /students/101 (part of path)Query: /students?id=101 (after ?)Status code 404 indicates "Not Found"Route parameters are better for identifying specific resources
Looks in the public folder for filesAutomatically serves index.html when you request the root path /Maps URLs to files in that folder
Method: POSTURL: http://localhost:3003/feedbackGo to "Body" tabSelect "x-www-form-urlencoded"Add key-value pairs:name = John Doeemail = john@example.comrating = 5comment = Great course!Click "Send"Note status code: 201 CreatedMethod: GETURL: http://localhost:3003/feedbackClick "Send"See your submitted feedback in the responseSubmit 2-3 more feedback entriesThen GET /feedback to see all entries
POST sends data in the request body (hidden from URL)POST mutates data (adds to feedbackList array)Status code 201 means "Created"Use req.body to access POST dataNeed middleware: express.urlencoded() for form dataData is NOT visible in browser address barPOST is not idempotent (submitting twice creates two entries)
Share
Explore
10 graduated exercises that teach students how to use Postman with Express route endpoints
Postman is a web application development tool for testing API URLs (URIs) and scripting integrations, valuable for developers, students, and testers.
Installing Postman is straightforward and enables fast API inspection, validation, and debugging.
Installing Postman Today
Postman URI Test Purposes
Common Use Cases in Education and Development
Postman is essential for anyone working with APIs, offering both manual URI testing and automated validation in collaborative, repeatable workflows.
Add to follow-upCheck sources
Lab Learning Path:
Each Lab Includes:
✅ Complete Express.js code - ready to copy/paste into VS Code
✅ HTML pages with working forms - visual interface for testing
✅ Step-by-step Postman instructions - how to test each endpoint
✅ Multiple test scenarios - success and error cases
✅ Clear explanations - what you're learning and why
✅ Expected responses - know what to look for
Special Features:
Each exercise is completely self-contained and can run independently on different ports.
Students can follow along sequentially or jump to specific concepts they need to practice.
MADS 4012 - Postman & Express Route Endpoints
10 Graduated Lab Exercises
Getting Started: Download and Install Postman
Before beginning these exercises, you need to install Postman:
Exercise 1: Basic GET Request (No Parameters)
Concept: Understanding the simplest possible GET endpoint
Step 1: Create the Express Application
Create a folder lab01-basic-get and create server.js:
const express = require('express');
const app = express();
const PORT = 3000;
// Basic GET endpoint
app.get('/welcome', (req, res) => {
res.json({
message: 'Welcome to MADS 4012!',
course: 'Full Stack Development',
timestamp: new Date()
});
});
app.listen(PORT, () => {
console.log(`Lab 1 server running on http://localhost:${PORT}`);
});
Step 2: Run the Server
cd lab01-basic-get
npm init -y
npm install express
node server.js
Step 3: Test with Postman
Expected Response
{
"message": "Welcome to MADS 4012!",
"course": "Full Stack Development",
"timestamp": "2024-10-02T14:30:00.000Z"
}
What You Learned
Save Your Request
Exercise 2: GET with Query Parameters
Concept: Passing data through URL query strings (form data in GET requests)
Note the use of express static middleware to serve up static content.
This is also how you get images to serve up
Step 1: Create the Application
Create folder lab02-query-params and create server.js:
const express = require('express');
const app = express();
const PORT = 3001;
app.use(express.static('public'));
// GET endpoint with query parameters
app.get('/greet', (req, res) => {
const firstName = req.query.firstName || 'Guest';
const lastName = req.query.lastName || '';
const age = req.query.age;
res.json({
greeting: `Hello, ${firstName} ${lastName}!`,
message: age ? `You are ${age} years old.` : 'Age not provided',
receivedParams: req.query
});
});
app.listen(PORT, () => {
console.log(`Lab 2 server running on http://localhost:${PORT}`);
});
Step 2: Create the HTML Form
Create folder public and create public/index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Lab 2 - Query Parameters</title>
<style>
body { font-family: Arial; max-width: 500px; margin: 50px auto; padding: 20px; }
input, button { display: block; width: 100%; margin: 10px 0; padding: 10px; }
button { background: #007bff; color: white; border: none; cursor: pointer; }
</style>
</head>
<body>
<h1>Greeting Form (GET Method)</h1>
<form action="/greet" method="GET">
<input type="text" name="firstName" placeholder="First Name" required>
<input type="text" name="lastName" placeholder="Last Name">
<input type="number" name="age" placeholder="Age">
<button type="submit">Submit with GET</button>
</form>
<p><strong>Notice:</strong> After submitting, look at the URL in your browser!</p>
</body>
</html>
Step 3: Test with Postman
Test 1: No Parameters
Test 2: With Parameters
Test 3: Using Params Tab (Cleaner way!)
What You Learned
Browser Test
Exercise 3: GET with Route Parameters
Concept: URL parameters as part of the path (not query string)
Step 1: Create the Application
Create folder lab03-route-params and create server.js:
const express = require('express');
const app = express();
const PORT = 3002;
app.use(express.static('public'));
// Sample data
const students = {
101: { id: 101, name: 'Alice Johnson', major: 'Computer Science', gpa: 3.8 },
102: { id: 102, name: 'Bob Smith', major: 'Information Systems', gpa: 3.5 },
103: { id: 103, name: 'Carol White', major: 'Data Science', gpa: 3.9 }
};
// Route parameter endpoint
app.get('/students/:studentId', (req, res) => {
const studentId = req.params.studentId;
const student = students[studentId];
if (student) {
res.json({
success: true,
data: student
});
} else {
res.status(404).json({
success: false,
message: `Student with ID ${studentId} not found`
});
}
});
// Get all students
app.get('/students', (req, res) => {
res.json({
success: true,
count: Object.keys(students).length,
data: Object.values(students)
});
});
app.listen(PORT, () => {
console.log(`Lab 3 server running on http://localhost:${PORT}`);
});
Step 2: Create the HTML Page
Create public/index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Lab 3 - Route Parameters</title>
<style>
body { font-family: Arial; max-width: 600px; margin: 50px auto; padding: 20px; }
.button { display: inline-block; padding: 10px 20px; margin: 5px;
background: #28a745; color: white; text-decoration: none; border-radius: 5px; }
</style>
</head>
<body>
<h1>Student Directory</h1>
<p>Click a student ID to view their details:</p>
<a href="/students/101" class="button">Student 101</a>
<a href="/students/102" class="button">Student 102</a>
<a href="/students/103" class="button">Student 103</a>
<a href="/students/999" class="button">Student 999 (Not Found)</a>
<br><br>
<a href="/students" class="button" style="background: #007bff;">View All Students</a>
</body>
</html>
Step 3: Test with Postman
Test 1: Get All Students
Test 2: Get Specific Student (Success)
Test 3: Get Non-Existent Student (Error)
What You Learned
Exercise 4: Simple POST with Form Data
Up to now it was /GET - good for reading data, but cannot WRITE or SEND data back to change the data on the server.
Concept: Sending data with POST method (data in body, not URL)
Step 1: Create the Application
Create folder lab04-post-form and create server.js:
const express = require('express');
const app = express();
const PORT = 3003;
app.use(express.static('public'));
app.use(express.urlencoded({ extended: true })); // Parse form data
app.use(express.json()); // Parse JSON data
let feedbackList = []; // In-memory storage
// POST endpoint
app.post('/feedback', (req, res) => {
const { name, email, rating, comment } = req.body;
const feedback = {
id: feedbackList.length + 1,
name,
email,
rating: parseInt(rating),
comment,
submittedAt: new Date()
};
feedbackList.push(feedback); // MUTATION: Adding to array
res.status(201).json({
success: true,
message: 'Feedback submitted successfully!',
data: feedback
});
});
// GET endpoint to view all feedback
app.get('/feedback', (req, res) => {
res.json({
success: true,
count: feedbackList.length,
data: feedbackList
});
});
app.listen(PORT, () => {
console.log(`Lab 4 server running on http://localhost:${PORT}`);
});
Step 2: Create the HTML Form
Create public/index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Lab 4 - POST with Form</title>
<style>
body { font-family: Arial; max-width: 500px; margin: 50px auto; padding: 20px; }
input, textarea, select, button {
display: block; width: 100%; margin: 10px 0; padding: 10px;
}
button { background: #dc3545; color: white; border: none; cursor: pointer; }
.note { background: #fff3cd; padding: 10px; border-left: 4px solid #ffc107; }
</style>
</head>
<body>
<h1>Course Feedback (POST Method)</h1>
<div class="note">
<strong>Notice:</strong> This form uses POST. After submitting, the URL will NOT show the data!
</div>
<form action="/feedback" method="POST">
<input type="text" name="name" placeholder="Your Name" required>
<input type="email" name="email" placeholder="Your Email" required>
<select name="rating" required>
<option value="">Select Rating</option>
<option value="5">5 - Excellent</option>
<option value="4">4 - Good</option>
<option value="3">3 - Average</option>
<option value="2">2 - Poor</option>
<option value="1">1 - Very Poor</option>
</select>
<textarea name="comment" placeholder="Your Comments" rows="4" required></textarea>
<button type="submit">Submit Feedback (POST)</button>
</form>
<p><a href="/feedback">View All Feedback (GET)</a></p>
</body>
</html>
Interest not:
When I go to localhost:3003/ I get the feedback page, but the code has not api route for / - how is that page being created ?
Excellent observation! You've discovered how static file serving works! 🎯
The "Magic" Line:
app.use(express.static('public'));
This single line of middleware does A LOT of work behind the scenes!
What express.static('public') Does:
When you visit http://localhost:3003/, Express:
How It Works:
Your URL Request → File Served
────────────────────────────────────────────────────
http://localhost:3003/ → public/index.html ← Automatic!
http://localhost:3003/style.css → public/style.css
http://localhost:3003/app.js → public/app.js
http://localhost:3003/logo.png → public/logo.png
File Structure:
lab04-post-form/
├── server.js ← Your Express server
├── public/ ← Static files folder
│ └── index.html ← This is served at /
└── package.json
Special Behavior: index.html
When Express sees a request for a directory (like /), it automatically looks for index.html in that directory. This is a web server convention dating back decades!
// These are equivalent:
localhost:3003/ → public/index.html
localhost:3003/index.html → public/index.html
Behind the Scenes:
// When you do this:
app.use(express.static('public'));
// Express essentially creates these routes automatically:
app.get('/', (req, res) => {
res.sendFile('public/index.html'); // Automatic!
});
app.get('/style.css', (req, res) => {
res.sendFile('public/style.css');
});
// And so on for every file in public/
Why This Is Useful:
Without express.static(), you'd have to manually create routes for every file:
// ❌ WITHOUT express.static - tedious!
app.get('/', (req, res) => {
res.sendFile(__dirname + '/public/index.html');
});
app.get('/style.css', (req, res) => {
res.sendFile(__dirname + '/public/style.css');
});
app.get('/logo.png', (req, res) => {
res.sendFile(__dirname + '/public/logo.png');
});
// ✅ WITH express.static - one line!
app.use(express.static('public'));
Complete Request Flow:
1. Browser requests: http://localhost:3003/
↓
2. Express checks: "Do I have a route for GET /"?
↓
3. No explicit route found, check middleware
↓
4. express.static middleware intercepts
↓
5. Looks for: public/index.html
↓
6. File exists? → Serve it!
↓
7. Browser receives HTML and renders the form
Order Matters!
Notice the middleware is declared before your routes:
app.use(express.static('public')); // ← First
app.use(express.urlencoded({ extended: true }));
app.use(express.json());
app.post('/feedback', ...); // ← Then routes
app.get('/feedback', ...);
If you put express.static() after your routes, it still works, but it's better practice to put middleware first so Express checks for static files before evaluating route handlers.
Key Takeaway:
express.static('public') automatically serves all files from the public folder and treats index.html as the default file for directory requests. This means localhost:3003/ automatically serves public/index.html without needing an explicit app.get('/') route!
This is standard practice in Express apps for serving HTML, CSS, JavaScript, images, and other static assets! 🚀
Step 3: Test with Postman
Test 1: Submit Feedback (POST)
Test 2: View All Feedback (GET)
Test 3: Submit Multiple Feedbacks
What You Learned
Compare GET vs POST
Open browser and submit the form - notice the URL doesn't show your data!
Exercise 5: POST with JSON Body
Concept: Sending structured JSON data via POST (modern API approach)
Step 1: Create the Application
Create folder lab05-post-json and create server.js:
const express = require('express');
const app = express();
const PORT = 3004;
app.use(express.static('public'));
app.use(express.json()); // Parse JSON bodies
Want to print your doc?
This is not the way.
This is not the way.
Try clicking the ··· in the right corner or using a keyboard shortcut (
CtrlP
) instead.