第一步，用django改写一个网站(step1)

最新推荐文章于 2024-01-30 16:48:04 发布

zhou0213xy

最新推荐文章于 2024-01-30 16:48:04 发布

阅读量539

点赞数

本文链接：https://blog.csdn.net/zhou0213xy/article/details/78763245

版权

本文介绍了Django的基本结构和关键文件，包括urls.py、views.py、models.py、admin.py等，以及如何创建Django项目、同步数据库、运行服务器。通过实例演示了创建一个简单的网页并配置静态文件的过程。

摘要由CSDN通过智能技术生成

让我们⼀览 Django 全貌

urls.py
⽹址⼊⼝，关联到对应的

views.py中的⼀个函数（或者generic 类），访问⽹址就对应⼀个函数。

views.py
处理⽤户发出的请求，从urls.py中对应过来, 通过渲染templates 中的⽹⻚可以将显示内容，⽐如登陆后的⽤户名，⽤户请求的数据，输出到⽹⻚。

models.py
与数据库操作相关，存⼊或读取数据时⽤到这个，当然⽤不到数据库的时候你可以不使⽤。

forms.py
表单，⽤户在浏览器上输⼊数据提交，对数据的验证⼯作以及输⼊框的⽣成等⼯作，当然你也可以不使⽤。 templates ⽂件夹 views.py 中的函数渲染templates中的Html模板，得到动态内容的⽹⻚，当然可以⽤缓存来提⾼速度。

admin.py
后台，可以⽤很少量的代码就拥有⼀个强⼤的后台。 settings.py Django 的设置，配置⽂件，⽐如 DEBUG 的开关，静态⽂件的位置等。

安装pip

安装django (我安装的是1.8.3版本)

（不同的项目可能需要不同的django版本，可以通过virtualenv来做） virtualenv 可以做到！参⻅ Python 三⼤神器第⼆部分：http://www.ziqiangxuetang.com/python/pipvirtualenv-fabric.html

django的基本命令

1. 新建⼀个 django-project django-admin.py startproject project-name ⼀个 project ⼀般为⼀个项⽬

2. 新建 app python manage.py startapp app-name 或 django-admin.py startapp app-name ⼀般⼀个项⽬有多个app, 当然通⽤的app也可以在多个项⽬中使⽤。

3. 同步数据库 python manage.py syncdb 注意：Django 1.7.1及以上的版本需要⽤以下命令 python manage.py makemigrations python manage.py migrate 这种⽅法可以创建表，当你在models.py中新增了类时，运⾏它就可以⾃动在数据库中创建表了，不⽤⼿动创建。备注：对已有的 models 进⾏修改，Django 1.7之前的版本的
Django都是⽆法⾃动更改表结构的，不过有第三⽅⼯具 south,详⻅ Django 数据库迁移⼀节。

4. 使⽤开发服务器 python manage.py runserver # 当提示端⼝被占⽤的时候，可以⽤其它端⼝： python manage.py runserver 8001 python manage.py runserver 9999 # 监听所有可⽤ ip python manage.py runserver 0.0.0.0:8000 # 如果是外⽹或者局域⽹电脑上可以⽤其它电脑查看开发服务器 # 访问对应的 ip加端⼝，⽐如 http://172.16.20.2:8000

5. 清空数据库 python manage.py flush 此命令会询问是 yes 还是 no, 选择 yes 会把数据全部清空掉，只留下空表。

6.创建超级管理员 python manage.py createsuperuser

7. 导出数据导⼊数据 python manage.py dumpdata appname > appname.json python manage.py loaddata appname.json 关于数据操作详⻅：数据导⼊数据迁移，现在了解有这个⽤法就可以了。
8. django 项⽬环境终端 python manage.py shell 如果你安装了 bpython 或 ipython 会⾃动⽤它们的界⾯，强烈推荐⽤ bpython

9. 数据库命令⾏ python manage.py dbshell Django 会⾃动进⼊在settings.py中设置的数据库，如果是 MySQL 或 postgreSQL,会要求输⼊数据库⽤户密码。在这个终端可以执⾏数据库的SQL语句。如果您对SQL⽐较熟悉，可能喜欢这种⽅式。

10. 更多命令终端上输⼊ python manage.py 可以看到详细的列表，在忘记了名称的时候特别有⽤。更详细的介绍，点击对应版本去官⽹查看： 1.6 1.7 dev

创建你的项目

python manage.py startapp django_web

在settings.py下，注册你刚刚创建的工程

Django的开发遵循MTV模式（models, templates, views），views.py负责执行操作，models.py负责数据处理（如数据库连接），templates目录下存放网页的模板

首先在templates下新建一个index.html文件，并把以下内容替换到该文件中。。。。。。（书上说的的MVC模式，模型、视图、控制）

编写views.py文件，定义访问这个index.html文件的操作

def index(request): 

     return render(request, 'index.html')

编写urls.py文件，定义访问这个index.html的url路径（使用正则表达式）

from django.conf.urls import url
from django.contrib import admin
from django_web.views import index #导入views.py文件中的index函数

urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^index/', index), #在url中凡是以url开头的访问都使用index函数来处理该请求
]

在pycharm的Terminal中输入命令运行服务器：

python manage.py runserver

在浏览器中输入url：http://127.0.0.1:8000/index 如下图所示

将css文件（css文件的内容在最后）和图片（随意找几张图片，更名为如下所示即可）都复制到env5工程下的一个名为static的文件，工程结构如下：

修改index.html

在settings.py文件的最后增加如下配置

STATICFILES_DIRS = (os.path.join(BASE_DIR, "static"),)

再次打开浏览器就可以看到正常的显示

CSS代码:

body {
    padding: 0 0 0 0;
    background-color: #ffffff;
    background-image: url(../images/bg3-dark.jpg);
    background-position: top left;
    background-repeat: no-repeat;
    background-size: cover;
    font-family: Helvetica, Arial, sans-serif;
}

.main-content {
    width: 500px;
    padding: 20px 20px 20px 20px;
    border: 1px solid #dddddd;
    border-radius:15px;
    margin: 30px auto 0 auto;
    background: #fdffff;
    -webkit-box-shadow: 0 0 22px 0 rgba(50, 50, 50, 1);
    -moz-box-shadow:    0 0 22px 0 rgba(50, 50, 50, 1);
    box-shadow:         0 0 22px 0 rgba(50, 50, 50, 1);

}
.main-content p {
    line-height: 26px;
}
.main-content h2 {
    color: #585858;
}
.articles {
    list-style-type: none;
    padding: 0;
}
.articles img {
    float: left;
    padding-right: 11px;
}
.articles li {
    border-top: 1px solid #F1F1F1;
    background-color: #ffffff;
    height: 90px;
    clear: both;
}
.articles h3 {
    margin: 0;
}
.articles a {
    color:#585858;
    text-decoration: none;
}
.articles p {
    margin: 0;
}

.article-info {
    float: left;
    display: inline-block;
    margin: 8px 0 8px 0;
}

.rate {
    float: right;
    display: inline-block;
    margin:35px 20px 35px 20px;
}

.rate-score {
    font-size: 18px;
    font-weight: bold;
    color: #585858;
}

.rate-score-hot {

}

.meta-info {
}

.meta-cate {
    margin: 0 0.1em;
    padding: 0.1em 0.7em;
    color: #fff;
    background: #37a5f0;
    font-size: 20%;
    border-radius: 10px ;
}

.description {
color: #cccccc;
}

.nav {
    padding-left: 0;
    margin: 5px 0 20px 0;
    text-align: center;
}
.nav li {
    display: inline;
    padding-right: 10px;
}
.nav li:last-child {
    padding-right: 0;
}
.header {
    padding: 10px 10px 10px 10px;

}

.header a {
    color: #ffffff;
}
.header img {
    display: block;
    margin: 0 auto 0 auto;
}
.header h1 {
    text-align: center;
}

.footer {
    margin-top: 20px;
}
.footer p {
    color: #aaaaaa;
    text-align: center;
    font-weight: bold;
    font-size: 12px;
    font-style: italic;
    text-transform: uppercase;
}

html代码：

{% load static %}

<html>

<div class="header">
    <img src="{% static 'images/blah.png' %}">
    <ul class="nav">
        <li><a href="#">Home</a></li>
        <li><a href="#">Site</a></li>
        <li><a href="#">Other</a></li>
    </ul>
</div>

<div class="main-content">
<h2>Article</h2>
<ul class="articles">

            <div class="article-info">
                <h3><a href="#">The blah</a></h3>
                <p class="meta-info">
                    <span class="meta-cate">fun</span>
                    <span class="meta-cate">Wow</span>
                </p>
                <p class="description">Just say something.</p>
            </div>

        <li>
            <img src="{% static 'images/0002.jpg' %}" width="100" height="91">
            <div class="article-info">
                <h3><a href="#">The blah</a></h3>
                <p class="meta-info">
                    <span class="meta-cate">butt</span>
                    <span class="meta-cate">NSFW</span>
                </p>
                <p class="description">Just say something.</p>
            </div>

        <li>
            <img src="{% static 'images/0003.jpg' %}" width="100" height="91">
            <div class="article-info">
                <h3><a href="#">The blah</a></h3>
                <p class="meta-info">
                    <span class="meta-cate">sea</span>
                </p>
                <p class="description">Just say something.</p>
            </div>

        <li>
            <img src="{% static 'images/0004.jpg' %}" width="100" height="91">
            <div class="article-info">
                <h3><a href="#">The blah</a></h3>
                <p class="meta-info">
                    <span class="meta-cate">bay</span>
                    <span class="meta-cate">boat</span>
                    <span class="meta-cate">beach</span>
                </p>
                <p class="description">Just say something.</p>
            </div>

</html>