简介
compound 是一款基于 Node.js 平台的 web 框架,它使用了许多优秀的 Node.js 模块与技术,例如 Express、EJS、CoffeeScript、Less 等,封装出了易于使用和扩展的框架。
在前端开发中,compound 作为一种 Node.js 的 web 框架,可以非常方便地实现 MVC 模式,并且它还提供了一些常用的功能,例如路由、表单验证、缓存等。本篇文章将介绍如何使用 compound 开发一个基本的 web 应用,并涉及一些常用的功能。
安装 compound
在使用 compound 前,需要先安装它。在命令行中输入以下命令:
npm install -g compound
在官方文档中,还提供了另一种安装方式:compound boilerplate。通过该项目可以快速创建一个基于 compound 的 web 应用模板。
git clone git://github.com/1602/compound-boilerplate.git myapp cd myapp npm install node server
创建一个 web 应用
在安装 compound 并创建一个模板后,我们可以开始创建一个 web 应用了。在命令行中输入以下命令:
compound init myapp
myapp 表示创建的应用名。该命令会在当前目录下创建一个名为 myapp 的文件夹,该文件夹包含了一个 compound 基本应用模板。
运行应用
创建好应用后,我们可以运行应用了。在命令行中输入以下命令:
cd myapp node server
在浏览器中打开 http://localhost:3000/,你将看到一个简单的欢迎页面。
创建控制器和视图
为了创建一个完整的 web 应用,我们需要创建控制器和视图来将页面渲染出来。在命令行中输入以下命令:
cd myapp compound generate controller home
home 表示控制器名,该命令会在控制器文件夹 /app/controllers/
下创建一个名为 home_controller.js 的文件。
现在我们需要创建一个视图并使用 home 控制器来渲染它。在命令行中输入以下命令:
cd myapp compound generate view home/index
index 表示视图名,该命令会在视图文件夹 /app/views/home/
下创建一个名为 index.ejs 的文件。
打开 home_controller.js 文件,在 index 方法中添加以下代码:
res.render('home/index');
这告诉 express 渲染 home/index.ejs
文件。
打开 index.ejs
文件,并添加以下代码:
<h1>Welcome to myapp</h1>
这是一个非常简单的视图,只有一个标题。
现在我们需要添加路由来指定应用从哪里开始,以及路径和控制器。打开 config/routes.js
文件,添加以下代码:
map.root('home#index');
这代码告诉 compound 当应用从根目录 /
开始运行时,直接调用 home 控制器中的 index 方法。
最后,运行应用并在浏览器中打开 http://localhost:3000/,你将看到一个简单的欢迎页面。
添加模型
为了将数据存储在数据库中,我们需要添加模型。在命令行中输入以下命令:
cd myapp compound generate model person email:string name:string
这条命令将在 /app/models/
目录下创建一个 person.js
文件。在 person.js
中,你可以看到 compound 已自动为你添加了 email 和 name 两个字段,它们的类型为 string。
接下来,我们需要创建一个迁移文件来创建表。在命令行中输入以下命令:
cd myapp compound migration create_persons_table
这会创建一个名为 create_persons_table.js
的迁移文件。打开该文件并在 change
方法中添加以下代码:
this.createTable('persons', function (t) { t.string('email'); t.string('name'); });
这将创建一个名为 persons
的表,并为其添加 email 和 name 两个字段,类型均为 string。
现在我们需要运行该迁移文件。在命令行中输入以下命令:
cd myapp compound migrate up
这会将该迁移文件运行并将 persons
表创建在数据库中。
接下来,我们需要在控制器中添加代码,从数据库中取出数据并在视图中展示。以下是一些基本的 CRUD 操作:
-- -------------------- ---- ------- -- -- --- ------ - --- -------- ------ ------------------- ----- ------ --- -------------------- ------- - -- ------- - ------------------- - --- -- -- ------------- ------ ------------------ -- -------- ------- ------- - -- ------- - ------------------- - -------------------- --- -- -- ------------- ------ ------------------ -- -------- ------- ------- - -- ------- - ------------------- - --- ------ - ---------- ----------- - ---- ------ -------------------- ------- - -- ------- - ------------------- - --- --- -- -- ------------- ------ ------------------ -- -------- ------- ------- - -- ------- - ------------------- - --- ------ - ---------- ----------------------- ------- - -- ------- - ------------------- - --- ---
现在我们已经学习了如何使用 compound 创建一个 web 应用,并添加了模型,接下来可以根据需要进一步扩展应用。
总结
通过本篇文章的学习,你已经了解了如何使用 compound 创建一个基本的 web 应用,并添加了模型。虽然我们只涵盖了一些基础知识,但是掌握了这些内容,相信你可以在实际项目中快速上手并开发出功能完整的 web 应用。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/77932