小明：嘿，小华，我们最近需要构建一个宿舍信息管理系统，你有什么好的建议吗？
小华：当然有啦！首先我们需要设计一个数据库来存储宿舍的相关信息。比如每个宿舍的编号、床位数量、入住学生信息等。
小明：听起来不错，那我们应该怎么设计这个数据库呢？
小华：我们可以使用MySQL数据库。例如创建一个名为"dormitory"的数据库，并在其中创建一个表"students"来存储学生信息：
CREATE DATABASE dormitory;
USE dormitory;
CREATE TABLE students (id INT AUTO_INCREMENT PRIMARY KEY, name VARCHAR(255), gender ENUM('Male', 'Female'), room_number INT);
小明：好的，接下来我们怎么处理数据的增删改查操作呢？
小华：我们可以使用Node.js和Express框架来构建后端API。例如，添加一个新的学生记录：
const express = require('express');
const app = express();
app.use(express.json());
app.post('/add-student', (req, res) => {
const { name, gender, room_number } = req.body;
// 连接数据库并执行SQL语句
// 示例代码省略
});
小明：最后一步就是前端界面了，我们应该怎么做呢？
小华：我们可以使用React来构建前端界面。例如，创建一个简单的表单来输入学生信息：
import React, { useState } from 'react';
function AddStudentForm() {
const [name, setName] = useState('');
const [gender, setGender] = useState('Male');
const [roomNumber, setRoomNumber] = useState(0);
const handleSubmit = async (e) => {
e.preventDefault();
await fetch('/add-student', { method: 'POST', body: JSON.stringify({ name, gender, room_number }) });
}
return (
<form onSubmit={handleSubmit}>
<input type="text" value={name} onChange={(e) => setName(e.target.value)} />
<select value={gender} onChange={(e) => setGender(e.target.value)}>
<option value="Male">Male</option>
<option value="Female">Female</option>
</select>
<input type="number" value={roomNumber} onChange={(e) => setRoomNumber(e.target.value)} />
<button type="submit">Submit</button>
</form>
);
}