本节来讲一下，如何创造第一个页面 并且打通链路，让自己和同事可以正常访问:

    上节课我们最后创建了一个叫myapp的应用，虽然它在项目下，但是并没有被安装，不安装的话我们后续很多操作都无法进行。安装很简单，打开我们的settings.py，给myapp 写到这里即可。

    首先我们在这个新创建的myapp里，手动创建一个文件夹，叫：templates

    注意 必须叫这个名字这里。

这个文件夹是用来干嘛的呢？它是用来创建和存放我们的 html模版文件的，也就是xxx.html， 一个网页，其实就是 html模版+静态资源+数据 形成的。

然后我们在手动创建一个文件夹叫static 来存放静态资源：必须叫这个名哦

现在我们来看这个图，它标记出来了 组成页面的三个部分 都分别在哪里：

好我们现在在templates上新建一个html文件，起个名字叫home， 作为我们平台的首页。

我们在这个home.html模版里 随便写一个标题，标题的标签 dom 是 h1

输入方法是 输入h1 直接按tab键，就可以自动变成 

后面的个/ 代表标签收尾。建议大家先自学或看看本公众号的接口测试平台的前几章，熟悉一下html的写法和构成。

那么作为以后的使用者，他要怎么才能进入到这个home首页呢？当然是在浏览器里输入一个url地址进入。

那么为什么url地址 就可以 让浏览器展示这个home首页呢？

链路其实分为三大部分 ：

url -> 视图逻辑层/事物层/数据层-> html模版 

简单来说就是，用户输入url地址后，我们在urls.py中写好对照关系，让这个url关联到后台的一个函数，这个函数我们就暂时写在views.py中，然后这个函数去拿一些数据还有对应的html模版给 浏览器，浏览器又发现这个html模版需要一些静态资源比如图片之类的，就去static文件夹拿出来，最终组合成页面显示给用户。

所以我们的写法很简答，我们现在已经有了这个home.html，它并不需要任何静态资源，所以我们赶紧去views.py写好对应的那个函数，函数名字随意。

如上图，我取名和html模版一致，这样一眼就看出来它是干嘛的了。

它现在也不需要去数据库拿什么数据，就简简单单的返回home.html页面就好，新人写的时候注意格式，引号 等符号。

现在我们还差url和函数的对照关系映射设置。所以我们进入那个urls.py文件：

打开它后，先给它导入我们myapp下views.py内的所有函数，虽然现在只有一个home函数

这里可能有些小伙伴用的是django 3.x 所以和我这个2.2的会不一样，默认用的是path函数。其实按照那个自带的admin/ 这条的写法，照葫芦画瓢即可。

我这里会用俩种方法都展示下，他们实际作用都一样。

函数需要俩个参数，一个是url，一个是views里的具体函数名。

url方法：

仿照admin/ 添加了一样格式的新映射关系。我这里叫的也一样的名字home。这样 函数，url，html模版，都叫home, 就不会乱了。之后我们几百个页面的话，打眼也可以看得出来，当然你可以叫别的。url的第一个参数 是一个正则表达，其中home/是必须写，r'' 代表原始字符串，^代表正则表达式中匹配字符串起始。

path方法：

之后本教程会只是用url方法哦。小伙伴认真记住这个事，不要之后总问了～

现在url.py 三者都创建好并写好了关联。我们要重启服务，然后在浏览器输入：

127.0.0.1:8000/home  看看能不能进去：

可以看到成功进去了。现在你可以让你的同事 用在一个网段下的其他电脑或手机 输入你电脑ip:8000/home 来进入这个页面了。

比如我的ip是 192.168.43.15,那么 大家输入 192.168.43.15:8000/home 就可以进入了。

 到这就算是我们第一个简单的页面成功实现并打通和部署了。

下节预告：安装vue并在home页面简单使用。

本文使用 文章同步助手 同步