用nodejs做网站 - 4

512 查看

开头

惊了,jade改名了,我才知道。

https://github.com/pugjs/pug

This project was formerly known as "Jade." However, it has been revealed to us that "Jade" is a registered trademark, and as a result a rename is needed. After some discussion among the maintainers, "Pug" has been chosen as the new name for this project. The next major version will carry "pug" as the package name.

接着写

启动脚本

开始前我们先写一个小脚本。

"scripts": {
  "dev": "mysql.server start & nodemon index.js"
},

之后我们只要运行下面的命令,就可以了。开启mysql和启动程序。

npm run dev

模板引擎

模板引擎我们用pug(原jade),因为我只熟悉这个,而且官方推荐的引擎不会差到哪里去。

➜ sudo npm i --save pug

将index.js修改如下。

// 引入模块
var express = require('express');

// 创建一个实例
var app = express();

// 设置页面文件夹
app.set('views', './views');

// 设置引擎
app.set('view engine', 'pug');

// 设置根目录返回的内容
app.get('/', function (req, res) {
  res.render('index');
});

// 监听3000端口
var server = app.listen(3000, function () {
  console.log('服务器正在运行...');
});

将index.html更名为index.pug。修改里面的内容。

doctype html
html(lang='zh')
  head
    meta(charset='UTF-8')
    title 首页
  body
    h1 Hi, limichange!

你可以用这两个工具把html快速的转换为pug格式。

现在我们的网页里的内容都是写死的,接下来我们将用动态的方式把内容传进去。做如下的修改。

// index.js

// 设置根目录返回的内容
app.get('/', function (req, res) {
  res.render('index', {
    title: '首页',
    message: 'Hi, limichange!'
  });
});
// index.pug

doctype html
html(lang='zh')
  head
    meta(charset='UTF-8')
    title= title
  body
    h1= message

ok,这样我们就使用了模板引擎动态的生成了一个页面。

➜ tree -aI 'node_modules|.git'
.
├── .gitignore
├── LICENSE
├── index.js
├── package.json
└── views
    └── index.pug

配置文件

我简单说下开发的流程。我们一共需要有三个环境,分别为开发环境、测试环境和正式环境。

  • 开发环境(development)就是我们运行在本机调试的时候所运行的环境,只对自己有影响。

  • 测试环境(testing)就是运行在服务器上,但是只有内部人员(开发人员、测试人员等)能看到。

  • 正式环境(production)就是运行在服务器上,已经用于正式的生产了,正式上线了。

这当中有许多的差异。比如说,我们在本地调试的时候,端口是8080端口,而测试环境和正式环境则是80。数据库也是不一样的,每个环境都有自己各自的数据库,这个一定不能混淆。

为了根据不同的环境做动态的切换,我们需要写一个配置文件,将不同的地方定义出来。

# 创建文件
➜ touch config.js

里面的内容如下,包含了http和mysql的设置。

var config;

config = {
  production: {
    url: 'http://url.com',
    database: {
      client: 'mysql',
      connection: {
        host     : '127.0.0.1',
        user     : 'root',
        password : '',
        database : 'website',
        charset  : 'utf8'
      }
    },
    server: {
      host: '0.0.0.0',
      port: '80'
    }
  },
  development: {
    url: 'http://localhost:8090',
    database: {
      client: 'mysql',
      connection: {
        host     : '127.0.0.1',
        user     : 'root',
        password : '',
        database : 'website',
        charset  : 'utf8'
      }
    },
    server: {
      host: '127.0.0.1',
      port: '3000'
    }
  },
  'testing': {
    url: 'http://127.0.0.1:2369',
    database: {
      client: 'mysql',
      connection: {
        host     : '127.0.0.1',
        user     : 'root',
        password : '',
        database : 'ghost_testing',
        charset  : 'utf8'
      }
    },
    server: {
      host: '127.0.0.1',
      port: '8080'
    }
  }
};

module.exports = config;

现在让我们把这个配置到index.js。

// index.js

var config = require('./config')[process.env.NODE_ENV || 'development'];

var host = config.server.host;
var port = config.server.port;

// 监听3000端口
var server = app.listen(port, host, function () {
  console.log(`http://${host}:${port}`);
});

这样我们就将绑定的地址和端口动态设定了。之后我们将写一写数据库的代码。