从零开始用 Node.js 实现一个微博系统,功能包括路由控制、页面模板、数据库访问、用户注册、登录、用户会话等内容。

  • Express 框架、
  • MVC 设计模式、
  • ejs 模板引擎
  • MongoDB 数据库

MVC(Model-View-Controller,模型视图控制器)是一种软件的设计模式

  • 模型是对象及其数据结构的实现,通常包含数据库操作。
  • 视图表示用户界面,在网站中通常就是 HTML 的组织结构。
  • 控制器用于处理用户请求和数据流、复杂模型,将输出传递给视图

一.Express 框架 (http://expressjs.com/)

  • 1.路由控制;
  • 2.模板解析支持;
  • 3.动态视图;
  • 4.用户会话;
  • 5.CSRF 保护;
  • 6.静态文件服务;
  • 7.错误控制器;
  • 8.访问日志;
  • 9.缓存;
  • 10.插件支持。

1.全局安装 Express

$ npm install -g express

2.最新express4.0版本中将命令工具分家出来了(项目地址:https://github.com/expressjs/generator),所以我们还需要安装一个命令工具,命令如下:

$ npm install -g express-generator

3.查看版本

$ express --version

二.建立工程

1.在NodeJS指南中利用以下命令建立网站的基本结构:

$ express -e microblog

(模板引擎是jade) 执行命令后ejs模板引擎就安装好了
但是express3以上的版本把layout默认给取消了,所以现在在views文件夹下并没有生成layout.ejs。然后改成include引入

2.运行完这个命令,继续运行,然后进入microblog文件夹,安装npm

$ cd microblog && npm install

3.include引入方法

如头部views/layoutTop.ejs

<!DOCTYPE html>
<html>
<head>
<title><%= title %></title>
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<link rel='stylesheet' href='/stylesheets/reset.css' />
<link rel='stylesheet' href='/stylesheets/main.css' />
<link rel="stylesheet" href="/stylesheets/bootstrap.css">
<style type="text/css">
body {
padding-top: 60px;
padding-bottom: 40px;
}
</style>
<link href="/stylesheets/bootstrap-responsive.css" rel="stylesheet">
</head>
<body>
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="/">Microblog</a>
<div class="nav-collapse">
<ul class="nav">
<li class="active"><a href="/">首页</a></li>
<% if (!user) { %>
<li><a href="/login">登入</a></li>
<li><a href="/reg">注册</a></li>
<% } else { %>
<li><a href="/logout">登出</a></li>
<% } %>
</ul>
</div>
</div>
</div>
</div>

底部views/layoutBottom.ejs

</body>
<script src="/javascripts/jquery-1.9.1.min.js"></script>
<script src="/javascripts/bootstrap.js"></script>
</html>

在views/index.ejs页面中include引用入公共部分

<% include layoutTop %>
<p>首页</p>
<% include layoutBottom %>

4.执行完express -e microblog 命令后, 项目生成,当前目录下出现了子目录 microblog,并且产生了一些文件:

create : microblog
create : microblog/package.json
create : microblog/app.js
create : microblog/routes
create : microblog/routes/index.js
create : microblog/routes/users.js
create : microblog/public
create : microblog/views
create : microblog/views/index.jade
create : microblog/views/layout.jade
create : microblog/views/error.jade
create : microblog/bin
create : microblog/bin/www
create : microblog/public/javascripts
create : microblog/public/images
create : microblog/public/stylesheets
create : microblog/public/stylesheets/style.css

5.用 Express 实现的网站实际上就是一个 Node.js 程序,因此可以直接运行。我们运行 node app.js, 看到 Express server listening on port 3000 in development mode。

输入地址 http://localhost:3000, 你就可以看到一个简单的 Welcome to Express 页面了。

6.开发时使用supervisor监听刷新修改

$ supervisor bin/www

7.退出监听:

ctrl + c

  

Express 框架的安装的更多相关文章

  1. Node.js Express 框架

    Node.js Express 框架 Express 简介 Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用,和丰富的 HTTP ...

  2. node.js之express框架

    之前学习过node.js接触过express框架,最近为了编写一个mock server正好用到了express.下面正好就跟大家介绍一下关于express.今天的内容主要围绕这么几个方面? expr ...

  3. express框架以及配置项

    以上命令会将 Express 框架安装在当前目录的 node_modules 目录中, node_modules 目录下会自动创建 express 目录.以下几个重要的模块是需要与 express 框 ...

  4. nodejs基础 -- express框架

    Node.js Express 框架 Express 简介 Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用,和丰富的 HTTP ...

  5. Node.js:Express 框架

    Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用,和丰富的 HTTP 工具.使用 Express 可以快速地搭建一个完整功能的网站 ...

  6. Vue nodejs商城项目-搭建express框架环境

    1.express-project 搭建express框架环境 安装express generator生成器 通过生成器自动创建项目 配置分析 安装 cnpm i -g express-generat ...

  7. Node.js Express 框架 Express

    Express 简介 Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用,和丰富的 HTTP 工具. 使用 Express 可以快速 ...

  8. 44.Node.js Express 框架--web框架

    转自:http://www.runoob.com/nodejs/nodejs-express-framework.html Express 简介 Express 是一个简洁而灵活的 node.js W ...

  9. Win8.1 安装Express 框架

    1.安装Windows Node.js客户端 2.安装Express框架 我本机是Win8.1的,使用命令npm install -g express安装Express,安装完成后显示一些安装明细,刚 ...

随机推荐

  1. MySQL 源代码scr.rpm安装的一点注意事项

    rpm安装包通常为二进制包(Binary)以及源代码包(Source)两种形式. 在使用源代码方式安装MySQL的时候,官方站点上下载的源代码包通常为scr.rpm格式,而不是直接的tar包.对此,须 ...

  2. 图片上传裁剪(asp.net)

    图片在线裁剪功能 前台展现用jquery.Jcrop实现,后台使用 System.Drawing.Image类来进行裁剪 完整dome下载 http://download.csdn.net/detai ...

  3. WPF教程一:基础

    一.WPF简介WPF:WPF即Windows Presentation Foundation,翻译为中文“Windows呈现基础”,是微软推出的基于Windows Vista的用户界面框架,属于.NE ...

  4. seo 基础

    标题用<h2>标题</h2>  iamge  中加上 alt=“”   的属性 这样有利用百度的搜索引擎爬虫搜索到

  5. 关于Cocos2d-x对象的定义和创建

    游戏可以包含很多个场景,每个场景又包含很多的层,每个层又包含很多的节点,这些节点,层,场景都可以看成一个一个的对象,我们把每一个彼此不同但又是同类型的对象归为一个类,为它创建一个单独的类,这个类有这些 ...

  6. ubuntu配置apache和cgi

    ubuntu配置apache和cgi . 更新源并进行安装,否则后面的下载可能会不成功. sudo apt-get update sudo apt-get upgrade . 安装apache2服务 ...

  7. ibus拼音安装_ubuntu10.04

    ubuntu10.04自带的拼音输入发太难用,所以从新安装ibus拼音. sudo apt-get install ibus ibus-pinyin ibus-qt4 ibus-gtk 然后运行 ib ...

  8. vector 排序

    #include <vector> #include <algorithm> 一.vector保存的是基础数据类型(int.char.float等) vector<int ...

  9. win7语音识别开发(sapi)

    参考:http://msdn.microsoft.com/en-us/library/ee125663(v=vs.85).aspx    (sapi5.4 reference) http://msdn ...

  10. VMWare -- 工作模式

    VMWare提供三种工作模式桥接(bridge).NAT(网络地址转换)和host-only(主机模式). 桥接模式 在桥接模式下,VMWare虚拟出来的操作系统就像是局域网中的一台独立的主机(主机和 ...