前端介绍

一、什么是前端

"""
任何与用户直接打交道的操作界面都可以称之为前端  比如电脑界面、手机界面、平板界面

什么是后端
    后端类似于幕后操作者（功能实现的逻辑代码），不直接与用户打交道
"""

二、为什么学前端

"""
全栈开发，前后端都会
    但是前端不会学的很详细，只要求做到能够看得懂基本的前端代码以及能够搭建一些简单的页面即可
    先打下前端的基础，为后续可能需要拓展做准备
"""

三、前端学习历程

# 一、基本语法
    HTML:网页的骨架、内容，没有任何的样式
    CSS：网页的外观、样式（给骨架添加各种样式，变得好看）
    JS：控制网页实现动态效果
    
# 二、前端框架
    Bootstrap、jQuery、Vue 等
    提前给你封装好了很多操作，你只需要按照固定的语法句式即可

四、web服务本质及Http协议

软件开发架构
cs  客户端  服务端
bs  浏览器  服务端

ps：bs模式本质也是cs

1.网页访问过程

浏览器窗口输入网址回车发生了几件事：

"""
1. 浏览器朝服务端输入网址请求（eg:请求百度首页）
2. 服务端接受请求
3. 服务端返回相应的响应（eg:返回一个百度首页）
4. 浏览器接受响应，根据特定的规则渲染页面展示给用户看
"""

浏览器可以充当很多服务端的客户端
    百度  腾讯视频 优酷视频
    
如何做到浏览器能够跟多个不同的服务端之间进行数据交互？
    1.浏览器很牛逼  能够自动识别不同服务端做不同处理
    2.制定一个统一的标准。（如果你想要让你写的服务端能够跟浏览器之间做正常的数据交互，那么你就必须遵循这个标准）

2.HTTP协议（必须记住）

"""
HTTP 超文本传输协议  用来规定服务端和浏览者之间的数据交互格式

    该协议你可以不遵循，但是你写的服务端就不能被浏览器正常访问，你就自己跟自己玩，你自己写客户端，用户想要使用，就下载你专门的app即可
"""

四大特性

1. 基于TCP/IP的协议	   
    作用于应用层之上的协议    
2. 被动响应			    
    基于请求，才响应；不请求，则不会响应
3. 短连接				 
    请求响应后，就断开链接
    	延伸出：长链接（双方建立链接后，就不会断开） eg：聊天室（websocket）
4. 无状态				 
    对于事务处理没有记忆功能，不会保存用户的信息
    	延伸出：可以记住用户状态的技术 eg：cookie、session、token

请求数据格式

请求首行 （包含标识HTTP协议版本、当前请求方式）
请求头	  （一大堆K,V键值对）	
 # 空行   （一定要有一个空行:/r/n)
请求体    （并不是所有请求方式都有请求体，eg：get 无；post 有 存放的是post请求提交的敏感数据）

响应数据格式

响应首行 （包含标识HTTP协议版本、响应状态码）
响应头	  （一大堆K,V键值对）	
 # 空行   （一定要有一个空行:/r/n)
响应体    （返回给浏览器展示给用户看的数据）

请求方式

1. get请求
    超服务端要数据   
    eg：输入网址获取对应的内容

2. post请求
    超服务端提交数据
    eg：用户登录，输入用户名和密码之后，提交到服务端后端做身份校验

响应状态码

用一串简单的数字来表示一些复杂的状态或描述性信息

eg：
 1xx >>> 服务端已经成功接受到了你的数据正在处理，你可以继续提交额外的数据
 2xx >>> 服务端成功响应了你想要的数据 （200 OK 请求成功）
 3xx >>> 重定向(自动跳转到其他链接请求的页面 eg:当你在访问一个需要登录之后才能看的页面，你会发现会自动跳转到登录页面)
 4xx >>> 请求错误
    404： 请求资源不存在
    403： 当前请求不合法或者不符合访问资源的条件
 5xx >>> 服务器内部错误（500 服务器出错）   

URL

统一资源定位符  （俗称：网址）