TypeScript【1】实战项目:订餐系统开发
随着互联网技术的飞速发展,订餐系统已经成为人们日常生活中不可或缺的一部分。本文将围绕TypeScript语言,详细讲解如何开发一个订餐系统。TypeScript作为一种JavaScript的超集,提供了静态类型检查【2】、接口【3】、类等特性,使得代码更加健壮和易于维护。以下是使用TypeScript开发订餐系统的详细步骤和技术要点。
项目概述
订餐系统主要包括以下功能模块:
1. 用户模块【4】:用户注册、登录、个人信息管理。
2. 菜品模块【5】:菜品展示、菜品分类、菜品搜索。
3. 订单模块【6】:下单、订单查询、订单支付。
4. 后台管理模块【7】:菜品管理、订单管理、用户管理。
技术栈
- TypeScript:用于编写静态类型化的JavaScript代码。
- Node.js【8】:作为服务器端运行环境。
- Express【9】:一个快速、灵活的Web应用框架。
- MongoDB【10】:一个高性能、可扩展【11】的文档型数据库【12】。
- Mongoose【13】:一个MongoDB的对象建模工具【14】。
开发环境搭建
1. 安装Node.js和npm(Node.js包管理器)。
2. 创建一个新的TypeScript项目:
bash
tsc --init
3. 安装必要的依赖:
bash
npm install express mongoose body-parser cors
用户模块
用户实体【15】
定义用户实体(User【16】):
typescript
import mongoose, { Document } from 'mongoose';
interface IUser extends Document {
username: string;
password: string;
email: string;
}
const UserSchema = new mongoose.Schema({
username: { type: String, required: true },
password: { type: String, required: true },
email: { type: String, required: true },
});
export default mongoose.model('User', UserSchema);
用户注册
创建一个注册接口:
typescript
import express, { Request, Response } from 'express';
import User from './user.model';
const router = express.Router();
router.post('/register', async (req: Request, res: Response) => {
try {
const { username, password, email } = req.body;
const user = new User({ username, password, email });
await user.save();
res.status(201).send('User registered successfully');
} catch (error) {
res.status(500).send(error.message);
}
});
export default router;
用户登录
创建一个登录接口:
typescript
import express, { Request, Response } from 'express';
import User from './user.model';
const router = express.Router();
router.post('/login', async (req: Request, res: Response) => {
try {
const { username, password } = req.body;
const user = await User.findOne({ username, password });
if (user) {
res.status(200).send('Login successful');
} else {
res.status(401).send('Invalid credentials');
}
} catch (error) {
res.status(500).send(error.message);
}
});
export default router;
菜品模块
菜品实体【17】
定义菜品实体(Dish):
typescript
import mongoose, { Document } from 'mongoose';
interface IDish extends Document {
name: string;
category: string;
price: number;
description: string;
}
const DishSchema = new mongoose.Schema({
name: { type: String, required: true },
category: { type: String, required: true },
price: { type: Number, required: true },
description: { type: String, required: true },
});
export default mongoose.model('Dish', DishSchema);
菜品展示
创建一个菜品展示接口:
typescript
import express, { Request, Response } from 'express';
import Dish from './dish.model';
const router = express.Router();
router.get('/', async (req: Request, res: Response) => {
try {
const dishes = await Dish.find();
res.status(200).send(dishes);
} catch (error) {
res.status(500).send(error.message);
}
});
export default router;
订单模块
订单实体【18】
定义订单实体(Order):
typescript
import mongoose, { Document } from 'mongoose';
interface IOrder extends Document {
userId: mongoose.Types.ObjectId;
dishes: { dishId: mongoose.Types.ObjectId; quantity: number }[];
total: number;
status: string;
}
const OrderSchema = new mongoose.Schema({
userId: { type: mongoose.Types.ObjectId, required: true },
dishes: [
{
dishId: { type: mongoose.Types.ObjectId, required: true },
quantity: { type: Number, required: true },
},
],
total: { type: Number, required: true },
status: { type: String, required: true },
});
export default mongoose.model('Order', OrderSchema);
下单
创建一个下单接口:
typescript
import express, { Request, Response } from 'express';
import Order from './order.model';
const router = express.Router();
router.post('/', async (req: Request, res: Response) => {
try {
const { userId, dishes } = req.body;
const total = dishes.reduce((acc, dish) => acc + dish.quantity dish.price, 0);
const order = new Order({ userId, dishes, total, status: 'pending' });
await order.save();
res.status(201).send('Order placed successfully');
} catch (error) {
res.status(500).send(error.message);
}
});
export default router;
后台管理模块
菜品管理
创建一个菜品管理接口:
typescript
import express, { Request, Response } from 'express';
import Dish from './dish.model';
const router = express.Router();
router.get('/', async (req: Request, res: Response) => {
try {
const dishes = await Dish.find();
res.status(200).send(dishes);
} catch (error) {
res.status(500).send(error.message);
}
});
router.post('/', async (req: Request, res: Response) => {
try {
const { name, category, price, description } = req.body;
const dish = new Dish({ name, category, price, description });
await dish.save();
res.status(201).send('Dish added successfully');
} catch (error) {
res.status(500).send(error.message);
}
});
router.delete('/:id', async (req: Request, res: Response) => {
try {
const { id } = req.params;
await Dish.findByIdAndDelete(id);
res.status(200).send('Dish deleted successfully');
} catch (error) {
res.status(500).send(error.message);
}
});
export default router;
订单管理
创建一个订单管理接口:
typescript
import express, { Request, Response } from 'express';
import Order from './order.model';
const router = express.Router();
router.get('/', async (req: Request, res: Response) => {
try {
const orders = await Order.find();
res.status(200).send(orders);
} catch (error) {
res.status(500).send(error.message);
}
});
router.put('/:id', async (req: Request, res: Response) => {
try {
const { id } = req.params;
const { status } = req.body;
await Order.findByIdAndUpdate(id, { status });
res.status(200).send('Order status updated successfully');
} catch (error) {
res.status(500).send(error.message);
}
});
export default router;
用户管理
创建一个用户管理接口:
typescript
import express, { Request, Response } from 'express';
import User from './user.model';
const router = express.Router();
router.get('/', async (req: Request, res: Response) => {
try {
const users = await User.find();
res.status(200).send(users);
} catch (error) {
res.status(500).send(error.message);
}
});
router.delete('/:id', async (req: Request, res: Response) => {
try {
const { id } = req.params;
await User.findByIdAndDelete(id);
res.status(200).send('User deleted successfully');
} catch (error) {
res.status(500).send(error.message);
}
});
export default router;
总结
本文详细介绍了使用TypeScript开发订餐系统的过程,包括用户模块、菜品模块、订单模块和后台管理模块。通过使用TypeScript的静态类型检查、接口和类等特性,我们能够编写更加健壮和易于维护的代码。在实际开发过程中,可以根据需求对系统进行扩展和优化【19】。希望本文对您有所帮助。
Comments NOTHING