明确：前端是做什么的？
不管是前端还是后台工程师都是进行软件开发的；
1、软件的架构？
软件的架构：
C/S架构
B/S架构（前端）
1、C/S ==> 客户端（Client）/ 服务器（Server）
服务器：用于处理业务逻辑；
如用户通过网络连接远程服务器再传输给另一端：例如：两个人用QQ聊天，一端发送到服务器中转再传输到另一端；
特点：
（1）软件使用前必须安装；
（2）软件更新时，服务器与客户端同时更新；
（3）软件不能跨平台（例如 不同系统，不同设备如手机电脑）使用；
（4）一般系统软件都是CS架构的（比如安卓系统等）；
安全性：客户端和服务器采用的是 自有协议（相当于密码本，两方通信），相对比较安全；
2、B/S ==> 浏览器（Browsers）/ 服务器（Server）
B/S架构本质上也属于C/S架构，B/S架构的软件一般通过访问一个页面形式来使用；
使用浏览器作为软件客户端，通过浏览器访问网页的形式访问软件，而将一些运算操作放到远端服务器上，这样降低了对客户端的要求，只需计算机安装一个浏览器即可；我们所学习的前端属于B/S；
特点：
（1）软件使用不需要安装，直接浏览器访问网址即可；
（2）软件更新时，客户端不需要更新，远端服务器更新即可；
（3）可以跨平台使用，只要系统中有浏览器软件即可，成本相对低；
（4）既是应用类独立软件，也是网页版能打开的网页（如京东，淘宝）；
安全性：客户端和服务器采用的是 HTTP协议（不太安全），有另一种协议 https 相对安全（如网银）；
2、软件开发流程
1、流程：用户提需求——美工PS设置网页（图）——前端做成静态网页（代码链接）——后台工程师改为动态网页（JSP服务器代码）；
2、工作模式：前端提需求，后台提供服务器代码，而不让他改，自己排版代码，以防自己设计好的格局错乱；
3、任务：前端编写的网页会在整个项目的最前端由用户查看，所以前端工程师需要和各个部分的工程师进行衔接与沟通；
4、体系：前端是入门简单，后面难，学的东西多，需要不断吸取知识，杂而不深；java是入门难，后面简单，深而不杂；若前端和后台都可以写则属于全栈工程师；
3、W3C万维网联盟标准
三项技术：结构<html>——表现<css>——行为<javascript>
1、结构-HTML5：超文本标记语言，核心规范，描述页面的结构，以怎样的方式排版，例如标题、段落，相当于人的骨架（简单）；
2、表现-CSS ：层叠样式表，控制页面中元素的样式，以怎样的方式来表现页面，例如颜色、字体大小等，相当于人的皮肤，页面中所有能看见的东西都是css（学的东西多）；
3、行为-JavaScript：动态支持脚本代码,用来响应用户操作，动态，点一个链接出现什么，相当于人的动作（难，面试，考点）；
4、网页
1、网站是指在因特网上根据一定的规则，使用 HTML 等制作的用于展示特定内容相关的网页集合。
2、网页是网站中的一“页”，通常是 HTML 格式的文件，它要通过浏览器来阅读。
3、网页是构成网站的基本元素，它通常由图片、链接、文字、声音、视频等元素组成。通常我们看到的网页，常见以 .htm 或 .html 后缀结尾的文件，因此将其俗称为 HTML 文件。
5、浏览器内核
浏览器是网页显示、运行的平台。常用的浏览器有 IE、火狐（Firefox）、谷歌（Chrome）、Safari和Opera。
主流内核分为以下几个：
| 浏览器 | 内核 | 备注 |
|---|---|---|
| IE | Trident | IE、猎豹安全、360极速浏览器、百度浏览器 |
| firefox | Gecko | 可惜这几年打开速度慢、升级频繁、 |
| Safari | webkit | 现在很多人错误地把 webkit 叫做 chrome内核（即使 chrome内核已经是 blink 了）。 |
| chrome | Chromium/Blink | 在 Chromium 项目中研发 Blink 渲染引擎（即浏览器核心），内置于 Chrome 浏览器之中。Blink 其实是 WebKit 的分支。大部分国产浏览器最新版都采用Blink内核。二次开发 |
| Opera | Presto | Presto（已经废弃） 是挪威产浏览器 opera 的 "前任" 内核，为何说是 "前任"，因为最新的 opera 浏览器早已将之抛弃从而投入到了谷歌怀抱了。 现在用blink内核。 |
