Django网站开发流程概要

(基础概念,MVC模型的理解,可参考:http://www.runoob.com/django/django-model.html)

假设要开发的项目名为:tutorial, App名字为:blog

流程:

1.创建项目,添加app,配置语言,区划信息,数据库连接信息:

django-admin startproject tutorial
django-admin startapp blog

tutorial文件夹setting.py文件下:
INSTALLED_APPS中把"blog"添加进去
LANGUAGE_CODE='zh-hans'   默认为:en-us
TIME_ZONE='Asia/Shanghai' 默认为:UTC

2.创建超级用户,指定用户名,密码,能成功访问管理页面:

python manage.py createsuperuser

设置用户名,邮箱,密码 

Username: admin 
Email address: admin@example.com 
Password: ********** 
Password (again): ********* 
Superuser created successfully. 

参考自:https://docs.djangoproject.com/en/2.0/intro/tutorial02/#creating-an-admin-user

3.分别开发配置 Models.py Views.py Urls.py, 也就是配置MVC:

Models用于定义网页元素与数据库字段之间的对应关系(修改后要执行数据同步: python manage.py makemigrations, migrate);

Views用于定义请求处理函数,生成响应给前端。响应中包含要调用的页面模板;

Urls用于定义每一个网址要由Views里的那个函数来响应请求,其中:tutorial中的urls.py是最早的请求处理入口,可以直接指定处理函数,也用以把请求分派给其它app里的urls来处理。blog这个app中定义了自己这个模块对于url请求的响应规则。

4.模板,即:templates:

模板文件具体定义了每一个页面的排版布局。通过在views.py中指定响应给前端的是哪一个页面。

代码中,templates文件夹存放在tutorial/blog/下:

views.py中引用base.html的方法如下(包含传参):

# -*- coding: utf-8 -*-
from __future__ import unicode_literals

from django.shortcuts import render

# Create your views here.

from django.http import HttpResponse
from blog.models import Article
from datetime import datetime
from django.http import Http404

# Create your views here.
def Test(request):
    return render(request,'blog/test.html',{'current_time': datetime.now()})

访问效果:

5.开发调试完成后,上线部署流程:

应用服务器可选:apache或者nginx。

要安装插件:sudo pip install uwsgi

( to be continue… )

附录:

软件安装:pip install django

如果有python多版本的问题,请参考anaconda的使用。

 

HTML页面制作常识

1.颜色:

MAC系统自带有测色计,路径:Launchpad -> 其他文件夹 -> 数码测试计

RGB与十六进制颜色码转换:http://www.sioe.cn/yingyong/yanse-rgb-16/

2.常用代码格式:

<!DOCTYPE html>
<html lang="zh">
 <head>
 <meta charset="UTF-8">
 <title>XiaoLan's Blog</title>
 </head>
 
 <!-- 这是一行html注释 -->
 <!--
 style中:
 corlor: 字段颜色
 background: 背景颜色
 padding: 盒子内页边距
 px: 根据参数个数不同,上右下左
 em: 相对比例
 margin: 盒子外页边距
 -->
 
 <style type="text/css">
 body{
 color: #000;
 background: #F9F9F9;
 padding: 12px 5em;
 margin:7px;
 }
 h1{
 color: #ffffff;
 padding: 2em;
 background: #1D8BC1;
 }
 h2{
 color: #FF5D49;
 border-top: 2px dotted #000000;
 margin-top:2em;
 }
 h3{
 color: #FFD700;
 margin-top:2em;
 }
 h4{
 color: #FF00FF;
 margin-top:2em;
 }
 p{
 margin:1em 0;
 }
 </style>
 <body>
 <h1>小蓝的博客</h1>
 <h2>level -> h2</h2>
 <h3>level -> h3 简单,纯粹!</h3>
 <h4>level -> h4</h4>
 {% block content %}
 {% endblock %}
 </body>
</html>

附:关于body里,padding与margin的区别可这样理解:

附:关于CSS中用em,rem代替px的意义:

px是一个固定单位,em,rem表达的是相对单位。

网页用于展示内容,浏览器有不同的显示尺寸,按钮,字体等都有可能随着显示的放大缩小而需要相对的缩放。如果只用px来表示,必然造成网页内容无法相对的放大或缩小,反之,em,rem定义出来的尺寸,就能符合这种需求。

em 和 rem 单位之间的区别是浏览器根据谁来转化成 px 值
1. rem 如何转换为像素值?
 当使用 rem 单位时,根据 根元素字体大小 转换 px 值。
 其对应的像素值为根元素字体大小乘以 rem 值。根元素的字体大小即 html 元素字体大小。
 如:根元素字体大小 为 16px,则 10rem 等于 16px * 10 = 160 px。
2. em 如何转换为像素值?
 当使用 em 单位时,根据当前使用 em 单位的元素的字体大小转换 px 值。
 其对应的像素值为 当前使用 em 单位的元素的字体大小乘以 em 值。
 如:当前使用 em 单位的元素的字体大小为 16px,则 10em 等于 16px * 10 = 160px。
 
使用em的意义,在于“与当前字体大小成比例”设置当前元素的 padding,margin,line-height 等值,在文本排版时很常用。

rem的意义,在于通过控制根元素字体大小,让页面在各种尺寸的移动端设备上自适应。
在移动端页面制作的时候,当你不需要元素的尺寸、间距与当前字体成比例,你应该考虑使用 rem。

作者:阿树
链接:https://www.zhihu.com/question/46279241/answer/100817629
来源:知乎

Django博客网站开发例子

参考网址:https://www.cnblogs.com/Liqiongyu/p/5909706.html

具体步骤:

# 创建项目
django-admin startproject tutorial

# 创建App
django-admin startapp blog

#注册新的APP name到installed_apps:

把tutorial文件夹下的apps.py中的类名注册到:tutorial文件夹setting.py文件下的INSTALLED_APPS中。
这步做完后,下面要做的makemigrations才会在数据库中创建相应的数据,否则执行makemigrations不会有任何效果

# 同步一下数据库和模型之间的联系

如果不做同步操作的话,就很有可能报出:

django.db.utils.OperationalError: unable to open database file

django < 1.7 时: python manage.py syncdb

django > 1.7 时: python manage.py makemigrations

python manage.py migrate

#创建admin用户
$ python manage.py createsuperuser

#运行服务:
python manage.py runserver

#浏览器访问:
http://127.0.0.1:8000/admin

这时应能正常访问administration站点。

#修改setting.py中全局配置之语言区域:

LANGUAGE_CODE=’zh-hans’ 默认为:en-us

TIME_ZONE=’Asia/Shanghai’ 默认为:UTC

# 修改setting.py中全局配置之数据库访问及底层模型

# 修改models.py,定义网页内容

# -*- coding: utf-8 -*-
from __future__ import unicode_literals

from django.db import models

from DjangoUeditor.models import UEditorField

# 模型是Django提供一个抽象层(Models)以构建和操作你的web应用中的数据

# Create your models here.
class Article(models.Model):
 title = models.CharField(u"博客标题", max_length=100) # 博客标题
 category = models.CharField(u"博客标签", max_length=50, blank=True) # 博客标签
 pub_date = models.DateTimeField(u"发布日期", auto_now_add=True, editable=True) # 博客发布日期
 update_time = models.DateTimeField(u'更新时间', auto_now=True, null=True)
 content = models.TextField(blank=True, null=True) # 博客文章正文

 def __unicode__(self):
 return self.title

 class Meta: # 按时间下降排序
 ordering = ['-pub_date']
 verbose_name = "文章"
 verbose_name_plural = "文章"

# 这里定义的类名:Article 后面要分别在blog文件夹下的: views.py, admin.py文件中 添加语句: from .models import BlogPost 把类的信息同步过去。

如果在models.py中修改了数据库模型,后面要记得再执行一次: python manage.py makemigrations python manage.py migrate

让新增的APP能够被admin站点纳管,编辑blog/admin.py:

#coding:utf8
 
from django.contrib import admin
from blog.models import Article
# Register your models here.
 
class ArticleAdmin(admin.ModelAdmin):
    list_display = ('title','pub_date')
 
admin.site.register(Article,ArticleAdmin)

在站点的admin.py中注册app类名: 修改APP的admin.py: from .models import model.py中定义的类名 admin.site.register(model.py中定义的类名)

这步做完后,才可以在admin站点的页面中看到并添加新的APP。

#这个时候已可以访问 http://127.0.0.1:8000/admin添加博客文章

# 下面将集成DjangoUeditor 编辑器:

直接用pip安装的Ueditor是python2版本的,如果需要Python3版本就需要从github下载源码包。解压后在命令行中进入源码包,输入python setup.py install

编辑setting.py ,在INSTALLED_APPS添加’DjangoUeditor’

在主urls.py中添加url(r’^ueditor/’,include(‘DjangoUeditor.urls’ ))

在models.py中添加引用,把原来model.py的content替换掉:

    #content = models.TextField(blank=True, null=True)  # 博客文章正文
    content = UEditorField(u"文章正文", height=300, width=1000, default=u'', blank=True, imagePath="uploads/blog/images/",
                       toolbars='besttome', filePath='uploads/blog/files/')

这个时候,在写博客的时候,就有一个方便的编辑插件可使用。

# 完善MVC模式

# Model层在blog/models.py中已经定义,主要用于定义页面元素与数据库字段对应关系。

#Control层用于定义每个URL请求应该访问后台那个接口,由哪个函数定义响应行为

# 我们定义tutorial/urls.py如下:

from django.conf.urls import url
from django.contrib import admin

# add by author
from django.conf.urls import include
from DjangoUeditor import urls as djud_urls
from django.conf import settings

import blog.urls as blog_url
from blog.views import home

urlpatterns = [
    url(r'^$',home,name="index"),
    url(r'^blog/',include(blog_url)),
    url(r'^admin/', admin.site.urls),
    url(r'^ueditor/', include('DjangoUeditor.urls')),
]

if settings.DEBUG:
    from django.conf.urls.static import static
    urlpatterns += static(settings.MEDIA_URL,document_root = settings.MEDIA_ROOT)

#定义blog/urls.py内容如下:

#coding:utf8
from django.conf.urls import url
from . import views

urlpatterns = [
    url(r'^post/(?P<id>\d+)/$',views.Detail,name="blog_detail"),
    url(r'^home/',views.home,name="blog_home"),
    url(r'^test/',views.Test,name="blog_test"),
]

# V(views.py)视图层
# 决定一个特定函数用于响应用户特定url过来的请求

#编辑 blog/views.py:

# -*- coding: utf-8 -*-
from __future__ import unicode_literals

from django.shortcuts import render

# Create your views here.

from django.http import HttpResponse
from blog.models import Article
from datetime import datetime
from django.http import Http404
# Create your views here.

def home(request):
    post_list = Article.objects.all()  # 获取全部的Article对象
    return render(request, 'blog/home.html', {'post_list': post_list})

def Test(request):
    return render(request,'blog/test.html',{'current_time': datetime.now()})

def Detail(request,id):
    try:
        post = Article.objects.get(id=str(id))
    except Article.DoesNotExist:
        raise Http404
    return render(request,'blog/post.html',{'post':post})

#定义templates, 指定网页元素如何展示:

3.附录

参考网页:

https://www.cnblogs.com/Liqiongyu/p/5909706.html

安装DjangoUeditor的方法:

https://github.com/twz915/DjangoUeditor3/

makemigrations提示no changes的处理办法:

删除db.sqlite3中的表,删除blog/migrations下的内容。

http://blog.csdn.net/listron/article/details/67635093

把表都删除了,执行:

python manage.py makemigrations 还是提示no changes.

执行如下语句就OK:

python manage.py makemigrations blog