BAB 3: Express.js Framework
3.1 Pengenalan Express.js
3.1.1 Apa itu Express.js?
Express.js adalah web framework yang minimalis dan fleksibel untuk Node.js. Framework ini menyediakan berbagai fitur untuk membangun aplikasi web dan API.
3.1.2 Instalasi Express.js
Copy # Membuat project baru
mkdir express-app
cd express-app
npm init -y
# Install Express
npm install express
# Install dependencies umum
npm install cors dotenv morgan 3.1.3 Aplikasi Express Dasar
Copy // app.js
const express = require('express');
const cors = require('cors');
const morgan = require('morgan');
require('dotenv').config();
const app = express();
// Middleware
app.use(cors());
app.use(morgan('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: true }));
// Route dasar
app.get('/', (req, res) => {
res.json({ message: 'Welcome to Express API' });
});
// Start server
const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
console.log(`Server running on port ${PORT}`);
}); 3.2 Routing
3.2.1 Basic Routing
Copy // routes/index.js
const express = require('express');
const router = express.Router();
// GET method
router.get('/', (req, res) => {
res.json({ message: 'GET request' });
});
// POST method
router.post('/', (req, res) => {
res.json({ message: 'POST request' });
});
// PUT method
router.put('/:id', (req, res) => {
res.json({ message: `PUT request for id ${req.params.id}` });
});
// DELETE method
router.delete('/:id', (req, res) => {
res.json({ message: `DELETE request for id ${req.params.id}` });
});
module.exports = router; 3.2.2 Route Parameters
Copy // routes/users.js
const router = express.Router();
// Route dengan parameter
router.get('/users/:id', (req, res) => {
const { id } = req.params;
res.json({ userId: id });
});
// Multiple parameters
router.get('/users/:userId/posts/:postId', (req, res) => {
const { userId, postId } = req.params;
res.json({ userId, postId });
});
// Optional parameters
router.get('/products/:category?', (req, res) => {
const { category } = req.params;
res.json({ category: category || 'all' });
}); 3.2.3 Query Strings
Copy // routes/products.js
router.get('/search', (req, res) => {
const { q, limit = 10, page = 1 } = req.query;
res.json({
search: q,
limit: parseInt(limit),
page: parseInt(page)
});
}); 3.3 Middleware
3.3.1 Built-in Middleware
Copy // app.js
const express = require('express');
const app = express();
// JSON parsing middleware
app.use(express.json());
// URL-encoded parsing middleware
app.use(express.urlencoded({ extended: true }));
// Static files middleware
app.use(express.static('public')); 3.3.2 Custom Middleware
Copy // middleware/logger.js
const logger = (req, res, next) => {
console.log(`${req.method} ${req.path} - ${new Date().toISOString()}`);
next();
};
// middleware/auth.js
const auth = (req, res, next) => {
const token = req.headers.authorization;
if (!token) {
return res.status(401).json({ message: 'No token provided' });
}
// Verify token logic here
next();
};
// Menggunakan middleware
app.use(logger);
app.use('/api', auth); 3.3.3 Error Handling Middleware
Copy // middleware/error.js
const errorHandler = (err, req, res, next) => {
console.error(err.stack);
const status = err.status || 500;
const message = err.message || 'Something went wrong!';
res.status(status).json({
status: 'error',
message
});
};
// Custom error class
class AppError extends Error {
constructor(message, status) {
super(message);
this.status = status;
}
}
// Menggunakan error handler
app.use(errorHandler); 3.4 Request & Response
3.4.1 Request Object
Copy router.post('/example', (req, res) => {
// Request body
console.log(req.body);
// URL parameters
console.log(req.params);
// Query string
console.log(req.query);
// Headers
console.log(req.headers);
// Cookies
console.log(req.cookies);
// Files (dengan multer)
console.log(req.file);
}); 3.4.2 Response Object
Copy router.get('/examples', (req, res) => {
// Send JSON response
res.json({ message: 'Success' });
// Send status
res.sendStatus(200);
// Send status with data
res.status(201).json({ message: 'Created' });
// Send file
res.sendFile('/path/to/file.pdf');
// Redirect
res.redirect('/new-path');
// Set cookie
res.cookie('token', 'value', { httpOnly: true });
// Clear cookie
res.clearCookie('token');
}); 3.5 File Upload
3.5.1 Setup Multer
Copy const multer = require('multer');
// Konfigurasi storage
const storage = multer.diskStorage({
destination: (req, file, cb) => {
cb(null, 'uploads/');
},
filename: (req, file, cb) => {
const uniqueSuffix = Date.now() + '-' + Math.round(Math.random() * 1E9);
cb(null, file.fieldname + '-' + uniqueSuffix + path.extname(file.originalname));
}
});
// Filter file
const fileFilter = (req, file, cb) => {
if (file.mimetype.startsWith('image/')) {
cb(null, true);
} else {
cb(new Error('Not an image!'), false);
}
};
const upload = multer({
storage: storage,
fileFilter: fileFilter,
limits: {
fileSize: 1024 * 1024 * 5 // 5MB
}
}); 3.5.2 Implementasi Upload
Copy // Single file upload
router.post('/upload', upload.single('image'), (req, res) => {
if (!req.file) {
return res.status(400).json({ message: 'Please upload a file' });
}
res.json({
message: 'File uploaded successfully',
file: req.file
});
});
// Multiple files upload
router.post('/upload-many', upload.array('images', 5), (req, res) => {
if (!req.files.length) {
return res.status(400).json({ message: 'Please upload files' });
}
res.json({
message: 'Files uploaded successfully',
files: req.files
});
}); 3.6 Template Engines
3.6.1 Setup EJS
Copy const express = require('express');
const app = express();
// Set view engine
app.set('view engine', 'ejs');
app.set('views', './views');
// Route dengan template
app.get('/page', (req, res) => {
res.render('index', {
title: 'My Page',
message: 'Welcome to Express'
});
}); 3.6.2 Contoh Template EJS
Copy <!-- views/index.ejs -->
<!DOCTYPE html>
<html>
<head>
<title><%= title %></title>
</head>
<body>
<h1><%= message %></h1>
<% if (user) { %>
<p>Welcome, <%= user.name %></p>
<% } %>
<ul>
<% items.forEach(function(item) { %>
<li><%= item.name %></li>
<% }); %>
</ul>
</body>
</html> Latihan
Buat REST API sederhana dengan Express
Implementasi sistem file upload
Buat custom middleware untuk logging dan authentication
Implementasi error handling
Buat halaman dengan template engine
Review
Express.js menyediakan framework yang fleksibel untuk Node.js
Routing memungkinkan penanganan berbagai HTTP request
Middleware adalah kunci untuk memproses request
Error handling yang baik penting untuk reliability
Template engine memungkinkan rendering dynamic HTML