在上一篇博文中,提到了HttpReponse,可是HttpReponse只能传送字符串,若是要构建一个网页,那么工做量就会十分巨大。模板是一种方便的标签,存在于HTML文件中,咱们能够经过模板的语法格式,动态接收服务器发送的数据,再由模板进行渲染。javascript
既然咱们要使用模板,那么咱们就要有个目录来存放模板。并且为了咱们的程序可以搜索到模板,还要对模板目录进行配置。
(1)在咱们的项目目录下新建一个templates文件夹
(2)在templates下新建rango文件夹(注:rango是个人项目中的一个应用)
(3)打开settings.py配置咱们的模板信息
方法一:css
TEMPLATE_DIRS=(<workspace>/<projectname>)
虽然咱们可使用绝对路径,可是当咱们的项目要运行再其余人的机器上时,workspace的名称可能不同,这样咱们就须要使用动态的路径来表示。url和path这种东西,在咱们的开发中切忌写“死”了
方法二:(推荐)
在咱们的settings.py中有一个名为BASE_DIR的变量,它表示文件所在目录的上级目录,也就是咱们的templates文件夹所在目录。
因此咱们新建一个变量TEMPLATE_PATH=os.path.join(BASE_DIR,'templates')
ps:os.path.join这个函数会将路径相结合,获得的就是BASE_DIR/templates
好了,如今咱们的html
TEMPLATE_DIRS=(TEMPLATE_PATH)
万事俱备,就等咱们添加一个模板了。这个模板的位置天然就在templates/rango中,新建一个index.html前端
<!DOCTYPE html> <html> <head> <title>Rango</title> <h1>rango says</h1> hello<strong>{{USERNAME}}</strong>! <a href="/rango/about">About</a> </head> <body> </body> </html>
这段html代码表示咱们对一个user,say hellojava
目前,咱们的views.py文件中,index函数还不能映射到这个index.html文件。因此要对其进行修改python
from django.shortcuts import render
引入render(渲染)
新建一个字典变量nginx
context_dict = {'username': "Liao"} return render(request,'rango/index.html',context_dict)
运行django
python manage.py runserver
就能够看到咱们的浏览器
helloLiao!
前端开发,html,css,js缺一不可。咱们虽然可以使用模板开始渲染了,可是尚未使用到css来给网页添加样式,也没有图片,因此获得的只是一个粗糙简单的页面
(1)在咱们的项目中新建static文件夹,在static中再新建images文件夹
(2)同上面,咱们为了让程序搜索到static文件夹,仍然须要在settings.py文件中配置相关变量服务器
STATIC_PATH = os.path.join(BASE_DIR,'static') STATICFILES_DIRS=(STATIC_PATH)
(3)让咱们在images文件夹里面悄悄地放一张图片,而后运行程序,
访问
http://127.0.0.1:8000/static/images/
image-name是咱们的图片名称,切记要带后缀
不出意外,咱们将会在浏览器上看到这幅图片,若是出错,通常会报404 not found
仔细检查django的配置文件拼写便可。
为了使用静态文件,咱们须要再模板首行加上这么一句话
{% load staticfiles %}
为了显示咱们的图片
<img src="{% static "image/test1.jpg" %}" alt='test picture' />
当中使用到了static,表示咱们引用的是一个静态文件。
同理,当咱们要使用js,css等外部静态文件时,也可使用static,提供路径便可。
今天学习了模板和静态文件
1.模板
(1)在咱们的templates文件夹中新建所需的模板,而且在settings.py文件中配置
TEMPLATE_PATH=os.path.join(BASE_DIR,'tmeplates') TEMPLATE_DIRS=(TEMPALTE_PATH,)
(2)在应用的views.py文件中新建视图函数,在视图函数中建立一个字典,在字典中存放咱们要传入到模板中的数据。
(3)使用render()函数,生成渲染模板响应
2.静态文件
在static文件夹中存放咱们所需的css,js等文件,在static文件夹中新建images文件夹,存放图片。
(1)配置static目录
STATIC_PATH=os.path.join(BASE_DIR,'static') STATICFILES_DIRS=(STATIC_PATH,)
(2)访问静态文件
localhost:8000/static/images/filename
(3)在模板中访问静态文件
{% load staticfile%}
切记,上面那行代码要放再<!DOCUMENT>下面,而在上面的位置,若是放在中,会形成没必要要的空格。使用{% static "filename" %}访问静态文件。