自我介绍

列夫一个来自广东的咸鱼

( 半角空格&ensp小，全角空格&emsp大)

一.前端的基本含义:

前端即网站前台部分，运行在PC端，移动端等浏览器上展现给用户浏览的网页。随着互联网技术的发展，HTML5，CSS3，前端框架的应用，跨平台响应式网页设计能够适应各种屏幕分辨率，完美的动效设计，给用户带来极高的用户体验

二.网页&前端:

网页是构成网站的基础单元，是承载各种网站应用的平台。通俗地说，您每天通过浏览器甚至部分APP上网冲浪所看到的就是网页，网页主要由文字、图像、超链接、文本、多媒体等元素构成。

前端开发是创建Web页面或app等前端界面呈现给用户的过程，通过HTML，CSS及javaScript以及衍生出来的各种技术、框架、解决方案，来实现互联网产品的用户界面交互。虽然现在前端技术栈百花齐放衍生出各种工具概念技术 ;在工程化与现代化的路上高歌猛进,但本质上还是做网页。就跟我们能源技术发展到了核能阶段，依然只是为了“烧开水“。

三.自学前端目标：

基础课程：HTML CSS javaScript (ECMAScript DOM BOM) AJAX HTML5 CSS3 ECMAScript6/7/8

应用课程：jQuery easyUI H5UI Nodejs React VUE wApp 移动端开发响应式开发 less/stylus artTemplate

工程课程：git&GitHub webpack yarn Babel typeScript 设计模式基础算法前端工程化前端自动化编程技巧

四.学习前端所需要用到的工具:

欲善其事必先利器，工具花样不在多，重点在人的技术本身。

最简化工具有 chrome浏览器、 vscode开发工具、pxCook量图器。后续随着课程推进，会慢慢介绍各种辅助工具，在这里就罗列，以免干扰新手小白。

1、浏览器工具

浏览器是网页的载体，是咱们前端工程师的主战场。浏览器常用的有 IE系列、火狐（FireFox）、谷歌（chrome）、Safari（苹果）、Opera等

2、开发工具

开发工具很多，用什么开发工具取决于你的个人喜好和业务所需平台。好的开发工具能够提升你的效率，但是无法提升你的技术实力。

3、协助工具

除了写代码的工具之外，我们还需要一些其他辅助类型的工具帮助我们更好的完成项目内容。比如切图工具量图工具数据监测工具代码管理工具等等, 当前我们只需要掌握PS和pxCook的使用。

五.前端全面技术构成

大体分为：状态管理、UI 组件、小程序、跨平台、框架层、编程语言、工程化、监控、测试和服务端。

六.开发工作环境与项目组组成

WEB开发是一个完整的体系，需要团队作业，明确分工。由各个岗位人员各司其职，共同开发和维护一个项目。

职业发展路线也广阔，你可以选择在一个业务领域深入耕耘，也可以选择全面提升技术栈深度和广度成为全栈工程师，先天条件比较好的可以深入架构研究进行算法架构 AI 图形等领域拓展。也可以走技术管理路线，产品路线。记住一句话 技术只是敲门砖想要有更多的收获必然要靠自己去打拼，坐吃山空不管什么行业都必然会被淘汰

七.学习方式方法

1 高效听课方法: 直播听课时除非特定需要不要跟着敲代码记录笔记更重要跟着思路走把逻辑和思想认真听懂课后对照视频和笔记进行练习

2 高效复习方法: 课后复习笔记及时完成作业遇到知识点模糊遗忘的部分针对性看录播视频每周休息时间进行笔记案例回顾复盘

3 高效学习方法: 听=> 记 => 练习=> 思考 => 寻找漏洞 => 回溯视频 => 记录笔记(重点) => 练习 => 试图讲解

4 高效提问方式: 使用什么技术实现什么效果的时候遇到了问题xxx 问题表现为xxx 已排查xxx点但是没有找到原因配上相关代码和效果截图

八. 深入浏览器和浏览器内核:

任何上过网的用户对浏览器是再熟悉不过了。只是用户看到仅仅只是浏览器本身，却很少能看到浏览器最核心的部分—浏览器内核。

1、IE浏览器(Internet Explorer)：
IE是微软公司旗下浏览器，是目国内用户量最多的浏览器。IE诞生于1994年，当时微软为了对抗市场份额占据将近百分之九十的网景Netscape Navigator，于是在Windows中开发了自己的浏览器Internet Explorer，自此也引发了第一次浏览器大战。结果可想而知，微软大获全胜，网景不得不将自己卖给AOL公司。但实际上事情并没有结束，网景后来开发了风靡一时的Firefox火狐，至今Firefox也成为世界五大浏览器之一。
1996年，微软从Spyglass手里拿到Spyglass Mosaic的源代码和授权，开始开发自己的浏览器IE。后来，微软以IE和Windows捆绑的模式不断向市场扩展份额，使IE成为市场的绝对主流。现在装了Windows系统的电脑基本无法卸载IE。

2、Opera浏览器：
Opera是挪威Opera Software ASA公司旗下的浏览器。1995年，opera公司发布第一版Opera浏览器，使用自己研发的Presto内核。当时opera公司的开发团队不断完善Presto内核，使Opera浏览器一度成为顶级浏览器。直到2016年奇虎360和昆仑万维收购了Oprea浏览器，从此也丢弃了强大的Presto内核，改用当时Google开源的webkit内核。后来Opera浏览器跟随Google将浏览器内核改为Blink内核。自此Presto内核也淡出了互联网市场。

3、Safari浏览器：
第二次浏览器大战是从苹果公司发布Safari浏览器开始的。2003年，苹果公司在苹果手机上开发Safari浏览器，利用自己得天独厚的手机市场份额使Safari浏览器迅速成为世界主流浏览器。Safari是最早使用webkit内核的浏览器也是现在苹果默认的浏览器。

4、Firefox浏览器：
Firefox浏览器使Mozilla公司旗下浏览器，也是刚才提到的网景公司后来的浏览器。网景被收购后，网景人员创办了Mozilla基金会，这是一个非盈利组织，他们在2004年推出自己的浏览器Firefox。Firefox采用Gecko作为内核。Gecko是一个开源的项目，代码完全公开，因此受到很多人的青睐。Firefox的问世加快了第二次浏览器大战的开始。第二次浏览器大战与第一次二元鼎力的局面不同，这一次的特点就是百家争鸣，也自此打破了IE浏览器从98年网景被收购后独步浏览器市场的局面。

5、Chrome浏览器：
Chrome浏览器是google旗下的浏览器。Chrome浏览器至发布以来一直讲究简洁、快速、安全，所以Chrome浏览器到现在一直受人追捧。最开始Chrome采用webkit作为浏览器内核，直到2013年，google宣布不再使用苹果的webkit内核，开始使用webkit的分支内核Blink。

以上是五大浏览器的简介，接下来是四大内核。在介绍五大浏览器的同时也已经顺便介绍了四大内核。四大内核分别是：Trident（也称IE内核）、webkit、Blink、Gecko。五大浏览器采用的都是单内核，而随着浏览器的发展现在也出现了双内核。像360浏览器、QQ浏览器都是采用双内核。
作为前端开发，熟悉四大内核是非常有必要的。四大内核的解析不同使网页渲染效果更具多样化。下面总结一下各常用浏览器所使用的内核。
1、IE浏览器内核：Trident内核，也是俗称的IE内核；
2、Chrome浏览器内核：统称为Chromium内核或Chrome内核，以前是Webkit内核，现在是Blink内核；
3、Firefox浏览器内核：Gecko内核，俗称Firefox内核；
4、Safari浏览器内核：Webkit内核；
5、Opera浏览器内核：最初是自己的Presto内核，后来是Webkit，现在是Blink内核；
6、360浏览器、猎豹浏览器内核：IE+Chrome双内核；
7、搜狗、遨游、QQ浏览器内核：Trident（兼容模式）+Webkit（高速模式）；
8、百度浏览器、世界之窗内核：IE内核；
9、2345浏览器内核：以前是IE内核，现在也是IE+Chrome双内核；

自学前端第一天:认识前端工程与网页相关推荐

从零学前端第一讲：前端开发是什么？给初学者有什么建议？
这里是修真院前端小课堂,本篇分析的主题是 [从零学前端第一讲:前端开发是什么?给初学者有什么建议?] 初识前端 1.前端开发是什么? 2.前端开发有前途吗? 3.前端开发哪里学? 4.前端发展 5.对 ...
前端工程化（一）---工程目录搭建
从0开始,构建前后端分离应用导航前端工程化(一)---工程基础目录搭建前端工程化(二)---webpack配置前端工程化(三)---Vue的开发模式由于一直在搞后端开发,对于前端内容的掌握一 ...
前端第一天 HTML基础
前端第一天 HTML基础 1.是什么 HTML里值得记住的就几个点,第一,这东西还有自身也有结构这东西是个超文本,可以挂载文字图片视频或者别的超文本自身可以通过各种各样的tag进行标记,排版给浏 ...
php什么设置前端代码,代码编辑器与PHPSTUDY的安装与配置过程（前端第一课）
前端第一课:编辑器与PHPSTUDY的安装与配置过程编辑器安装过程 1.Visual Studio Code 官网下载软件,解压下载文件,打开安装程序安装至你的计算机. 2.安装"Chin ...
是自学前端还是培训学前端？
"学web前端是自学好还是去培训机构,哪个靠谱?" 类似的问题应接不暇,包括前段时间逛知乎,关于这个话题的热度,还是居高不下. 都快2021年了,匆匆入场的人还是很多,尤其是在校大 ...
[LLVM教程]LLVM之第一个语言前端
目录: [LLVM教程]LLVM之第一个语言前端 [LLVM教程]LLVM之第一个语言前端/"万花筒":介绍与词法分析器 LLVM Tutorial: Table of Conte ...
Web前端开发笔记——第一章 Web前端概论
目录前言一.Web系统 (一)Web系统的定义 (二)前端和后端二.网站和网页 (一)网站的开发历程 (二)网页的组成元素三.浏览器四.前端技术 (一)超文本标记语言(HTML) (二)层叠 ...
前端怎么使用jsessionid_前端搞微前端 | 侑夕 - 如何落地微前端一体化运营工作台...
下期预告前端早早聊大会目标成为用得上.听得懂.抄得走的技术大会,计划 2020 年办 >= 15 期,由前端早早聊与掘金联合举办,前端早早聊大会行程动态.录播视频/PPT/讲稿资料下载请关注 ...
5 位阿里前端技术专家论：前端工程师的成长和发展
前端夜话.活动邀请到了前端大咖 winter.百姓网技术顾问贺师俊(Hax).Swift 大神王巍(喵神).<CSS 世界>作者张鑫旭.阿里前端技术专家狼叔等 5 位前端大牛,聊聊前端工程 ...

自学前端第一天:认识前端工程与网页