关于这个项目

这是一个使用 Next.js 构建的演示项目，展示了以下核心功能：

✨ 主要特性

• App Router - 使用 Next.js 14 的最新路由系统
• API Routes - 内置的 API 路由功能，处理 GET 和 POST 请求
• 客户端组件 - 使用 'use client' 指令实现交互功能
• 服务器组件 - 默认使用服务器组件提升性能
• TypeScript - 完整的类型支持
• CSS 模块化 - 全局样式与组件样式分离

📁 项目结构

my-nextjs-demo/
├── app/
│   ├── about/
│   │   └── page.tsx      # 关于页面
│   ├── api/
│   │   └── messages/
│   │       └── route.ts  # 留言板 API
│   ├── components/
│   │   └── MessageBoard.tsx  # 留言板组件
│   ├── globals.css       # 全局样式
│   ├── layout.tsx        # 根布局
│   └── page.tsx          # 首页
├── public/               # 静态资源
├── package.json
├── tsconfig.json
└── next.config.js

🚀 技术栈

• Next.js 14.2.5
• React 18.3.1
• TypeScript 5.5.4
• Node.js 18+ 环境

📝 功能说明

• 留言板 - 用户可以发布留言，所有留言会实时显示
• API 接口 - GET /api/messages 获取所有留言，POST /api/messages 添加新留言
• 响应式设计 - 适配不同屏幕尺寸
• 错误处理 - 完善的加载状态和错误提示

🔧 运行命令

# 安装依赖
npm install

# 开发模式运行
npm run dev

# 构建生产版本
npm run build

# 启动生产服务器
npm start