2 实现第一个Django网站博客

最新推荐文章于 2024-08-10 14:11:47 发布

weixin_30439067

最新推荐文章于 2024-08-10 14:11:47 发布

阅读量100

点赞数

CC 4.0 BY-SA版权

文章标签： python 数据库 ui

原文链接：http://www.cnblogs.com/venicid/p/8076504.html

本文详细介绍如何使用Django框架创建网站，包括搭建环境、创建模板、引入静态文件、后台管理及数据模型操作等内容。

-1.理解上下文

render（）渲染
request url传来的reuqest
x.html 制定返回的模板名称
context 上下文数据库中替换数据

0.大框架

1.创建模板

　　（1）创建templates和static文件夹

在firstapp中创建文件夹

　　（2）setting.py设置文件迁移

    'DIRS': [os.path.join(BASE_DIR,'templates').replace('\\','/')],

　　（3）引入静态文件：模板语言（错误：看下面）

{% staticfiles %}

#css文件目录
<link rel="stylesheet" href="{% static 'css/semantic.css'%}" media="screen" title="no title" charset="utf-8">

#图片目录
<img src="{% static 'images/banner.jpg'%}" alt="" />

2.创建后台

　　 (1)查看后台

　　（2）创建超级管理员

PS C:\Users\Administrator\Desktop\root\firstsite> python.exe .\manage.py createsuperuser
Username (leave blank to use 'administrator'): admin
Email address:   空
Password:   admind
Password (again):  admin
Superuser created successfully.

　　（3）向后台注册提交数据库

from django.contrib import admin
from firstapp.models import People
# Register your models here.

admin.site.register(People)

　　（4）添加数据,并显示

　　（5）添加Article表，

class Aritcle(models.Model):
    headline = models.CharField(null=True,blank=True,max_length=500)
    content = models.TextField(null=True, blank=True)

    def __str__(self):
        return self.headline

后台注册提交

创建数据库，

tsite> python.exe .\manage.py makemigrations
root\firstsite> python.exe .\manage.py migrate

创建文章

3.Model引入数据

　　（1）view.py 文件导入Article

　　（2）创建index视图函数

　　（3）获取数据库的数据

article_list = Aritcle.objects.all()  #获取Article数据库所有的数据

　　（4）render（请求，网页，上下文）函数渲染好一个网页

def index(request):
    article_list = Aritcle.objects.all()  #获取Article数据库所有的数据
    web_page = render(request,'first.html',context)
    return web_page

　　（5）上下文：字典装载数据

context['article_list'] = article_list

　　（6）代码：view.py文件

from django.shortcuts import render,HttpResponse
from firstapp.models import People,Aritcle
from django.template import Context,Template
# Create your views here.

def first_try(request):
    person = People(name='alxe',job='it')
    html_string = '''
                <!DOCTYPE html>
                <html>
                  <head>
                    <meta charset="utf-8">
                    <title>first_try</title>
                  </head>
                  <body>
                    <h1>Hello</h1>
                    <h3> {{ person.name }} </h3>
                  </body>
                </html>
    '''
    t = Template(html_string)
    c = Context({'person':person})
    web_page = t.render(c)

    return HttpResponse(web_page)
        context = {}
    context['article_list'] = article_list
    
def index(request):
    context = {}
    article_list = Aritcle.objects.all()  #获取Article数据库所有的数据
    context['article_list'] = article_list
    index_page = render(request,'first.html',context)
    return index_page

View Code

4.Django模板语言

　　（1）模板语言渲染html

    {% for article in article_list %}
      <div class="ui vertical segment">
        <div class="ui container segment">
          <h1 class="ui header">{{article.headline}} </h1>
          <p>
            {{ article.context }}
          </p>
          <button type="button" name="button" class="ui inverted blue button">Read more</button>
        </div>
      </div>
    {% endfor %}

　　（2）ur.pyl添加地址

from django.conf.urls import include, url
from django.contrib import admin
from firstapp.views import first_try,index

urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'^first_try/', first_try),
    url(r'^index/', index,name='index'),
]

5.效果演示

　　（1）报错

　　（2）修改bug

　　（3）无法加载css image

　　（4）静态文件导入路径错误

    'DIRS': [os.path.join(BASE_DIR,'templates').replace('\\','/')],

  <link rel="stylesheet" href="{% static 'css/semantic.css'%}" media="screen" title="no title" charset="utf-8">     
 <img src="{% static 'images/banner.jpg'%}" alt="" />

　　（5）templates 和static 文件夹在firstapp中创建

　　（6）完整代码html

<!DOCTYPE html>
{% load staticfiles %}
<html>
  <head>
    <meta charset="utf-8">
    <title>first web</title>
    <link rel="stylesheet" href="{% static 'css/semantic.css'%}" media="screen" title="no title" charset="utf-8">
  </head>
  <body>
    <div class="ui inverted vertical segment">
      <div class="ui image">
        <img src="{% static 'images/banner.jpg'%}" alt="" />

      </div>
    </div>


    {% for article in article_list %}
      <div class="ui vertical segment">
        <div class="ui container segment">
          <h1 class="ui header">{{article.headline}} </h1>
          <p>
            {{ article.content }}
          </p>
          <button type="button" name="button" class="ui inverted blue button">Read more</button>
        </div>
      </div>
    {% endfor %}

    <div class="ui inverted very padded segment">
      maguacoding
    </div>

  </body>
</html>

View Code

6.模板语言：过滤器100个字符

{{ article.content|truncatewords:100 }}

只能过滤英文

<!DOCTYPE html>
{% load staticfiles %}
<html>
  <head>
    <meta charset="utf-8">
    <title>first web</title>
    <link rel="stylesheet" href="{% static 'css/semantic.css'%}" media="screen" title="no title" charset="utf-8">
  </head>
  <body>
    <div class="ui inverted vertical segment">
      <div class="ui image">
        <img src="{% static 'images/banner.jpg'%}" alt="" />

      </div>
    </div>


    {% for article in article_list %}
      <div class="ui vertical segment">
        <div class="ui container segment">
          <h1 class="ui header">{{article.headline}} </h1>
          <p>
            {{ article.content|truncatewords:100 }}
          </p>
          <button type="button" name="button" class="ui inverted blue button">Read more</button>
        </div>
      </div>
    {% endfor %}

    <div class="ui inverted very padded segment">
      maguacoding
    </div>

  </body>
</html>