前端
什么是前端？
前端就是用户可以直接看得到的视图层就是前端
什么是后端？
后端是和数据打交道的，在用户看不到的
前端学习的内容
"""前端三剑客"""
HTML：一个网页的骨架，没有任何样式
CSS：给一个网页添加样式，让其变得更加美观
JavaScript：让网页有动效
前端框架：
jQuery、bootstrap、Vue----->中国人开发的（尤雨溪）、react、angluar等等
在浏览器中我们是如何拿到自己想要的想要的数据？
"""
1、客户端（浏览器）向服务器发送请求
2、服务端接受浏览器的请求
3、服务器将处理好的前端要的数据进行返回
4、把数据返回给前端---->在浏览器中，按照一定的规则把后端的数据展示给用户
"""
"""
如果我们写一个服务端，让浏览器充当服务端的客户端，那么也可以写一个基于浏览器的项目,但是会发现当我们浏览这个网址的时候会显示无响应，这是因为如果我们返回的数据想要被浏览器识别，必须要遵循HTTP协议
"""
HTTP协议
HTTP协议又被称为"超文本传输协议"，其作用就是规定了服务端与客户端（浏览器）之间的数据传输格式
常见的协议："TCP协议、UDP协议、IP协议、以太网协议等"
HTTP协议的四大特性：
1、是基于请求和响应的---->请求：客户端主动向服务端发送请求----->响应：服务端向客户端返回
2、HTTP协议是基于TCP/IP协议之上的应用层协议
"HTTP协议是基于TCP协议写出来的"
3、无状态：
"无法保存用户的信息"
4、短连接/无连接
短连接：
当服务端和客户端要想传输数据就必须建立连接，正常情况。二次成功发送一次消息就断开连接，称之为"短连接"
长连接：
二者成功发送一次消息之后，不会立马断开连接，而是中间隔一段时间，如果双方没有通信就会断开连接，称之为"长连接"
"""客户端向服务端发起请求会携带一些数据，就称之为请求数据"""
HTTP协议的请求数据格式：
# 常用的版本号就是HTTP1.X版本
请求首行（请求方式、协议/版本号）
请求头
\r\n
请求体(不是什么请求方式都有请求体，GET请求方式就没有)
HTTP的相应数据格式：
响应首行（响应状态码）
响应头
\r\n
响应体
响应状态码：
"""简单描述就是使用一个简单的数字代表一段复杂的描述性信息"""
1xx：了解，服务端接收数据成功，客户端还可以继续提交
2xx：掌握，200代表的是响应成功
3xx：301、302代表的是重定向，代码内部帮助我们跳转到指定页面
4xx：404，资源不存在，找不到，NO FOUND，404页面可以定制
5xx：500，服务器内部错误
请求方式："重要"
GET请求：
"""向服务器要数据的时候一般使用GET"""
https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&tn=49055317_42_hao_pg&wd=%E7%BE%8E%E5%A5%B3
协议：//域名/后缀?参数k=v&k1=v1....
URL："同意资源定位符号（网址）"
POST请求：
"""向服务器提交数据的时候，一般使用POST请求方式"""
****聊聊GET跟POST的请求区别：
1、get请求数据不够安全，post请求数据更加安全
2、get请求没有请求体，而post请求有请求体
3、get请求能够携带的数据量没有post请求携带的多
get请求一般携带4kb大小
post基本没有限制
import socket
server = socket.socket()
server.bind(('127.0.0.1', 8000))
server.listen(3)
while True:
sock, addr = server.accept()
data = sock.recv(1024)
print(data)
"""TCP协议的流式协议特征"""
sock.send(b'HTTP/1.1 200 OK \r\n\r\n')
'按照http协议的规格传出就看拿到我们服务端反馈过去的信息了'
# 给客户端返回服务端的数据
sock.send(b'HelloKitty')
sock.close()
HTML文档介绍
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
</body>
</html>
head标签写的不是给用户看得
body标签：给网页做定制的，给用户看得
title标签：网页名称
<link rel="stylesheet" href="css/my.css">：引入外部CSS
body中常用的标签
基本标签：
<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>
<b>这是粗体</b>
<i>这是斜体</i>
<u>这是下划线</u>
<s>这是删除线</s>
<p>段落标签1，<br> 换行，段落标签2</p>
<p>段落标签2</p>
<hr>这是水平线
块儿元素：
<独自占据一行，不管自身的大小>
像h1、p标签等等
行内元素：
<自身文本有多大就占多大，不会独占一行>
像<b></b> <i></i> <u></u>等等.
双标签：
<h1> </h1> 等等
单标签：
<br> <hr>
特殊字符：
内容 对应代码
空格
> >
< <
& &
¥ ¥
版权 ©
注册 ®
dive标签和spend标签
div、spend没有实际意义只是为了布局使用
<div>块儿级元素，给页面占布局</div>
<spend>行内元素，用来给文本内容占布局</spend>
标签的嵌套
<div> <!--dive是p标签的父标签-->
<p> <!--p是spend标签的父标签，是dive的子标签-->
<spend><!--spend是品标签的子标签，是dive的孙标签-->
</spend>
</p>
<p><!--p标签是div的子标签是p标签的兄弟标签，也是下面那个spend的兄弟标签-->
</p>
<spend></spend>
</div>
<!--
块级儿级元素能够嵌套所有的行内元素，块儿级元素也能够嵌套所有的块儿级元素。
行内元素不能够嵌套块儿级元素，但是可以嵌套所有的行内元素。
-->
