1 模板引擎的使用
1.1 下载模板
首先安装art-template模板，art-template不仅可以在浏览器使用，也可以在node中使用
安装，在哪个目录执行以下命令就会下载到那里去，默认下载到node_modules目录中，注意node_modules尽量不要更改，不支持更改
npm install art-template
npm install=npm i。在git clone项目的时候，项目文件中并没有 node_modules文件夹，项目的依赖文件可
能很大。直接执行，npm会根据package.json配置文件中的依赖配置下载安装。
-global=-g，全局安装，安装后的包位于系统预设目录下
--save=-S，安装的包将写入package.json里面的dependencies，dependencies：生产环境需要依赖的库
--save-dev=-D，安装的包将写入packege.json里面的devDependencies，devdependencies：只有开发环境下
需要依赖的库1.2 在浏览器中使用
在浏览器中是使用node_modules/lib/template-web.js文件，把脚本类型声明为模板类型，防止浏览器安装JavaScript脚本方法来解析
注意：模板引擎不关心字符串内容，只关心自己能认识的模板标记语法，例如 {{}}， {{}} 语法被称之为mustache语法，即八字胡语法
${}是estl语法，{{ $value }}是模板语法
<script type="text/template" id="tp1">
hello {{ name}}
我喜欢：{{each hobbies}} {{ $value }} {{/each}}
</script>
<script>
<!-- template()中第一个参数是模板id,第二个参数是对象 -->
var ret = template('tpl', {
name: 'Jack',
hobbies: [
'写代码',
'唱歌',
'打游戏'
]
})
console.log(ret)
</script>1.3 node中使用模板引擎
先安装npm install art-template ,在需要使用的地方使用require( ) 方法加载art-template,就可以了，require中的参数名字是npm install 后面的名字，${}是estl语法，{{ $value }}是模板语法
var template = require("art-template");
var ret = template.render("hello {{name }} ，我的爱好是{{each hobbies}} {{ $value }}{{/each}}",{
name :"jack",
hobbies:[
"看电影",
"唱歌"
]
})template.render()方法第一个是要替换的字符串，第二个是参数
2 服务端和客户端渲染
- 客户端渲染：第一次请求服务器拿到页面，第二次请求拿到数据
- 服务端渲染：一次请求就完成了全部页面+数据
服务端渲染后就是最终的结果，可能会加大服务器压力，但是客户端渲染的话，即使没有数据，也可以先加载出来一部分，不至于全部空白，另外，客户端渲染不利于SEO搜索引擎优化，服务端渲染是可以被爬虫抓取到的，客户端异步渲染是很难被爬虫抓取到，所以一般的网站是两者结合的
3 统一处理静态资源
为了让目录结构保持统一清晰，所以约定，把所有的 HTML 文件都放到 views（视图） 目录中，为了方便的统一处理这些静态资源，所以约定把所有的静态资源都存放在 public 目录中，哪些资源能被用户访问，哪些资源不能被用户访问，现在可以通过代码来进行非常灵活的控制
浏览器收到 HTML 响应内容之后，就要开始从上到下依次解析，当在解析的过程中，如果发现：
- link
- script
- img
- iframe
- video
- audio
浏览器会自动对这些资源发起新的请求。
注意：在服务端中，文件中的路径就不要去写相对路径了。因为这个时候所有的资源都是通过 url 标识来获取的，假如服务器开放了 /public/ 目录，所以这里的请求路径都写成：/public/xxx，正斜杠 / 在这里就是 url 根路径的意思。浏览器在真正发请求的时候会最终把 http://127.0.0.1:3000 拼上
