Web开发day5：项目
2024-05-12 21:18:50
目录
1. 创建django项目
2. 创建app，设置名称为website，并注册，改语言
3. 加插件
4. 设计表结构
5. 在MySQL中生成表
6. 开始项目，上代码
7. 效果图
进度来源：最新Python的web开发全家桶（django+前端+数据库）
网址：最新Python的web开发全家桶（django+前端+数据库）_哔哩哔哩_bilibili
1. 创建django项目
- 删除setting.py中的DIRS，使其变为空列表
- 删除templates文件夹
2. 创建app，设置名称为website，并注册，改语言
1.创建app项目website
>>python manage.py startapp website2.在setting.py文件新增'website.apps.WebsiteConfig'，注册app
INSTALLED_APPS = ['django.contrib.admin','django.contrib.auth','django.contrib.contenttypes','django.contrib.sessions','django.contrib.messages','django.contrib.staticfiles','website.apps.WebsiteConfig',
]LANGUAGE_CODE = 'zh-hans'3. 加插件
4. 设计表结构
from django.db import modelsclass Department(models.Model):"""部门表"""title = models.CharField(verbose_name='部门名', max_length=32)class UserInfo(models.Model):"""员工表"""name = models.CharField(verbose_name='姓名', max_length=16)password = models.CharField(verbose_name='密码', max_length=64)age = models.IntegerField(verbose_name='年龄')# 10位，小数2位account = models.DecimalField(verbose_name='账户余额', max_digits=10, decimal_places=2, default=0)create_time = models.DateTimeField(verbose_name='入职时间')# 外键，Department表中的id列，生成的列名自动加_id，即depart_id# 外键所在表删除列或表时，两种方式，级联删除/置空depart = models.ForeignKey(verbose_name='部门', to='Department', to_fields='id', on_delete=models.CASCADE)# depart = models.ForeignKey(to='Department', to_fields='id', null=True, blank=True, on_delete=models.SET_NULL)# django的约束，上边的是mysql中的约束gender_choice = {(1, '男'),(2, '女'),}gender = models.SmallIntegerField(verbose_name='性别', choices=gender_choice)5. 在MySQL中生成表
- 首先创建数据库demo：
mysql>>create database demo DEFAULT CHARSET utf8 COLLATE utf8_general_ci;- 修改配置文件，简介MySQL（setting.py）：
DATABASES = {'default': {'ENGINE': 'django.db.backends.mysql', # 引擎，可选不同数据库'NAME': 'demo', # 数据库名字'USER': 'root', # 用户名'PASSWORD': '123456', # 密码'HOST': '127.0.0.1', # 主机，也可写localhost，指安装了MySQL的主机'PORT': 3306, # 端口号}
}- django命令生成数据库表（项目根目录下）：
>>python manage.py makemigrations
>>python manage.py migrate
6. 开始项目，上代码
- urls.py
# from django.contrib import admin
from django.urls import path
from website import viewsurlpatterns = [# path('admin/', admin.site.urls),# 部门管理path('depart/list/', views.depart_list),path('depart/add/', views.depart_add),path('depart/delete/', views.depart_delete),path('depart/<int:nid>/edit/', views.depart_edit), # 后台可以获取nid参数# 用户管理path('user/list/', views.user_list),path('user/add/', views.user_add),path('user/modelform/add/', views.user_modelform_add),
]- views.py
from django.shortcuts import render, redirect
from website.models import Department, UserInfo
from django import formsdef depart_list(request):"""部门列表"""queryset = Department.objects.all()return render(request, 'depart_list.html', {'queryset': queryset})def depart_add(request):"""添加部门"""if request.method == 'GET':return render(request, 'depart_add.html')# 获取用户提交的数据，保存到数据库，重定向回部门列表页面title = request.POST.get('title')Department.objects.create(title=title)return redirect('/depart/list')def depart_delete(request):"""删除部门"""nid = request.GET.get('nid')Department.objects.filter(id=nid).delete()return redirect('/depart/list')def depart_edit(request, nid):"""修改部门"""if request.method == 'GET':row_object = Department.objects.filter(id=nid).first()return render(request, 'depart_edit.html', {'row_object': row_object})title = request.POST.get('title')Department.objects.filter(id=nid).update(title=title)return redirect('/depart/list')def user_list(request):"""用户管理"""queryset = UserInfo.objects.all()# # python语法改变部分属性的显示# for obj in queryset:# print(obj.name)# print(obj.create_time.strftime('%Y-%m-%d'))# # get_字段名称_display()可直接获得男或女# print(obj.gender, obj.get_gender_display())# # depart直接获取部门那一行的对象# print(obj.depart_id, obj.depart.title)return render(request, 'user_list.html', {'queryset': queryset})def user_add(request):"""添加用户（原始方法）"""if request.method == 'GET':content = {'gender_choice': UserInfo.gender_choice,'depart_list': Department.objects.all(),}return render(request, 'user_add.html', content)# 太繁琐，且没有校验name = request.POST.get('name')password = request.POST.get('password')age = request.POST.get('age')account = request.POST.get('account')create_time = request.POST.get('create_time')gender = request.POST.get('gender')department = request.POST.get('department')UserInfo.objects.create(name=name, password=password, age=age, account=account, create_time=create_time, gender=gender, depart_id=department)return redirect('/user/list')class UserModelForm(forms.ModelForm):# 可以在此处重写一些字段的定义，设置验证规则# name = forms.CharField(min_length=4, label='名字')class Meta:model = UserInfofields = ['name', 'password', 'age', 'account', 'create_time', 'gender', 'depart']# ModelForm默认不加样式，要加form-control的话用下widgets# widgets = {# 'password': forms.PasswordInput(attrs={'class': 'form-control', 'placeholder': '密码'})# }# 循环找到所有的插件，添加form-control格式def __init__(self, *arg, **kwargs):super().__init__(*arg, **kwargs)for name, field in self.fields.items():if name == 'password':field.widget = forms.PasswordInput(attrs={'class': 'form-control', 'placeholder': field.label})else:field.widget.attrs = {'class': 'form-control', 'placeholder': field.label}def user_modelform_add(request):"""添加用户ModelForm版本"""if request.method == 'GET':form = UserModelForm()return render(request, 'user_modelform_add.html', {'form': form})# POST方式提交数据，数据校验form = UserModelForm(data=request.POST)if form.is_valid():# 数据合法，保存到数据库form.save()return redirect('user/list/')else:# 显示错误信息return render(request, 'user_modelform_add.html', {'form': form})- layout.html（所有页面基于layout.html，导航条）
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><link rel="stylesheet" href="{% static 'plugins/bootstrap-3.4.1/css/bootstrap.css' %}"><style>.navbar {border-radius: 0;}</style>
</head>
<body>
<nav class="navbar navbar-default"><div class="container"><!-- Brand and toggle get grouped for better mobile display --><div class="navbar-header"><button type="button" class="navbar-toggle collapsed" data-toggle="collapse"data-target="#bs-example-navbar-collapse-1" aria-expanded="false"><span class="sr-only">Toggle navigation</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></button><a class="navbar-brand" href="#">联通用户管理系统</a></div><!-- Collect the nav links, forms, and other content for toggling --><div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"><ul class="nav navbar-nav"><li><a href="/depart/list/">部门管理</a></li><li><a href="/user/list/">用户管理</a></li><li><a href="#">Link</a></li></ul><ul class="nav navbar-nav navbar-right"><li><a href="#">登录</a></li><li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"aria-expanded="false">中财Uzi <span class="caret"></span></a><ul class="dropdown-menu"><li><a href="#">个人资料</a></li><li><a href="#">我的信息</a></li><li role="separator" class="divider"></li><li><a href="#">注销</a></li></ul></li></ul></div></div>
</nav><div>{% block content %}{% endblock %}
</div><script src="{% static 'js/jquery-3.6.1.min.js' %}"></script>
<script src="{% static 'plugins/bootstrap-3.4.1/js/bootstrap.js' %}"></script>
</body>
</html>- depart_lsit.html
{% extends 'layout.html' %}
{% block content %}
<div class="container"><div style="margin-bottom: 10px"><!--下面的a标签可以设置target="_blank"，在新的页面打开--><a class="btn btn-success" href="/depart/add/"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span>新建部门</a></div><div class="panel panel-default"><div class="panel-heading"><span class="glyphicon glyphicon-th-list" aria-hidden="true"></span>部门列表</div><table class="table table-bordered"><thead><tr><th>ID</th><th>名称</th><th>操作</th></tr></thead><tbody>{% for obj in queryset %}<tr><th>{{ obj.id }}</th><td>{{ obj.title }}</td><td><a class="btn btn-primary btn-xs" href="/depart/{{ obj.id }}/edit/">编辑</a><a class="btn btn-danger btn-xs" href="/depart/delete/?nid={{ obj.id }}">删除</a></td></tr>{% endfor %}</tbody></table></div>
</div>
{% endblock %}- depart_add.html
{% extends 'layout.html' %}
{% block content %}
<div class="container"><div class="panel panel-default"><div class="panel-heading"><h3 class="panel-title">新建部门</h3></div><div class="panel-body"><form method="post">{% csrf_token %}<div class="form-group"><label>标题</label><input type="text" class="form-control" placeholder="标题" name="title"/></div><button type="submit" class="btn btn-primary">提 交</button></form></div></div>
</div>
{% endblock %}- depart_edit.html
{% extends 'layout.html' %}
{% block content %}
<div class="container"><div class="panel panel-default"><div class="panel-heading"><h3 class="panel-title">编辑部门</h3></div><div class="panel-body"><form method="post">{% csrf_token %}<div class="form-group"><label>标题</label><input type="text" class="form-control" placeholder="标题" name="title" value="{{ row_object.title }}"/></div><button type="submit" class="btn btn-primary">提 交</button></form></div></div>
</div>
{% endblock %}- user_list.html
{% extends 'layout.html' %}
{% block content %}
<div class="container"><div style="margin-bottom: 10px"><!--下面的a标签可以设置target="_blank"，在新的页面打开--><a class="btn btn-success" href="/user/add/"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span>新建用户</a><a class="btn btn-success" href="/user/modelform/add/"><span class="glyphicon glyphicon-plus-sign" aria-hidden="true"></span>新建用户ModelForm版本</a></div><div class="panel panel-default"><div class="panel-heading"><span class="glyphicon glyphicon-th-list" aria-hidden="true"></span>用户列表</div><table class="table table-bordered"><thead><tr><th>ID</th><th>姓名</th><th>密码</th><th>年龄</th><th>余额</th><th>入职时间</th><th>性别</th><th>所属部门</th><th>操作</th></tr></thead><tbody>{% for obj in queryset %}<tr><!--模板语法不加()不加%--><!--()内的参数统统加到|后，参数名:参数值，多个参数用|连接--><th>{{ obj.id }}</th><td>{{ obj.name }}</td><td>{{ obj.password }}</td><td>{{ obj.age }}</td><td>{{ obj.account }}</td><td>{{ obj.create_time|date:"Y-m-d" }}</td><td>{{ obj.get_gender_display }}</td><td>{{ obj.depart.title }}</td><td><a class="btn btn-primary btn-xs" href="/depart/{{ obj.id }}/edit/">编辑</a><a class="btn btn-danger btn-xs" href="/depart/delete/?nid={{ obj.id }}">删除</a></td></tr>{% endfor %}</tbody></table></div>
</div>
{% endblock %}- user_add.html
{% extends 'layout.html' %}
{% block content %}
<div class="container"><div class="panel panel-default"><div class="panel-heading"><h3 class="panel-title">新建用户</h3></div><div class="panel-body"><form method="post">{% csrf_token %}<div class="form-group"><label>姓名</label><input type="text" class="form-control" placeholder="姓名" name="name"/></div><div class="form-group"><label>密码</label><input type="text" class="form-control" placeholder="密码" name="password"/></div><div class="form-group"><label>年龄</label><input type="text" class="form-control" placeholder="年龄" name="age"/></div><div class="form-group"><label>余额</label><input type="text" class="form-control" placeholder="余额" name="account"/></div><div class="form-group"><label>入职时间</label><input type="text" class="form-control" placeholder="入职时间" name="create_time"/></div><div class="form-group"><label>性别</label><!--class="form-control"可以让选择框继续占满屏幕而非仅一小块--><select class="form-control" name="gender">{% for obj in gender_choice %}<option value="{{ obj.0 }}">{{ obj.1 }}</option>{% endfor %}</select></div><div class="form-group"><label>部门</label><select class="form-control" name="department">{% for obj in depart_list %}<option value="{{ obj.id }}">{{ obj.title }}</option>{% endfor %}</select></div><button type="submit" class="btn btn-primary">提 交</button></form></div></div>
</div>
{% endblock %}- user_modelform_add.html
{% extends 'layout.html' %}
{% block content %}<div class="container"><div class="panel panel-default"><div class="panel-heading"><h3 class="panel-title">新建用户</h3></div><div class="panel-body">
{# <!--加novalidate可以让浏览器去掉自动校验-->#}<form method="post" novalidate>
{# <form method="post">#}{% csrf_token %}{% for field in form %}<div class="form-group"><label>{{ field.label }}</label>{{ field }}<span style="color: red">{{ field.errors.0 }}</span></div>{% endfor %}<button type="submit" class="btn btn-primary">提 交</button></form></div></div>
</div>
{#<form method="GET">#}
{# {% csrf_token %}#}
{##}
{# <!--form.字段，可以直接生成对应的输入框，.label可以关联字段的verbose_name进行显示-->#}
{# {{ form.name.label }}: {{ form.name }}#}
{# {{ form.password.label }}: {{ form.password }}#}
{# {{ form.age.label }}: {{ form.age }}#}
{# {% for field in form %}#}
{# {{ field.label }}: {{ field }}#}
{# {% endfor %}#}
{##}
{#</form>#}
{% endblock %}7. 效果图
- 部门列表（/depart/list/）
- 新建部门（/depart/add/）
- 编辑部门（/depart/i/edit/）
- 用户列表（/user/list/）
- 新建用户（/user/add/）
- 新建用户ModelForm版本（/user/modelform/add/）
Web开发day5：项目相关推荐
- Java EE Web开发与项目实战_【手把手】JavaWeb 入门级项目实战 -- 文章发布系统 （第一节）...
312334546574820.jpg 序 前一段时间有很多朋友来问我各种问题,比如java怎么学,c,c++,c#,java,还有php等等,到底学哪个好,哪个好就业?其中不乏刚毕业找不到工作的学生 ...
- （三十一）web 开发基础项目
1. 编写index.jsp 1 <%@ page language="java" contentType="text/html; charset=UTF-8&qu ...
- 现代 Web 开发的现状与未来
作者:Dexter.Yy 原文:https://zhuanlan.zhihu.com/p/88616149 本文是我受邀在台北的 JSDC 2019 活动中做的一次分享,从内容上来说已经可以算的上我的 ...
- 现代 Web 开发的现状与未来（JSDC 2019 演讲全文）
作者:杨杨 - 字节跳动前端工程师 JS黑客,GUI大法师,WebApp工匠,虚拟世界建筑师,奇幻科幻PC游戏动漫宅 本文是我受邀在台北的 JSDC 2019 活动中做的一次分享,从内容上来说已经可以 ...
- web开发——3.数据模型概念
1-1 主要内容 数据库相关回顾 数据类型的概念 数据类型的定义 数据类型的查询[单表查询] 1-2 课程内容 1. 复习回顾 1.1. 概念整理回顾 a. Django有什么样的开发优势? Djan ...
- python web项目案例教程_Python Web开发案例教程（慕课版）——使用Flask、Tornado、Django...
第1章 Web开发基础1 1.1 Web概述 2 1.1.1 什么是Web 2 1.1.2 Web应用程序的工作原理 2 1.1.3 Web的发展历程 2 1.2 Web前端开发基础 4 1.2.1 ...
- Java框架JSON-RPC项目demo代码实战 + JAVA WEB配置虚拟目录（转自21天java web开发）
Java框架JSON-RPC项目demo代码实战 备注 JAVA WEB配置虚拟目录(转自21天java web开发) https://blog.csdn.net/wjxbj/article/det ...
- Python做web开发，推荐几个能立马上手的小项目
Python这门优美的语言是非常适合web开发的,基于Python的Django框架简单便捷且很强大. 那么作为新手该如何上手这门语言?一切不敲代码的学编程手段都是扯淡,今天就推荐一些适合新手练手的P ...
- Java web 开发的概念、环境配置、创建项目过程详解（Eclipse）
Java Web 开发 Java Web 开发概念 搭建过程 详解 在eclipse创建Dynamic Web Project 创建时选择Tomcat的版本 创建项目成功 eclipse环境下如何配置 ...
最新文章
- 运行从别处复制过来的linux可执行程序
- 大数据中心周边辐射大吗_PETCT有辐射，PETCT对陪同人员的影响大吗？
- zend studio 函数不提醒 小黄图标 小黄标
- 三月疯狂——最终结果 / March Madness – Final Score
- 【踩坑速记】开源日历控件，顺便全面解析开源库打包发布到Bintray/Jcenter全过程（新），让开源更简单~...
- 1000道Python题库系列分享十二（9道编程题）
- 解释一下pack和unpack
- python redis pipeline 堆积_Redis Pipeline python
- python编程最大公约数_Python 求两个数的最大公约数
- 解决iTerm中‘zsh-syntax-highlighting‘找不到的问题
- 能源消耗总量计算公式_能源统计
- SICP 第一章的练习
- SaaS行业的六大安全问题
- delphi异步与javascript
- 新华三：助力IPv6部署，我们责无旁贷
- 前端原生下载excel表格
- 编写操作norflash的裸机程序
- docker搭建c++开发环境
- 永磁同步电机矢量控制（四）——速度环 PI 参数整定(二)
- Linux 网卡操作