Windows下Python+Django制作网站的方法(2)

上一篇【点我】

8、导入到数据库

在数据没有导入到数据库之前,的数据表是0,如下图:

所以我们需要把数据导入到数据库:
$ python manage.py migrate

然后刷新数据库,此时,数据表的数量更新到了10,表示数据导入了。

但是仔细看,发现这些都是系统自带的,我们自己定义的模型,怎么不显示呢?
原来,在导入数据库之前,虽然我们更新了models.py的代码,但是数据库还没记录,为此,还有一个命令,是需要把修改的模型,更新到blog migrations的文件夹里,然后再导入到数据库。

输入命令:
$ python manage.py makemigrations blog

其中,blog是定义的app的名字,发现C:\XXXX\django1\blog\migrations路径下,多了一个0001_initial的文件,如下图:

再次把更新后数据导入到数据库:
$ python manage.py migrate

再次刷新数据库,发现数据表从10变成了11,多了一个我们自己定义的article,那为何显示的是article,而不是blog呢?这是因为blog是定义的app的名字,而在数据库相关的代码中,在class Meta部分,定义的名字是article,对应的代码是:db_table = ‘article’。

基于以上经验,以后牵涉数据的操作,可考虑先运行makeigrations命令,再运行migrate命令。xxx表示对应app名字。
$ python manage.py makemigrations xxx
$ python manage.py migrate

9、修改首页和页面模版

之前我们打开本地首页,出现的是It works字样,是系统自带的。既然要做自己的站点如blog,那自然是需要修改的,以下是最简单的举例。
首先我们查看Django官网的关于views的说明,地址为:
https://docs.djangoproject.com/en/1.10/topics/http/views/
打开 C:\XXXX\django1\blog 路径下的views.py文件,修改代码为:

from django.shortcuts import render
from django.http import HttpResponse
import datetime

# Create your views here.
def home(request):
    now = datetime.datetime.now()
    html = "<html><body>It is now %s.</body></html>" % now
    return HttpResponse(html)`

由于打开url的时候,当views的改变也需要在url联动配置修改,故打开C:\XXXX\django1\django1 路径下的urls.py文件,修改代码为:
from django.conf.urls import url
from django.contrib import admin
from blog import views

urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'^$', views.home),
]`

注意到:上述修改的代码里,已经牵涉了HTML语言,当然这里很简单。
此时,在浏览器输入:http://localhost:8000/,如下图显示的是自定义的当前时间:

此时问题来了,怎么看都感觉HTML语言写起来比Python的代码要复杂,尤其是如果页面的内容繁多,那不是要写成马了?所以,我们需要用到模版功能。
到C:\XXXX\django1\blog 路径下,新建名为:templates的文件夹,注意这个名字是Django默认的,所以不要自定义其他名称。
关于模版,一种是引用别人的模版,一些优秀的模版用和看起来都很舒服。
这里演示自己创建一个简易模版。方法为:
在Sublime Text 的File中新建一个文件,把代码:

It is now, now or not?

复制进去,然后保存到C:\XXXX\django1\blog\templates 路径,Sublime Text会识别成后缀为html的文件,这样就是一个html语言的模版了,注意特意增加了:now or not?字样用于和之前的方法比对。
接下来,为了方便,我们可以使用render()函数。网址为:
https://docs.djangoproject.com/en/1.10/topics/http/shortcuts/

这样,views.py文件的home函数也修改成了:

def home(request):

    return render(request, 'home.html')

然后我们发现,本地首页跟着改变了:

Tips:一些调试错误的小技巧
views.py增加的函数,需要在urls.py进行导入和更新操作,模版制定后,为了尝试增加或者修改内容,可能引起意外的404错误,所以,最好单独备份一份正常的模版。

10、页面模板之Bootstrap

现在的页面模板其实是一个Python功能模块,里面的各种参数用Python语法加以逻辑处理,就可以做到一个html文件模板呈现出不同的内容。
但是和其他漂亮的网站比,虽然我们已经学会让网页上输出一些文字,但很空洞。
而且无论如何,即便后续在页面增加了一些文章,图片等,相对于在后端写代码来实现网页功能来说,对于前端的网页美观显示还是要额外花销很多时间,诸如如何排版布局、文字样式、图片增强效果等。好在有像Bootstrap这样的模版工具(推特的工程师制作),可以直接使用就有很好的效果。
当下载好Bootstrap之后,发现解压后只有1M大小,里面有3个文件夹,css、fonts和js。

到了这一步,我们就开始接触到css的概念。那么百科下:

http://baike.baidu.com/link?url=3MtvIxATwYtq7W77zMM0wEjiXUJ2MSONA38Qws-szl93UFSpmHSSa9r5QFae9Hfg7_0xFjueevoKAdgEAJ_Dvq4Drvs-_M2GRB1WWXgujjm

我们暂时有这个印象,网页技术的前端基本基于:html+css
在这里,需要强调下Django的setting.py文件的重要性,这相当于是他的系统设置核心,当我们要进行添加功能的时候,基本都要牵涉修改setting.py的代码,比如在第6部分中,我们修改了DATABASES 和INSTALLED_APPS部分的代码。
如果我们在setting.py搜索关键词:css,在代码的末尾,写到:

# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.10/howto/static-files/

STATIC_URL = '/static/'

那么我们就打开他提供的网址,去看看官网的说明:

https://docs.djangoproject.com/en/1.10/howto/static-files/

官网提示,当牵涉urls的时候,需要修改如下图:

于是,我们可把2行import的代码添加到urls.py中,同时不要忘记urlpatterns部分的代码也要跟着改进。此时,我们的urls.py的代码为:

from django.conf.urls import url
from django.contrib import admin
from blog import views
from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'^$', views.home),`

] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

接下来,根据官网要求C:\XXXX\django1\blog\ 路径下,也就是在app的目录下建立static的文件夹,并把我们下载解压的Bootstrap的3个文件夹放到static路径。

并从网上下载一个Bootstrap的模版范例,把对应的images文件和xxx.html文件一起放到C:\xxxx\django1\blog\templates 路径。
首先直接双击打开里面的index.html,可以看到浏览器显示的地址是:file:///C:/xxx/mysite/blog/templates/index.html
现在想在localhost:8000下,也显示相同的内容。
首先打开views.py,把home改成index,因为我们一开始的主页名字定义为home,而现在模版的首页名字是index。但是当我们回车,发现界面如下:

并且,根据要求,我们把带有link href 后面的代码,根据上图都修改成形如下面的语句(红色加粗为添加的):

<link href="{% static "css/bootstrap.css" %}" rel="stylesheet" type="text/css" media="all">

最后,我们就得到了和直接双击index.html一样的效果,如下图(中文是我添加,为庆祝女排奥运夺冠):

也许你会说,这网页也不是很漂亮啊,其实这里主要是选了一个简单的网页模版,
用来示范操作的,可以谷歌到很多精彩的bootstrap的框架模版,但如果要修改成自己的,
也是需要在HTML里修改不少内容,再加上本身我对前端的知识也比较有限。
到这里,就完成了Python+Django实现网站的教程了。
当然要做一个内容较多的网站还是需要很多后续工作的。 ”——)

11 参考: fanhuaxiu.com