前端 Web
什么是前端?
"""
前端即网站的前台部分,运行在PC端,移动端等浏览器上展现给用户浏览的网页,随着互联网技术的发展,HTML5,CSS3,前端框架的应用,跨平台响应式网页设计能够适应各种屏幕分辨率,完美的动效设计,给用户带来极高的用户体验.
前端技术一般分为 前端设计和前端开发,前端设计一般可以理解为网站的视觉设计,前端开发则是网站的前台代码实现,包括基本的html和css以及JavaScript.
任何和用户打交道的操作界面都可以被称之为前端
比如: 电脑界面 手机界面 平板界面
"""
什么是后端?
"""
后端是一些类似于幕后的操作(一推让人头皮发麻的代码),将数据送往前端,不直接和用户打交道
"""
前端学习历程
"""
HTML: 网页的骨架, 没有任何的样式
CSS: 给骨架添加各种样式 变得'好看'
JavaScript: 控制页面的动态效果
"""
HTML
"""
超文件标记语言 hyper text markup language
'超文本'就是指页面内可以包含图片,链接,甚至音乐,程序等非文字元素
负责完成页面的结构
"""
CSS
"""
级联样式表 Cascading Style Sheet
负责页面的风格设计,样式,美观
"""
JavaScript
"""
浏览器脚本语言,可以编写运行在浏览器上的程序
真正的编程语言
负责编写页面特效,调用浏览器的API(BOM),操作改变页面内容(DOM),从后端获取数据(Ajax),渲染页面等.
jQuery,BOOTSTRAP是JavaScript的一个库
Vue,Angular,React等说JavaScript框架
"""
软件开发架构
"""
C/S 客户端 服务端
B/S 浏览器 服务器
B/S是一种特殊的C/S,浏览器的市场以及被安排的差不多就那几个了,我们使用它们的浏览器即可
"""
HTTP协议
"""
超文本传输协议 用来规定服务端和浏览器之间的数据交互格式...
该协议你可以不遵循 但是你写的服务端就不能被浏览器正常访问,你就是一个单击程序了
你不想遵循就得自己写一款客户端软件 用户想要使用,就下载你专门的app即可.
"""
"""
四大特性:
1. 基于请求响应. 向服务端发送请求,服务端响应客户端请求.
2. 基于TCP/IP之上的作用于应用层的协议
3. 无状态: 不保存用户的信息
举例:liu这个人来了一千次 你都记不住 每次都当他如初见.
拓展: 由于HTTP协议是无状态的 所以后续出现了一些专门用来记录用户状态的技术,
如: cookie,session,token...
4. 无链接短链接
请求来一次我就响应一次 之后我们俩个就没有任何链接和关系
扩展:长链接.之后出现了websocket可以实现长链接,可以让双方建立连接之后默认不断开,可以实现"群聊功能,服务端主动给客户端发送消息
"""
"""
请求数据格式
请求首行 -- 标识HTTP协议版本.当前请求方式
请求头 -- 一大堆k,v键值对
请求体 -- 并不是所有的请求方式都有.get没有post有,post存放的是请求提交的敏感数据.
"""
"""
响应数据格式
响应首行 -- 标识HTTP协议版本,响应状态码
响应头 -- 一大堆k,v键值对
响应体 -- 返回给浏览器展示给用户看的数据
"""
"""
响应状态码: 用一串简单的数字来标识一些复杂的状态或者描述性信息
例如:
返回响应状态码为404,表示请求资源不存在.
1xx: 信息 -- 表示服务器收到请求,需要请求者继续执行操作.
2xx: 成功 -- 操作被服务器成功接收并处理
200 ok 表明该请求被成功的完成,所请求的资源发送回客户端.
3xx: 重定向.-- 需要进一步的操作以完成请求.
如: 当你在访问一个需要登录之后才能看到的页面, 你回发现自动跳转到登录页面
4xx: 客户端请求错误, 请求包含语法错误或无法完成请求
404: -- 请求资源不存在 服务器无法根据客户端的请求找到对应的网页资源
403: -- 服务器理解请求客户端的请求, 但是拒绝执行此请求.
如:当前请求不合法或者不符合访问资源的条件.
如: 这是千万级别的俱乐部, 只有999万的你被限制无法进入
5xx: -- 服务器内部问题
500: 服务器内部错误, 无法完成请求
补充: 上述的状态码是HTTP协议规定的,其实到了公司之后每个公司还会自己定制自己的状态即提示信息
"""
"""
请求方式:
1. get请求: 到服务端要数据.
如: 输入网址获取对应的内容.
2. post请求: 往服务端提交数据
如: 用户登录 输入用户名和密码之后 提交到服务端后端做身份校验
get和post方法的区别
1. get提交的数据会放在url之后,以?分割url和传输数据,参数之间以&相连
如: https://www.baidu.com/s?ie=utf8&oe=utf8&tn=98010089_dg&ch=11&wd=%E7%99%BE,POST方法是把提交的数据放在HTTP包的Body中.
2. get提交的数据大小有限制 (因为浏览器对url的长度有限制),而post方法提交的数据没有限制.
3. get方式提交数据,会带来安全问题,比如一个登录页面.通过get方式提交数据时,用户名和密码将出现在url上,如果页面可以被缓存或者其他人可以访问这台机器，就可以从历史记录获得该用户的账号和密码.
"""
"""
url:统一资源定位符(网址)
形式: scheme:
[//[user:password@]host[:port]]
[/]path[?query-string][#anchor]
提示: 方框内的参数为可选部分
参数介绍:
scheme: 协议(如: http,https,ftp)
user: password@用户的登录名以及密码
host: 服务器的ip地址或者域名
port: 服务器的端口 -- 如果是走协议默认端口,http80 or https 443
path: 访问资源的路径
query-string: 参数,它通常使用键值对来制定发送给http服务器的数据
anchor: 锚 -- 跳转到网页的指定锚点位置
"""