图片加载中...

图片加载中... 中国高端php培训领导品牌

图片加载中...名企定向委培

首页>新闻动态>WEB前端技术文章

web前端知识体系

更新时间:2019-05-16

1.总分类

前端的知识点非常多,也非常散,需要好几层结构来组织这个体系,否则就会显得很乱。那么如何组织,把谁和谁放在一块儿?这是真正值得我们去思考的,你也可以自己来思考一下这个问题在我总结的这个知识框架中,首先第一层我划分为:理论知识,类库框架,编码开发,运行环境。如下图:

2.理论知识

    

  • 所谓“软”的就是能在各个程序开发中都用到的,算是基本功,内功,例如数据结构,算法,设计模式,面向对象等等;
  • 所谓“硬”的就是能直接用于本程序开发的。用Ç语言你就得学Ç语言语法,此时学的java的没用。我们卷筒纸前端开发所需要的硬知识其实都包含在三个标准里面:http标准,W3C标准和ECMAScript标准 ;

3.“硬知识”

硬知识有三个标准:http标准,W3C标准和ECMAScript标准

3.1 http标准

为什么做网站前端要了解HTTP标准 - ?因为浏览器要从服务端获取网页,网页也可能将信息再提交给服务器,这其中都有HTTP的连接名.web系统既然和HTTP链接有瓜葛,你就必须去了解它。

你不必去非常了解HTTP的详细内容,但是你要了解的Web前端开发常用的一些HTTP的知识 - 就是上图中我列出来的那些当然,我知识列了一个个,详细内容还得靠你自己去查阅(本文章讲的是知识框架,不会涉及任何知识点的详细内容)。建议去查阅“图解HTTP”。

3.2 W3C标准

它的内容非常多,看看www.w3.org/TR/这个页面。关于CSS的基础知识,毛遂自给一下自己之前的一篇系列博客:“ CSS知多少 ”。

3.3 ECMAScript

简称ES,写全称太麻烦了。有些人可能只知道的JavaScript中,而不知道ES--其实,JS是在ES的基础上,为网络浏览器做了一部分封装(增加了DOM操作,BOM操作等)。

如上图中的这些概念,大家可能平时都在JavaScript的的中看到,其实他们是ES的内容。只不过的JavaScript的继承了ES的这些特性,并且JavaScript的的用的比较广泛,因此才会在JS中讨论的多一些。

还是那个“2/8原则”。其实ES中的内容也非常多,而且更新很快,现在都到ES6了。但是我上图中列出来的这些都是最重要的概念。如果你不懂原型,闭包和作用域,那就说明你还不完全了解ES,也就是不完全会用的的JavaScript。

在此毛遂自荐自己之前的一篇系列博客,大家可以去参考:“ 深入理解的JavaScript的原型和闭包系列 ”

4.框架和类库

  • 首先,jQuery的一定是大部分网站前端开发者不可或缺的工具。而我利用jQuery的不仅仅停留在只使用它的API和插件上,我还会自己去写的jQuery插件,我还会去读的jQuery的源码,了解jQuery的的设计思路如果你也能那样做,请相信我,你会收获到意想不到的效果。如果有一个问题:怎样才能最最透彻的理解的JavaScript的事件系统最佳答案之一:读几遍(一遍可能读不懂)jQuery的关于事件处理部分的源码!
  • 引导不用再过多解释了吧,从github上上的排名也能看出道道来。甚至连我们公司的UI设计师,都从自举上截图作为素材。
  • fontAwesome是全世界最强大的图标系统。相比于css制作图标来说,这个要好很多倍,不管是开发,效率还是维护上.icomoon.io能让我自定义选择自己的图标文件。
  • 。requirejs和seajs这种模块定义系统,也一定是你系统中不可或缺的我曾经看过一个教程,讲师就说:requirejs带来了既jQuery的之后的第二次前端技术变革。
  • 其他的,骨干,有角的,反应这些也慢慢的开始发挥了他们的价值,此处精力有限就不再赘述了 - 但是,他们很重要 - 你至少要试着去了解它们。

5.编码开发

如果你专门做网络前端,就不要在用VS了,当然要选择崇高。写HTML语句还用手动一条一条写吗?你得需要zencoding的协助,否则效率太差了。

另外,针对HTML,CSS,JS的压缩,合并,语法检查,文件的清除,复制这些操作,你还要手动去做吗? - 你需要的呼噜声或者大口的帮助。

在此毛遂自荐自己的教程“ 用咕噜搭建自动化的Web开发环境 ”,讲的比较详细,适合初学者学习。

如果你的系统中有比较多的js代码或者文件,请选择一个合适的模块定义规范--CMD / AMD

请用混帐来帮助你做文件版本管理,最简单的就是使用的github上。

调试,测试,也都有专门的工具,都是需要学的......

- 我的天哪......这些字写到现在写的我的手都酸了,别说要学习这些知识了 - 再也别说我们的网前端是“三大块”了!

6.运行环境

当系统真正到了运行环境中,当你觉得终于完事儿的时候,其实还有好几个知识点需要你掌握看下图:

首先,你要知道的网络系统虽然大部分是在浏览器下运行,但是JS可能会被运行在节点环境。

分享到:

上一篇:web前端与html5有什么区别


下一篇:没有了

相关课程MORE>

图片加载中

WEB高级前端+HTML5

前端开发就是利用各种Web技术进行产品的界面开发...

图片加载中

UI交互式设计师

让学生快速达到一名UI界面设计师的标准...

图片加载中

PHP高级架构工程师

广阔的发展空间,需要新型的技术人员...

图片加载中

高级python开发

Python 是一个高层次的结合了解释性、编译性、互动性和面向对象的脚本...

图片加载中TEL:010-83650488

图片加载中