1,系统架构:
B/S架构:
Browser / Server (浏览器 / 服务器的交互形式)
Brower支持哪些语言:HTML ,CSS ,JavaScript
写HTML ,CSS ,JavaScript代码的这些人的职位是:WEB前端开发工程师。
前端页面上的图片需要UI设计师完成。
S是服务器端Server,Server端的语言很多:C C++ Java python......
B/S架构的结构组成:
浏览器端:即用户使用的浏览器,是用户操作系统的接口,用户通过浏览器界面向服务器端提出请求,并对服务器端返回的结果进行处理并展示,通过界面可以将系统的逻辑功能更好的表现出来。
服务器端:提供数据服务,操作数据,然后把结果返回中间层,结果显示在系统界面上。
中间件:这是运行在浏览器和服务器之间的。这层主要完成系统逻辑,实现具体的功能,接受用户的请求并把这些请求传送给服务器,然后将服务器的结果返回给用户,浏览器端和服务器端需要交互的信息是通过中间件完成的。
B/S架构的优缺点
B/S架构的系统有什么优点和缺点:
优点:升级方便,只升级服务器端代码即可。维护成本低。
缺点:速度慢(所有东西都得从服务器端传过来),体验不好 ,界面不够炫酷
企业内部的解决方案都是采用B/S架构的系统,因为企业内部办公需要的一些系统不需要炫酷,不需要特别好的用户体验,只要能做到数据的增删改查即可,并且企业内部更注重维护成本。
B/S架构的系统有哪些代表:
京东,百度,天猫......(它们也做了C/S架构)
C/S架构:
C/S架构的结构:
Client /Server (客户端 /服务器的交互形式)
C/S架构是常用的两层架构,通常也称之为客户端/服务器架构。
服务器运行服务端程序,客户端安装客户端软件。
在此架构里服务端和客户端分别完成不同的任务,客户端处理用户的前端界面和交互操作,服务端处理后台业务逻辑和请求数据,这使得两端的通讯速度和通讯的效率大大的提高
C/S架构的优缺点:
缺点:升级麻烦,维护成本高
优点:速度快,体验好,界面炫酷(娱乐型的系统多数是C/S架构的。)
常见的C/S架构的系统:
QQ,微信,支付宝......
HTML:
什么是HTML?
HTML:Hyper Text Markup Language(超文本标记语言)
由大量标签组成,每一个标签都有开始标签和结束标签。
<标签>
<标签>
<标签 属性名="属性值" 属性名="属性值">
</标签>
</标签>
</标签>
超文本:流媒体,图片,声音,视频....
*HTML开发的时候使用普通的文本编辑器就行,创建的文件扩展名是 .html 或者 .htm
HTML也有专业的开发工具
*直接采用浏览器打开HTML文件就是运行。
3,HTML是谁制定的:
W3C:世界万维网联盟
W3C制定了HTML的规范,每个浏览器生产商家都会遵守。
HTML程序员也会按照这个规范去写代码。
w3school,w3cschool:
为了方便中国web前端程序员开发,提供大量的帮助文档。为了开发提供方便的一个网站。
和W3C没有关系。
编写HTML过程:
1,创建一个普通的文本文件,改变文件后缀名为.html
2,选择打开方式为普通文本,开始编写代码。
<HTML>
<head>
<title>网页的标题</title>
</head>
<body>
网页的主体内容,开始学习HTML!
</body>
</HTML>
3,保存,使用浏览器打开该文件。
HTML的注释:
<!--
内容
-->
注意:HTML不区分大小写,语法松散不严格
如果在跟标签(<html>)上添加<!doctype html>
表示的是HTML版本是html5,没加就是HTML4.0
<!--
1,这是HTML的注释
2,加上以下代码的第一行就表示HTML5的语法,没加就是HTML4.0
-->
<!doctype html>
<!--根-->
<HTML>
<!--头-->
<head>
<!--网页标题,显示在网页左上角-->
<title>网页的标题</title>
</head>
<!--体-->
<body>
网页的主体内容,开始学习HTML!
</body>
</HTML>
浏览器打开文件的字符编码方式:
可以在head内写上以下标签:
告诉浏览器用何种字符集方式打开当前页面:
<meta charset="UTF-8">
注意:
UTF-8是可选的,按照文本的编辑字符的方式选择。
如果字符编码方式书写和读取不一致,会导致乱码。