首页 >web前端 >js教程 >如何构建和构建节点。JSMVC应用程序

如何构建和构建节点。JSMVC应用程序

Lisa Kudrow
Lisa Kudrow原创
2025-02-10 10:32:17684浏览

How to Build and Structure a Node.js MVC Application

构建复杂的应用程序时,架构设计与代码质量同等重要。即使代码编写精良,但缺乏良好的组织结构,随着复杂性的增加,维护和扩展将变得异常困难。因此,最佳实践是在项目启动前就规划好架构,以项目目标为指导,做出明智的选择。

与Ruby on Rails等框架不同,Node.js 并没有一个事实上的标准框架来强制执行特定的架构和代码组织方式。这使得构建完整的Node.js Web应用程序时,架构选择变得相对自由,但也增加了挑战。

本教程将使用MVC架构构建一个基本的笔记应用程序,演示如何利用Node.js的Hapi.js框架、SQLite数据库(通过Sequelize.js进行操作)以及Pug模板引擎来实现高效开发。

核心要点:

  • 使用MVC (模型-视图-控制器) 架构有效组织Node.js应用程序,提升可维护性和可扩展性。
  • 使用npm初始化项目,创建package.json文件来管理依赖项。
  • 使用Hapi.js框架构建服务器,使用SQLite数据库和Sequelize.js管理数据。
  • 定义Node.js路由,明确应用程序的功能,确保每个路由都与正确的HTTP方法和处理程序关联。
  • 使用Sequelize.js定义模型,确保数据完整性并提供抽象层。
  • 实现控制器处理业务逻辑,连接模型和视图,获取数据并决定输出格式。
  • 使用Pug模板引擎创建视图,使HTTP响应更易读和结构化。
  • 使用Hapi.js的Inert插件提供静态文件服务,高效管理CSS和JavaScript文件。

什么是MVC?

模型-视图-控制器 (MVC) 可能是最流行的应用程序架构之一。MVC模式最初在PARC为Smalltalk语言设计,用于解决图形用户界面应用程序的组织问题。虽然最初用于桌面应用程序,但其理念已成功应用于Web开发。

简单来说,MVC架构包含:

  • 模型 (Model): 处理数据库或任何数据相关功能的部分。
  • 视图 (View): 用户看到的一切——发送给客户端的页面。
  • 控制器 (Controller): 网站的逻辑,以及模型和视图之间的桥梁。控制器调用模型获取数据,然后将数据传递给视图,最终发送给用户。

本应用程序将允许创建、查看、编辑和删除纯文本笔记。虽然功能简单,但坚实的架构将使日后添加新功能变得容易。

本教程假设您已在机器上安装了最新版本的Node.js。如果没有,请参考相关教程进行安装。

最终应用程序代码已上传至GitHub仓库,您可以查看完整的项目结构。

奠定基础

构建任何Node.js应用程序的第一步是创建package.json文件,其中包含所有依赖项和脚本。可以使用npm的init命令自动生成此文件:

<code class="language-bash">mkdir notes-board
cd notes-board
npm init -y</code>

完成后,您将拥有一个可用的package.json文件。

注意:如果您不熟悉这些命令,请查看我们的npm入门指南。

接下来,安装Hapi.js框架:

<code class="language-bash">npm install @hapi/hapi@18.4.0</code>

此命令将下载Hapi.js并将其添加到package.json文件中的依赖项中。

注意:我们指定了Hapi.js的v18.4.0版本,因为它与Node 8、10和12版本兼容。如果您使用的是Node 12,可以选择安装最新版本(Hapi v19.1.0)。

现在,创建入口文件——启动所有内容的Web服务器。在应用程序目录中创建一个server.js文件,并添加以下代码:

<code class="language-javascript">"use strict";

const Hapi = require("@hapi/hapi");
const Settings = require("./settings");

const init = async () => {
  const server = new Hapi.Server({ port: Settings.port });

  server.route({
    method: "GET",
    path: "/",
    handler: (request, h) => {
      return "Hello, world!";
    }
  });

  await server.start();
  console.log(`Server running at: ${server.info.uri}`);
};

process.on("unhandledRejection", err => {
  console.log(err);
  process.exit(1);
});

init();</code>

这是应用程序的基础。首先,我们使用严格模式;然后,我们引入依赖项并实例化一个新的服务器对象,将连接端口设置为3000(端口可以是1023到65535之间的任何数字);我们的第一个路由将作为测试,所以“Hello, world!” 消息就足够了;最后,我们使用server.start()方法启动服务器。

存储设置

最佳实践是将配置变量存储在专用文件中。此文件导出一个包含数据的JSON对象,其中每个键都分配自环境变量,但不要忘记备用值。

在这个文件中,我们还可以根据环境(例如开发或生产)拥有不同的设置。例如,我们可以为开发目的使用SQLite的内存实例,但在生产环境中使用真实的SQLite数据库文件。

根据当前环境选择设置非常简单。由于我们还在文件中有一个env变量,它将包含development或production,我们可以执行以下操作来获取数据库设置:

<code class="language-javascript">const dbSettings = Settings[Settings.env].db;</code>

因此,当env变量为development时,dbSettings将包含内存数据库的设置;当env变量为production时,将包含数据库文件的路径。

此外,我们可以添加对.env文件的支持,在其中可以为开发目的存储本地环境变量。这可以通过像dotenv这样的Node.js包来实现,它将读取项目根目录下的.env文件,并将找到的值自动添加到环境中。

注意:如果您决定也使用.env文件,请确保使用npm install dotenv安装该包,并将其添加到.gitignore中,以免发布任何敏感信息。

我们的settings.js文件如下所示:

<code class="language-javascript">// This will load our .env file and add the values to process.env,
// IMPORTANT: Omit this line if you don't want to use this functionality
require("dotenv").config({ silent: true });

module.exports = {
  port: process.env.PORT || 3000,
  env: process.env.NODE_ENV || "development",

  // Environment-dependent settings
  development: {
    db: {
      dialect: "sqlite",
      storage: ":memory:"
    }
  },
  production: {
    db: {
      dialect: "sqlite",
      storage: "db/database.sqlite"
    }
  }
};</code>

现在,我们可以通过执行以下命令并在Web浏览器中导航到http://localhost:3000来启动应用程序:

<code class="language-bash">mkdir notes-board
cd notes-board
npm init -y</code>

注意:此项目在Node v12.15.0上进行了测试。如果您遇到任何错误,请确保您已安装更新的版本。

(后续步骤,由于篇幅限制,以下内容将简略概括,具体实现细节请参考原文)

定义路由:lib/routes.js文件中定义应用程序的路由,包括GET、POST、PUT和DELETE方法处理笔记的创建、读取、更新和删除。

构建模型: 使用Sequelize.js和SQLite创建Note模型,定义笔记的数据结构(日期、标题、内容等)。在lib/models/note.js中定义模型。

构建控制器: 创建控制器来处理路由请求。lib/controllers/home.js处理首页,lib/controllers/note.js处理笔记相关的CRUD操作。

构建视图: 使用Pug模板引擎创建视图。lib/views/home.pug显示笔记列表,lib/views/note.pug显示单个笔记详情。lib/views/components/note.pug定义笔记组件。

服务静态文件: 使用Hapi.js的Inert插件服务静态文件(JavaScript和CSS)。在server.js中注册Inert插件,并在routes.js中添加静态文件路由。

客户端JavaScript: 编写客户端JavaScript代码来处理模态窗口的显示/隐藏,以及使用Ajax提交表单。

总结

本教程构建了一个基本的基于Hapi.js和MVC架构的笔记应用程序。虽然还有许多细节需要完善(例如输入验证、错误处理等),但这提供了一个学习和构建Node.js应用程序的基础。 您可以在此基础上添加用户认证、更复杂的UI等功能。

以上是如何构建和构建节点。JSMVC应用程序的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn