论坛首页 Web前端技术论坛

Node.js和Geddy初学者指南 - 第二部分

浏览 2725 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2012-03-30  

 

Node.js和Geddy初学者指南 - 第二部分 by gbin1.com

在这个包含3个部分的教程中,我们将帮助大家从头了解Node.jsGeddy,并且开发一个to-do list的管理程序。我们将介绍如何安装Node.js到windows和OS X,及其Geddy,并且生成我们第一个应用。这篇文章是这个系列的第二部分。

概述

快速回忆一下,上一篇文章中我们安装了Node和Geddy,生成了一个新的应用,并且学习了如何启动服务器。在这篇教程中,我们将基于上次的内容,所以先确认你已经阅读上了上一篇教程。

生成Todo资源

Geddy 拥有一个内建的资源生成器。这个生成器允许我们自动生成Model,Controller和View及其指定资源的Route。我们的todo list只使用一个资源:todo。为了生成这个资源,我们先进入我们应用目录:(cd path/to/your/todo-app),并且运行:

geddy resource todo

你将能看到如下:

  • app/models/todo.js
  • app/controllers/todos.js
  • app/views/todos/
    • index.html.ejs
    • show.html.ejs
    • edit.html.ejs
    • add.html.ejs

你的config/rounter.js应该添加了下面这行:

router.resource('todos');

究竟执行了什么?

如果你不熟悉MVC的话,可能这里有些困难。不过不要担心,你会发现其实很简单。

models/todo.js:这个文件我们用来定义todo model。我们定义了一些所有model都有的属性。我们同时也书写一些数据验证代码。

controller/todo.js: 这个文件是所有的/todo指向的文件,每一个行为都在这个控制器中对应一个route:

GET      /todos/            => index
POST     /todos/            => create
GET      /todos/:id         => show
PUT      /todos/:id         => update
DELETE   /todos/:id         => remove
GET      /todos/:id/add     => add
GET      /todos/:id/edit    => edit

view/todos/:每一个文件对应上面一个GET route。这些就是我们用来生成前端应用的模板。Geddy使用EJS(Embedded Javascript)作为模板语言。如果使用过PHP或者ERB,你会非常熟悉。基本上你可以使用任何javascript来开发模板。

体验Route的使用

现在我们生成了一堆代码,让我们先验证我们得到了所有需要的Route。启动应用,指向http://localhost:4040/todos。你可以看到如下界面:

试试以下的Get route:

  • http://localhost:4000/todos/something
  • http://localhost:4000/todos/add
  • http://localhost:4000/todos/something/edit

是不是很不错?

创建Todo Model

在Geddy(或者其它框架)中,你使用models来定义你的应用使用的数据类型。你只需要为todo生成Model。如下:

var Todo = function () {
  // Some commented out code
};
 
// Some more commented out code
 
Todo = geddy.model.register('Todo', Todo); 

Model在Geddy中非常简答。我们只创建了一个新的构建函数,并且在geddy中登记为一个model。接下来我们定义一些属性。删除所有的注释代码并且添加如下到构建函数中:

var Todo = function () {
  this.defineProperties({
    title: {type: 'string', required: true}
  , id: {type: 'string', required: true}
  , status: {type: 'string', required: true}
  });
};

原文来源:Node.js和Geddy初学者指南 - 第二部分

论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics