每日测验
"""
每日测验
1.你所知道的前端框架和实用插件有哪些，他们各有什么特点
2.使用bootstrap需要注意什么，常用的bootstrap样式有哪些
"""
昨日内容回顾
-
阻止后续事件发生
# 第一种(常用) return false # 第二种 e.preventDefault() # 记form表单触发提交动作的按钮 -
事件冒泡
# 第一种(常用) return false # 第二种 e.stopPropagation() -
事件委托
# 针对标签无论是事先写好的还是后续动态创建的 $('#d1').on('click','button',function(){}) -
页面加载
# 第一种 $(document).ready(function(){}) # 第二种 $(function(){}) # 第三种 """body内部最下方""" -
动画效果(了解)
""" show hide slideUp slideDown fadeIn fadeOut fadeTo ... """ -
需要掌握的
# each() $('div').each(function(index,obj){return [index,obj]}) $.each($('div',function(index,obj){return [index,obj]}) # data() $('div').data('key') # 获取 $('div').data('key','value') # 设置 $('div').removeData('key') -
前端框架及插件
# 使用bootstrap """ 使用boostrap调节样式其实就是写类属性 1.布局容器 container container-fluid 2.栅格系统 row 一行均分12份 col-md-N 占几份 响应式布局 col-md-offset-2 移动 pull-right/left 浮动 3.表格 table table-hover table-bordered table-striped 4.表单 form-control checkbox和radio不要加 5.按钮 btn btn-primary btn-sm/btn-xs btn-block success info warning danger default ... 6.导航条 7.分页 8.面板 9.模态框 """ # 就是拷贝+修改 """ 第三组件扩展 图标 fontawesome 弹出框 sweetalert """
今日内容概要(重要)
- 我们自己写一个简易版本的web框架(代码无需掌握，重点在于理解思路)
- django框架
今日内容详细
前端
数据库
前端 后端 数据库
# 后端学不好 工作不好找
软件开发架构
cs架构
bs架构
# 本质bs也是cs
纯手撸web框架
# HTTP协议
"""
网络协议
HTTP协议 数据传输是明文
HTTPS协议 数据传输是密文
websocket协议 数据传输是密文
四大特性
1.基于请求响应
2.基于TCP、IP作用于应用层之上的协议
3.无状态
4.短/无链接
数据格式
请求首行
请求头
请求体
响应状态码
1XX
2XX 200
3XX
4XX 403 404
5XX 500
"""
# 如何做到后缀的不同返回不同的内容
# 拿到用户输入的后缀 做判断
# 不足之处
1.代码重复(服务端代码所有人都要重复写)
2.手动处理http格式的数据 并且只能拿到url后缀 其他数据获取繁琐(数据格式一样处理的代码其实也大致一样 重复写)
3.并发的问题
借助于wsgiref模块
"""urls.py 路由与视图函数对应关系views.py 视图函数(后端业务逻辑)templates文件夹 专门用来存储html文件"""# 按照功能的不同拆分之后 后续添加功能只需要在urls.py书写对应关系然后取views.py书写业务逻辑即可
动静态网页
"""静态网页 页面上的数据是直接写死的 万年不变动态网页 数据是实时获取的 eg: 1.后端获取当前时间展示到html页面上 2.数据是从数据库中获取的展示到html页面上"""# 动态网页制作import datetimedef get_time(env): current_time = datetime.datetime.now().strftime('%Y-%m-%d %X') # 如何将后端获取到的数据"传递"给html文件？ with open(r'templates/03 mytime.html','r',encoding='utf-8') as f: data = f.read() # data就是一堆字符串 data = data.replace('dwadasdsadsadasdas',current_time) # 在后端将html页面处理好之后再返回给前端 return data# 将一个字典传递给html文件 并且可以在文件上方便快捷的操作字典数据from jinja2 import Templatedef get_dict(env): user_dic = {'username':'jason','age':18,'hobby':'read'} with open(r'templates/04 get_dict.html','r',encoding='utf-8') as f: data = f.read() tmp = Template(data) res = tmp.render(user=user_dic) # 给get_dict.html传递了一个值 页面上通过变量名user就能够拿到user_dict return res# 后端获取数据库中数据展示到前端页面
模版语法之Jinja2模块
pip3 install jinja2"""模版语法是在后端起作用的"""# 模版语法(非常贴近python语法){{ user }}{{ user.get('username')}}{{ user.age }}{{ user['hobby'] }}{% for user_dict in user_list %} <tr> <td>{{ user_dict.id}}</td> <td>{{ user_dict.username}}</td> <td>{{ user_dict.password}}</td> <td>{{ user_dict.hobby}}</td> </tr>{% endfor%}
自定义简易版本web框架请求流程图
"""wsgiref模块 1.请求来的时候解析http格式的数据 封装成大字典 2.响应走的时候给数据打包成符合http格式 再返回给浏览器"""
python三大主流web框架
"""django 特点:大而全 自带的功能特别特别特别的多 类似于航空母舰 不足之处: 有时候过于笨重flask 特点:小而精 自带的功能特别特别特别的少 类似于游骑兵 第三方的模块特别特别特别的多，如果将flask第三方的模块加起来完全可以盖过django 并且也越来越像django 不足之处: 比较依赖于第三方的开发者 tornado 特点:异步非阻塞 支持高并发 牛逼到甚至可以开发游戏服务器 不足之处: 暂时你不会"""A:socket部分B:路由与视图函数对应关系(路由匹配)C:模版语法django A用的是别人的 wsgiref模块 B用的是自己的 C用的是自己的(没有jinja2好用 但是也很方便)flask A用的是别人的 werkzeug(内部还是wsgiref模块) B自己写的 C用的别人的(jinja2)tornado A，B，C都是自己写的
注意事项
# 如何让你的计算机能够正常的启动django项目 1.计算机的名称不能有中文 2.一个pycharm窗口只开一个项目 3.项目里面所有的文件也尽量不要出现中文 4.python解释器尽量使用3.4~3.6之间的版本 (如果你的项目报错 你点击最后一个报错信息 去源码中把逗号删掉) # django版本问题 1.X 2.X 3.X(直接忽略) 1.X和2.X本身差距也不大 我们讲解主要以1.X为例 会讲解2.X区别 公司之前用的1.8 满满过渡到了1.11版本 有一些项目用的2.0 # django安装 pip3 install django==1.11.11 如果已经安装了其他版本 无需自己卸载 直接重新装 会自动卸载安装新的 如果报错 看看是不是timeout 如果是 那么只是网速波动 重新安装即可 验证是否安装成功的方式1 终端输入django-admin看看有没有反应
django基本操作
# 命令行操作 # 1.创建django项目 """ 你可以先切换到对应的D盘 然后再创建 """ django-admin startproject mysite mysite文件夹 manage.py mysite文件夹 __init__.py settings.py urls.py wsgi.py # 2.启动django项目 """ 一定要先切换到项目目录下 cd /mysite """ python3 manage.py runserver # http://127.0.0.1:8000/ # 3.创建应用"""Next, start your first app by running python manage.py startapp [app_label].""" python manage.py startapp app01 应用名应该做到见名知意 user order web ... 但是我们教学统一就用app01/02/03/04 有很多文件 # pycharm操作 # 1 new project 选择左侧第二个django即可 # 2 启动 1.还是用命令行启动 2.点击绿色小箭头即可 # 3 创建应用 1.pycharm提供的终端直接输入完整命令 2.pycharm tools run manage.py task提示(前期不要用 给我背完整命令) # 4 修改端口号以及创建server edit confi....
应用
"""django是一款专门用来开发app的web框架django框架就类似于是一所大学(空壳子)app就类似于大学里面各个学院(具体功能的app) 比如开发淘宝 订单相关 用户相关 投诉相关 创建不同的app对应不同的功能 选课系统 学生功能 老师功能一个app就是一个独立的功能模块"""***********************创建的应用一定要去配置文件中注册**********************INSTALLED_APPS = [ 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'app01.apps.App01Config', # 全写 'app01', # 简写]# 创建出来的的应用第一步先去配置文件中注册 其他的先不要给我干ps:你在用pycharm创建项目的时候 pycharm可以帮你创建一个app并且自动注册***********************************************************************
主要文件介绍
-mysite项目文件夹 --mysite文件夹 ---settings.py 配置文件 ---urls.py 路由与视图函数对应关系(路由层) ---wsgi.py wsgiref模块(不考虑) --manage.py django的入口文件 --db.sqlite3 django自带的sqlite3数据库(小型数据库 功能不是很多还有bug) --app01文件夹 ---admin.py django后台管理 ---apps.py 注册使用 ---migrations文件夹 数据库迁移记录 ---models.py 数据库相关的 模型类(orm) ---tests.py 测试文件 ---views.py 视图函数(视图层)
命令行与pycharm创建的区别
# 1 命令行创建不会自动有templatew文件夹 需要你自己手动创建而pycharm会自动帮你创建并且还会自动在配置文件中配置对应的路径# pycharm创建TEMPLATES = [ { 'BACKEND': 'django.template.backends.django.DjangoTemplates', 'DIRS': [os.path.join(BASE_DIR, 'templates')]]# 命令行创建TEMPLATES = [ { 'BACKEND': 'django.template.backends.django.DjangoTemplates', 'DIRS': [],]"""也就意味着你在用命令创建django项目的时候不单单需要创建templates文件夹还需要去配置文件中配置路径'DIRS': [os.path.join(BASE_DIR, 'templates')]"""
django小白必会三板斧
"""HttpResponse 返回字符串类型的数据render 返回html文件的redirect 重定向 return redirect('https://www.mzitu.com/') return redirect('/home/')"""
作业
"""1.整理web框架推导思路2.安装django并正常启动访问，测试三板斧3.整理今日日考题，django内容选做题1.结合前端，django，MySQL，pymysql模块实现数据库数据动态展示到前端2.尝试着摸索django模版语法"""