Django搭建web_django创建web

Django搭建web

学习记录：YouTube–Mosh的Python教程

1. 创建django项目

1.1 项目建立

在terminal输入：

django-admin startproject pyshop .
1

在当前文件夹中建立一个名为pyshop的项目

启动django项目：

python manage.py runserver
1

1.2 在项目内新建不同的app（功能块）

建立名为products的package（app）

python manage.py startapp products
1

• products是一个package，可以在其他地方reuse

• admin：定义这个app的管理面板是什么样的

• apps：存储这个app的configuration setting

• models：定义class来model app中的concept

• tests：自动化测试

• views：set用户在每个页面看到的东西

  1.2.1 URL mapping

  在products文件夹中new一个py文件，名为urls

  from django.urls import path
  from . import views #.表示当前 import views model
  
  urlpatterns = [
      path('', views.index) #表示root /products 界面 导向view.index函数
  ]
  1
  2
  3
  4
  5
  6

  pyshop文件夹中的urls：

  from django.contrib import admin
  from django.urls import path,include
  
  import ...
  
  urlpatterns = [
      path('admin/', admin.site.urls),
      path('products/', include('products.urls')) #告诉django products app
  ]
  1
  2
  3
  4
  5
  6
  7
  8
  9

  1.2.2 增加url：/products/new

1.2.3 Model

1.2.4 migrations

先在setting文件中加一行

当每次要把model中添加的新class迁移到数据库中时，都要执行下面两条指令：

1. terminal输入：

python manage.py makemigrations
1

在migrations文件夹中会生成一个0001_initial.py文件

2. 再在terminal输入：

python manage.py migrate #会根据我们的数据库，运行该应用程序的迁移
1

django为此应用创建或更新了一个数据库

1.3 Admin

在terminal创建新用户，用于登录/admin

python manage.py createsuperuser
1

add时遇到error：

要将django升级到2.1.5，并删除原有的db.sqlite3文件，重新数据迁移一次

admin页面表格可视化处理

在admin.py中增加新class，使表格可以display

class ProductAdmin(admin.ModelAdmin):  
    list_display = ('name', 'price', 'stock')

admin.site.register(Product, ProductAdmin)
1
2
3
4

1.4 渲染HTML页面

在products文件夹下new一个文件夹 template ，在template中new一个 index.html ，写入以下代码：

<h1>Products</h1>
<ul>
    {% for product in products %}
        <li>{{ product.name }} (${{ product.price }})</li>
    {% endfor %}

</ul>
1
2
3
4
5
6
7

django中，{% %}用来执行动态的逻辑，比如上述的for loop

{{}}用来动态呈现HTML中的值

1.5 Adding Bootstrap

在 https://getbootstrap.com/docs/4.5/getting-started/introduction/ 中找到 Starter template 并复制代码

在template文件夹中new一个 base.html 粘贴复制的代码，在index.html 最上面加一行 {% extends 'base.html' %} extends base文件，以下为index.html内容：

{% extends 'base.html' %}
{% block content %}
    <h1>Products</h1>
    <ul>
        {% for product in products %}
            <li>{{ product.name }} (${{ product.price }})</li>
        {% endfor %}
    </ul>
{% endblock %}
1
2
3
4
5
6
7
8
9

1.5.1 将templates文件夹中的base.html 设为全局可用

在PyShop目录下新建templates文件夹，并将base.html 转移过来

在pyshop -> settings.py 的TEMPLATES中增加

        'DIRS': [
            os.path.join(BASE_DIR, 'templates')
        ],
1
2
3

1.5.2 增加页面padding（页边距）

使用 <div class="container"> </div> 包围

在base.html中添加：

<div class="container">
    {% block content %}
    {% endblock %}
</div>
1
2
3
4

7%;" />

1.5.2 增加页面padding（页边距）

使用 <div class="container"> </div> 包围

在base.html中添加：

<div class="container">
    {% block content %}
    {% endblock %}
</div>
1
2
3
4