正文

新手必看：轻松掌握Node.js Express MVC框架搭建全攻略

/0 浏览量
0709

在Web开发领域，Node.js以其高性能和轻量级的特点受到了广泛关注。而Express框架作为Node.js的常用Web应用框架，更是简化了Web开发的流程。本文将带你轻松掌握Node.js Express MVC框架的搭建，让你快速入门。

一、环境准备

在开始之前，请确保你的电脑上已安装以下软件：

  1. Node.js：Node.js是一个基于Chrome V8引擎的JavaScript运行环境，用于执行JavaScript代码。你可以从Node.js官网下载并安装。
  2. npm：npm是Node.js的包管理器，用于安装和管理Node.js项目中的依赖包。安装Node.js时，npm会自动安装。

二、创建项目

  1. 打开命令行工具，进入你想要创建项目的目录。
  2. 运行以下命令创建一个新的Node.js项目：
mkdir my-express-app
cd my-express-app
npm init -y
  1. 在项目目录下，创建一个名为app.js的文件，这是Express应用的入口文件。

三、安装Express框架

  1. 在命令行中，运行以下命令安装Express框架：
npm install express
  1. 这将在项目目录下创建一个node_modules文件夹，其中包含了Express框架的代码。

四、搭建MVC结构

MVC（Model-View-Controller）是一种常用的软件设计模式，它将应用程序分为三个部分：模型（Model）、视图（View）和控制器（Controller）。

  1. 模型（Model）：负责处理应用程序的数据逻辑，如数据库操作。
  2. 视图（View）：负责展示数据，如HTML页面。
  3. 控制器（Controller）：负责处理用户请求，并调用模型和视图。

1. 创建模型

在项目目录下，创建一个名为models的文件夹，并在其中创建一个名为user.js的文件，用于定义用户模型：

// models/user.js
const mongoose = require('mongoose');

const UserSchema = new mongoose.Schema({
  name: String,
  age: Number
});

module.exports = mongoose.model('User', UserSchema);

2. 创建视图

在项目目录下，创建一个名为views的文件夹，并在其中创建一个名为index.ejs的文件，用于定义首页的HTML结构：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Express MVC</title>
</head>
<body>
  <h1>Welcome to Express MVC</h1>
</body>
</html>

3. 创建控制器

在项目目录下，创建一个名为controllers的文件夹，并在其中创建一个名为indexController.js的文件，用于处理首页的请求：

// controllers/indexController.js
const express = require('express');
const router = express.Router();

router.get('/', (req, res) => {
  res.render('index');
});

module.exports = router;

4. 配置路由

在app.js文件中，引入控制器并配置路由：

// app.js
const express = require('express');
const mongoose = require('mongoose');
const indexController = require('./controllers/indexController');

const app = express();

// 连接数据库
mongoose.connect('mongodb://localhost:27017/my-express-app', {
  useNewUrlParser: true,
  useUnifiedTopology: true
});

// 设置模板引擎
app.set('view engine', 'ejs');

// 使用控制器
app.use('/', indexController);

// 监听端口
app.listen(3000, () => {
  console.log('Server is running on port 3000');
});

五、启动项目

  1. 在命令行中，运行以下命令启动项目：
node app.js
  1. 打开浏览器，访问http://localhost:3000，你应该能看到首页的显示。

六、总结

通过以上步骤，你已经成功搭建了一个基于Node.js Express MVC框架的简单Web应用。希望本文能帮助你快速入门，并在后续的开发过程中不断积累经验。祝你学习愉快！

-- 展开阅读全文 --