今天我们将通过 WindSurf 框架，从零开始构建一个功能完备的博客网站。无论你是编程新手还是有一定经验的开发者，这篇教程都将以清晰的步骤引导你完成整个项目。最终，你将能够独立使用 WindSurf 开发属于自己的 Web 应用程序。
目录
项目介绍
我们将构建一个简单的博客网站，支持用户注册、登录以及文章的创建、查看、编辑和删除功能。项目将涵盖 WindSurf 的核心功能，包括路由、中间件、模板引擎和数据库集成等。
环境准备
在开始之前，请确保你的开发环境已经配置好：
- Node.js：从 Node.js 官网 下载并安装。
- npm：Node.js 自带 npm，用于安装依赖包。
- 代码编辑器：推荐使用 Visual Studio Code。
安装完成后，打开终端并运行以下命令，确保 Node.js 和 npm 已经正确安装：
bash
node -v
npm -v
创建 WindSurf 项目
首先，创建一个新的项目目录，并在该目录下初始化一个 Node.js 项目：
bash
mkdir my-blog
cd my-blog
npm init -y
接下来，安装 WindSurf 和一些必要的依赖：
bash
npm install windsurf express ejs mongoose bcrypt express-session
项目结构
我们的项目结构如下：
my-blog/
├── public/
│ └── css/
│ └── style.css
├── views/
│ ├── home.ejs
│ ├── register.ejs
│ ├── login.ejs
│ ├── create-post.ejs
│ └── edit-post.ejs
├── models/
│ ├── User.js
│ └── Post.js
└── app.js
构建博客首页
配置 WindSurf
首先，在 app.js 中配置 WindSurf：
javascript
const express = require(‘express’);
const app = express();
app.set(‘view engine’, ‘ejs’);
app.use(express.static(‘public’));
// 配置路由
app.get(‘/’, (req, res) => {
res.render(‘home’);
});
app.listen(3000, () => {
console.log(‘Server is running on http://localhost:3000’);
});
启动服务器
在终端中运行以下命令启动服务器：
bash
node app.js
打开浏览器，访问 http://localhost:3000，你将看到博客的首页。
用户注册与登录
配置会话
在 app.js 中配置会话管理：
javascript
const session = require(‘express-session’);
app.use(session({
secret: ‘my_secret_key’,
resave: false,
saveUninitialized: true
}));
创建用户模型
在 models 目录下创建 User.js 文件：
javascript
const mongoose = require(‘mongoose’);
const userSchema = new mongoose.Schema({
username: String,
password: String
});
module.exports = mongoose.model(‘User’, userSchema);
用户注册
添加注册功能，通过表单提交用户信息并存储到数据库。
用户登录
实现用户登录功能，验证用户名和密码。
创建博客文章
创建文章模型
在 models 目录下创建 Post.js 文件：
javascript
const mongoose = require(‘mongoose’);
const postSchema = new mongoose.Schema({
title: String,
content: String,
author: String
});
module.exports = mongoose.model(‘Post’, postSchema);
创建文章模板
在 views 目录下创建 create-post.ejs 文件：
html
Create Post
查看博客文章
显示所有文章
在 app.js 中添加显示所有文章的路由：
javascript
app.get(‘/posts’, async (req, res) => {
const posts = await Post.find();
res.render(‘home’, { posts });
});
编辑与删除博客文章
编辑文章
实现文章编辑功能，允许用户修改已发布的文章。
删除文章
在 app.js 中添加删除文章的路由：
javascript
app.post(‘/delete-post/:id’, async (req, res) => {
await Post.findByIdAndDelete(req.params.id);
res.redirect(‘/posts’);
});
部署项目
使用 PM2 部署
安装 pm2 并启动应用：
bash
npm install pm2 -g
pm2 start app.js
部署到 Heroku
如果你有 Heroku 账号，可以将项目部署到 Heroku。首先，安装 Heroku CLI 并登录：
bash
heroku login
创建 Heroku 应用并推送代码：
bash
heroku create
git push heroku main
最后总结
通过本教程，你已经成功使用 WindSurf 构建了一个完整的博客网站。你学习了如何创建路由、处理表单、管理会话、集成数据库等核心技能。希望这篇教程对你有所帮助，祝你未来的开发之旅一帆风顺！
