美文网首页
node express web开发框架

node express web开发框架

作者: 幺加幺 | 来源:发表于2017-03-07 19:55 被阅读40次

    1、web开发框架express

    以ejs模版方式创建

    express ejs ejsItem
    //ejsItem  你的项目名字
    
    
    Paste_Image.png

    切换到你的项目目录,执行install

    cd ejsItem
    
    
    
    Paste_Image.png

    执行安装依赖的模块

    npm install
    
    Paste_Image.png

    安装中:

    Paste_Image.png

    完成结果:

    Paste_Image.png

    执行运行服务器

    node app.js
    
    

    发现启动不了

    Paste_Image.png

    原因是express 里面的app.js 移除了默认的监听的端口,为了给开发者可以自己更多的自定义。
    解决办法在app.js文件最后添加对于端口的监听。

    //注意看这句有没有
    // module.exports = app;
    app.set('port', 3000);//监听3000端口
    app.listen(app.get('port'), function () {
        console.log('Express server listening on port ' + app.get('port'));
    });
    
    

    Paste_Image.png

    再次启动,访问即可。

    2、supervisor 启动项目

    为了方便调试安装服务器代码安装supervisor,通过supervisor来启动项目,实现实时更新服务器代码的变化。

    npm  install supervisor -g
    

    启动:

    supervisor  app.js
    
    Paste_Image.png
    Paste_Image.png

    3、默认路由简单分析

    打开app.js文件

    //引入路由控制器
    var index = require('./routes/index');
    var users = require('./routes/users');
    var can = require('./routes/can');//这就是我加的
    
    ....
    
    //使用相关的视图模版
    app.use('/', index);
    app.use('/users', users);
    app.use('/can', can);//这句是我加的
    
    

    路由控制对照

    Paste_Image.png

    视图对照

    Paste_Image.png

    index路由(或者说控制器)代码分析:

    var express = require('express');
    var router = express.Router();
    
    /* GET home page. */
    router.get('/', function(req, res, next) {
    //指定使用那个视图模版
      res.render('index', { title: '首页' });
    });
    
    module.exports = router;
    
    

    users.js路由(或者说控制器)代码分析:

    var express = require('express');
    var router = express.Router();
    
    /* GET users listing. */
    router.get('/', function(req, res, next) {
    //直接返回一段文本。
      res.send('respond with a resource');
    });
    
    module.exports = router;
    
    

    新添加的路由以及视图can.js 和 can.ejs
    app.js的配置

    var can = require('./routes/can');
    
    app.use('/can', can);
    
    Paste_Image.png

    访问结果:

    Paste_Image.png

    现在对文章有了解了嘛,可以简单分为下面步骤:
    1.新建控制器,也就是can.js
    2.新建视图模版,也就是can.ejs
    3.在入口引入控制器
    这样你就可以通过访问不同的地址显示不同的页面了。
    例如你可以建立home,about 等等,一系列下来,你网站页面大体不就完成了嘛,剩下的就往坑里面塞数据吧。

    相关文章

      网友评论

          本文标题:node express web开发框架

          本文链接:https://www.haomeiwen.com/subject/qvfvgttx.html