黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

1.2 案例初始化

1. 建立项目所需文件夹

public 静态资源

model 数据库操作

route 路由

views 模板

2. 初始化项目描述文件

       npm init -y

3. 下载项目所需第三方模块

npm install express mongoose art-template express-art-template

4. 创建网站服务器

5. 构建模块化路由

6.  构建博客管理页面模板

 

 

 

1. 建立项目所需文件夹

    1. public 静态资源
    2. model 数据库操作
    3. route 路由
    4. views 模板

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

2. 初始化项目描述文件   npm init -y

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

3. 下载项目所需第三方模块

npm install express mongoose art-template express-art-template

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

4. 创建网站服务器

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

 

5. 构建模块化路由

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

6.  构建博客管理页面模板

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

开放静态资源

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

 

把相应的html文件剪切到views中

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

Html后缀全部改成art

小技巧:

bat批量修改文件后缀

@echo off

for /r %%a in (*.html) do ren "%%a" "%%~na.art"

 

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

模板文件中,外联资源添加绝对路径

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

优化模板(抽离公共部分)

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

用模板替换原代码头部和侧边栏

 

 

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

模板的骨架文件

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

填坑

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

其它页面也同样删除骨架代码,使用骨架模板

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

黑马博客——详细步骤(一)路由跳转和抽取公共部分代码

 

 

上一篇:模板引擎 -- art-template


下一篇:linux下的定时或计时操作(gettimeofday等的用法,秒,微妙,纳秒(转载)