文档章节

web前端知识构架和职业之路

Adam-Lee
 Adam-Lee
发布于 2014/07/17 14:07
字数 5413
阅读 120
收藏 0

首先,我觉得但凡成功的人,大抵都是饱含激情的人,在做技术和科研领域过犹不及。从我的经历和身边的人看开去,我觉得有两种情况,要么你热爱前端技术,要么你不是非常热爱前端技术,但需要前端技术来糊口。这两种情况有着本质的不同,对于热爱前端技术,你更加需要的是了解前端技术的知识架构,按照知识架构结合自身情况和工作情况,制定学习计划并充分贯彻和执行。对于并不非常热爱前端技术,又需要前端技术来糊口,我只有一个建议:爱上前端技术,先!

其次,对于技术学习的宏观角度来看,可以分成单一技术和复合技术两种,如果国内的IT技术就业市场和国外一样成熟,单一技术会在职业发展道路上处于前置,复合技术会成为向更高层次发展的必由之路。由于国内的实际情况,更多时候是需要有复合技术才能糊口,在企业里发展的好点儿了,就转向某个领域,做单一技术来想更高层次发展。其实,我们可以简单实用国外的JobSearcher对比国内的ChinaHR,就能发现,国内招聘专职开发Flash、ActionScript、Silverlight、JavaScript……的单一技术岗位很少,而国外却很多,甚至几乎不会直接招聘“WEB前端开发”,复合技术在国外多被招聘为“架构师”。

最后,知识架构很重要。学习并掌握一类知识技能,无论是单一技术还是复合技术,她们都有自己的知识架构。我个人理解,如果把技术学习当作是一次旅程,知识架构就是这次旅程的路线图。我们在旅行之前,通常会给自己规划一条旅行路线:When?Where?Whow?Do what?See what?What is your objective?

这只是W3C一场演讲(0910how-fast)PPT里阐述的WEB技术Architecture,这里头纷繁复杂的技术并非WEB前端技术的全貌,充其量算是前端技术的基础。但是,就算是基础,也已经足以诠释WEB前端技术的复杂性了,如果我们一头扎进这纷繁复杂的技术海洋中去,离上岸将是遥遥无期。我个人的建议是:关键知识深度掌握!

首先,要了解基于TCP的HTTP协议,HTTP协议才是承载WEB前端技术的根基,只有了解了HTTP协议的实现细节,才能在未来开展WEB前端技术学习、工作的时候更加得心应手。针对HTTP协议,可以先看 《TCP-IP详解卷三:TCP事务协议,HTTP,NNTP和UNIX域协议》 第13章HTTP:超文本传送协议 129~141页。其次,可以看http://www.w3.org/Protocols/rfc2616/rfc2616.html里的《Hypertext Transfer Protocol — HTTP/1.1》针对现役的HTTP1.1进行深入细致的学习。

其次,要掌握HTML的语法和Tag的细节,这些是我们未来构建WEB前端应用的载体。在这部分学习中,网上相关文章和技术资料很多,我也就不特别推荐什么了,但是,有一点需要注意,不要直接陷入对技巧的学习,就是不要直接从网上摘抄、复用一些别人的代码,更多自己动手才是提升的捷径。其次是理解,对于HTML很多人都觉得自己是大牛,但是,你问他HTML一共有多少标记是W3C规范的、多少是FF的、多少是IE的?估计多半儿答不上来,这里我们要掌握的知识点就是,回答这些问题。这里就像是小时候搭积木,你掌握的越多,手里的积木越多,能够搭出的东西就越多,所以,耐心的花点儿时间去学习是有必要的。

接着,需要掌握CSS。从HTML4.0开始,内容和表现的分离让我们极大提高了工作效率,这些提升都得益于层叠样式表(Cascading Style Sheets)。CSS在我看来就是格式描述语言,用来描述HTML元素的格式,通知浏览器各种HTML元素应该如何被渲染。需要掌握的知识点主要有:CSS语法、类和样式定义之间的关系、IE纵向兼容、IE和WebKit内核横向兼容、CSS文件规划、CSS文件分割、CSS文件加载。

然后,要掌握DHTML、JavaScript、DOM。随着WEB前端技术的发展革新,UI交互越来越丰富、动态、平滑、易用,这些都得益于DHTML、JavaScript和DOM等技术。不割裂这三块儿的原因是,我认为这三块儿知识要放在一起进行学习才有效果,只有了解DHTML(Dynamic HTML)的概念、范畴、方法,才能够正确使用JavaScript和DOM来实现动态的页面和交互操作。说得直白些,DHTML就是用JavaScript来操作HTML页面包含的所有元素、样式、行为、事件,以及通过和浏览器及操作系统交互获得扩展性的一种综合性技术统称。这里的知识结构无法细说,只要有技术能够让页面从一种状态改变到另一种状态,这种技术就应该存在于DHTML体系里,就是在我们的知识结构里。但是,知识结构的层次按照先后顺序应该是:DOM文档对象模型、JavaScript、其他相关技术。先学习DOM接口的好处,是详细学习和了解HTML文档对象模型都提供了哪些接口?哪些内容是可以操作的?如何针对文档对象模型里的元素进行操作?紧接着学习JavaScriopt是为了能够去实践、去使用文档对象模型、去操作文档对象模型,这实际上可以理解成从理论到实践的一个过程。

最后,Flash、ActiveX、FF&Chrome插件、Silverlight……等其他能够让WEB页面从一种状态改变到另一种状态的技术。这里只介绍较为常用的Flash、ActiveX、Silverlight所包含的知识结构,其他方面会在后续具体学习方法之中介绍。Flash方面,需要掌握:Flash CS、Flash2D平面和色彩设计、Flash控件皮肤修改和设计、Flash自定义控件设计、Flash项目管理、Flash编程、ActionScript编程、Flex控件使用、Flex界面设计、Flex编程、第三方素材导入、主流第三方工具使用、反编译和素材提取、SWF文件切割和规划、Flash 网络编程、调试技巧、单元测试技巧、发布技巧。ActiveX控件方面:ActiveX控件使用方法、ActiveX控件设计制作、ActiveX控件升级、ActiveX控件安全、调试技巧、单元测试技巧、发布技巧。Silverlight方面:.NET编程、Blend和VS.NET使用方法、XAML、网络编程、CodePlex、调试技巧、单元测试技巧、发布技巧。

WEB前端技术之路(二) 职业规划

关于一个WEB前端的职业规划,其实是有各种的答案,没有哪种答案是完全正确的,全凭自己的选择,只要是自己选定了,坚持去认真走,就好。在这里,我只是简要说一下自己对于这块儿内容的理解。有一个观点想要分享给大家的是:任何规划和目标的实现都依赖于知识的积累,而知识的积累来源于学习及学习后大量的实践。我提供一个实践途径,我们可以在工作之余的时间在网上或外包公司那里接一些私单做,因为目标不是赚钱,我们可以用最低的价格来提升自身竞争力,获得大量订单就意味着获得大量的实践机会,同时,还有一些收入作为工作成就感之外的安慰奖,还是不错的。

一、职业方向定位

首先,只有确定好自己的职业方向,才能做好职业规划。在我看来,做WEB前端技术能够找到的职业方向有以下几种:

(1)资深WEB前端工程师

这个方向算是一个WEB前端最基本的选择了,在国外,很多老外都能够把自己的专业做到极致,能一辈子就在一个专业领域不断学习和积累。主要在于内因和外因两方面,内因是老外通常思想比较简单直接,容易一直专注于一个领域;外因是国外的环境很好,能够良好的支撑这样的职业发展道路。反观国内,从内因来讲,WEB前端技术人员还是蛮浮躁的,通常会因为WEB前端知识的更新速度太快而觉得学习起来辛苦,最终转向后台或其他道路。从外因来讲,WEB前端人员没有获得公平的待遇,可能从HTML页面制作就开始并沿袭下来的,从来WEB前端人员都比后端人员低一等,貌似前端就是“浅显”的代名词、后端就是“深奥”的代名词,这也直接造就了前端人员的收入无法和后端人员媲美,同时直接影响到前端人才市场的活跃程度。另一方面,前端的技术入门较容易,造成另一个极端情况:人员泛滥、人才稀缺。我想对所有的WEB前端工程师说:面包总会有的,要耐得住寂寞!我个人比较推荐这个职业发展方向,因为,在这个方向下,只要足够耐心、厚积薄发,成功的概率是非常高的。同时,这是一条最单纯的路,我们更多的是花费精力在技术的钻研上,而不是办公室政治等其它琐事。

(2)资深WEB架构师

说功利点儿,我喜欢这个方向,既兼顾了工作的单纯性、又能够减少实际Coding的工作量能腾出更多时间钻研技术。在国内,WEB前端工程师遇到较多的情况是总是反复编写着同样的代码,总是面对着同样的技术和产品,容易感觉枯燥。由于我们拥有最为广泛的WEB相关知识沉淀,使得我们更加容易成为一名架构师。这个职业发展方向不如第一种来得平滑,主要是作为一名架构师不得不学习:后端技术、DBA、Platform等内容,而这种学习通常需要实际操刀做项目,不是自己在家里写两个Demo就好的,这就势必会遭遇一段时间的阵痛期。虽然不是很平滑,但是,对于一个大局观好、悟性好、知识面广的前端工程师,我推荐你们努把力,走一条光荣的架构师之路吧。

(3)自己创业

其实,自己创业是最好的道路、也是成功率最低的道路,挑战和机遇并存。这里,作为一个前端技术人员,需要将自己的视野更多放在行业的动态、产业链的动态、相关产品领域的动态,把关注细节的优势继续保持,同时,增强自己把控一个产品乃至一个公司命运的能力。但是,这条道路和技术之路稍有分歧,后续将不再赘述。

(4) 转岗管理或其他

由于这条职业道路和WEB前端技术之路关系不大,故而,这里不做过多讨论,但是,无论是否走上这条道路,我觉得对于任何技术之路,更好的大局观、更广泛的视野是良好发展的必备条件,拥有良好的大局观和更广泛的视野别无他法,只能不断的进行知识的横向拓展和积累,同时,多在横向拓展知识的时候进行实践,把知识变成技能。

二、职业发展目标

我都有一个最终的目标,在这个目标之上,我们需要给自己制定一系列学习和成长计划,制定的方法如下:

第一、梳理知识架构;

梳理知识架构的目的在于,我们要了解清楚,哪些技术是前置、哪些技术是后继,那些技术是深度、哪些技术是广度,按照这两个维度梳理好知识架构之后,我们才能准确地制定清晰的成长目标、高效的成长计划。

第二、分解目标;

我认为,大抵可分解为三个阶段,包括:起步阶段、提升阶段、成型阶段。这三个阶段分别对应着不同的目标:

起步阶段:

1、基本知识的掌握

在我们梳理的知识架构中,按照我们分析的两个维度里最前置的、最浅显的部分,作为打基础的阶段,必须要在这个过程中更多投入到实践中去,我们通常做的多了、熟练了,就认为这部分知识和内容掌握了。

2、常用工具的掌握

对于常用工具的掌握应该掌握一些有大公司或专业团队背景的流行工具,这些工具的熟练掌握能够提升专业度、职业度,同时,能提升我们的工作效率。我们只有在检验自己对于知识和技能熟练程度的时候,才会自虐式的用Notepad去编写页面、css和脚本等内容。

3、沟通技巧的掌握

通常做技术的人会被定位为“不善沟通”的人,这是为什么呢?究其原因,主要是因为多跟程序和代码打交道,跟人的沟通较少导致。这种时候我们要特别注意增加和人沟通的机会,着重提升这块儿的能力。另一方面,我们通常被称为“不懂沟通技巧”的人。作为一个技术人员,包括我自己,似乎天生就有一些难以接受挑战的缺陷。在国内,我们的技术人员通常都是自己制定方案、自己执行方案,在执行过程中又缺乏相关产品、交互设计等人员的沟通,大多是在自己的思路贯彻下进行开发,久而久之,我们习惯于信任自己的观点、在自己的视角看问题,对于挑战总是百般地“据理”力争。我们需要更多提升的是,如何在对方的视角看问题、如何在用户的视角看问题。

4、良好的开发习惯

开发习惯是养成的,一旦有不好的习惯,对于将来去修正带来的将是很大的麻烦,我们在培养良好开发习惯一定要从起步时做起,例如:写代码之前先分析、先写文档、先写注释。定义变量最好能用直接可理解的语义,最好是拼音,别整英文,尤其是生僻单词,将来自己忘了还要开金山词霸。文件最好有有意义的文件夹命名来管理,文件名最好有意义,需要版本号的最好能和项目版本号一同更新……等等。

提升阶段:

1、高级技术的掌握

在提升阶段对于知识和技能掌握,我们需要从梳理好的知识架构中选择更深一层次的技术进行学习,选择之前,我们先通过类比或预估的方法,衡量自身学习的难点,以学习难点和自己最不感兴趣的部分为主。这样推荐大家的原因是:这个阶段我们兴趣正浓,已经度过了苦涩的起步阶段,到达了兴奋的提升阶段,我们要用兴趣和兴奋去挑战最困难的部分,在我们信心受挫和兴趣浓厚之中找到平衡。同时,辅以其他的深层次知识一起学习和研究。

2、产品思想的学习

没有正确的产品思想,很难设计出良好的程序,无论从界面、交互,还是接口、逻辑,不能够理解产品、理解用户需求,我们会给自己造成很大的麻烦,例如:我们千辛万苦用最新技术、最复杂的实现做出的功能,却得不到使用者或领导、同事的认可。为了使我们的工作和学习更加有效率、避免无用功,我们需要不断的学习产品的思想,只有理解了产品的思路,我们才知道用我们的技术去输出什么。

3、各种框架的学习

框架是我们提高工作效率的优秀手段,对于框架的学习是成长必经之路。我们学习框架的路线通常应该是:使用——》分析——》个性化定制——》模仿编写自己的框架。只有大量的使用,才能明白设计框架者在设计背后的思路,只有了解到设计的思路,才能做正确全面的分析,只有正确全面的分析才能支撑我们去对其裁剪或扩展,只有经过实际分析、修改别人的框架,才有可能写出优秀的、自己的框架。学习通常的路线是:学习、理解、模仿、创造。

4、富客户端应用的学习

随着带宽和计算机性能的提升,以及WEB2.0的如火如荼,富客户端应用充斥着互联网,如果你不懂得富客户端应用,你就不能称之为一个合格的前端技术人员。可以按照:Flash动画——》Flash编程——》Flex——》——》Air——》Silverlight动画——》Silverlight编程的步骤学习,先学Flash后学Siverlight的原因,一来Silverlight还不太成熟,二来,实际Silverlight借鉴了很多Flash的思想,最好在学习的时候不要本末倒置。

5、各种网络协议的学习

WEB前端技术就是云上的技术,云的协议有N种,我们应该着重学习:TCP/IP,UDP,HTTP,POP3,SMTP这几种协议,在开发WEB前端应用过程中,这些协议是我们的技术的载体,有时候决定了我们的应用是否能实现、有时候决定了我们的应用是否高性能,同时,这些协议还是我们和后端技术交互的重要手段,这些协议就像是密码字典,帮助我们把后端传输过来的密文解释成我们前端技术能够理解的明文。

6、程序设计

这个阶段我们需要学习OO、UML、设计模式、设计方法……,我们要让技术开发工作变成有目的性、有计划性,并且,这些目的和计划必须有理论的支持,这样,我们设计出来的程序才能够更优秀、我们的开发才更有效率,这样,我们的技术才能有所提升。为什么要学习程序设计呢?主要是,就算我们不用Flash的ActionScript编写程序的前端逻辑,我们至少要把我们自己的Javascript函数、包的定义规划起来,避免将来自己或他人维护代码的时候出现问题。程序设计能力,在技术人员仍然被看作是程序员的这个年代,是灰常、灰常重要滴。

成型阶段:

到了这个阶段,我也没什么好说的了,如果能达到这个阶段,就证明后续的成长之路是异彩纷呈的,是成为一个资深WEB前端工程师,还是成为一个资深WEB架构师,亦或其他,都要具体分析自身的特点和兴趣所在。如果是资深的前端工程师,我觉得更重要的是去作新技术的研究,互联网技术发展速度日新月异,不断学习新技术,否则就被淘汰。此外,我建议在知识的广度、深度方面最好能挑选一个自己最擅长和最感兴趣的一两个领域深入钻研,不要挑太多,多而不精。如果是资深的WEB架构师之路,我建议要深入了解后台技术,这种深入了解一定要伴随着实际的项目开发,基本方法是:按照别人设计的架构实现几个Server——》自己设计并实现几个Server


© 著作权归作者所有

Adam-Lee
粉丝 50
博文 118
码字总数 166965
作品 0
深圳
程序员
私信 提问
开启Web前端高薪之路

活动主题:开启Web前端高薪之路 活动时间:2017年4月22日 13:30 活动地点:北京市海淀区上地三街金隅嘉华大厦C座10层1004 活动安排:13:30 到场人员填写职业生涯规划调查问卷 14:00 百度前...

孙小黑
2017/04/11
12
0
开启Web前端高薪之路

活动主题:开启Web前端高薪之路 活动时间:2017年4月22日 13:30 活动地点:北京市海淀区上地三街金隅嘉华大厦C座10层1004 活动安排:13:30 到场人员填写职业生涯规划调查问卷 14:00 百度前...

孙小黑
2017/04/11
23
0
web前端开发程序员的收入未来会更高吗

Web前端我们通过其字面意思大概可以了解到,web前端的设计师的工作内容就是直面用户的,当然,在这一过程中还会应用到一些包括用户交互,页面布局设计等,也许有人会问,ps和美工能够做web前...

web前端程序员
2017/12/07
0
0
千万人都说好的java web学习分享

Java web学习分享--Web前端工程师职业学习路线图,路线图内容涵盖Html/CSS、Javascript、jQuery、Web、及项目实战等方面,学院大牛专家讲师带你快速掌握HTML及CSS基础、到网页布局+实践、到J...

让往事随风
2016/04/06
209
0
职业发展之路在那里!!!

一晃工作好几年了(杀猪刀真快啊),目前在公司做类似构架师的工作。近来对职业发展的路,越发的模糊,啊大伙都来说说下步该向那里发力

testV
2013/08/02
505
8

没有更多内容

加载失败,请刷新页面

加载更多

100天搞定机器学习|Day55 最大熵模型

1、熵的定义 熵最早是一个物理学概念,由克劳修斯于1854年提出,它是描述事物无序性的参数,跟热力学第二定律的宏观方向性有关:在不加外力的情况下,总是往混乱状态改变。熵增是宇宙的基本定...

机器学习算法与Python实战
36分钟前
5
0
找子表

select a.constraint_name, a.table_name, b.constraint_name from user_constraints a, user_constraints b where a.constraint_type = 'R' and b.constraint_type = 'P' and a.r_constrain......

兵荒马乱的青春
38分钟前
6
0
Web应用安全如何防御或者检查漏洞?

     Web应用安全如何防御或者检查漏洞?这是大家一直关心的问题。随着计算机技术的发展,网络漏洞也变得越来越多样化了,你知道吗,每隔9 小时就会发布 1 个严重漏洞,并且有可能会进行远...

梅丽莎好
46分钟前
7
0
Vim 复制粘帖格式错乱问题的解决办法

有时候,复制文本(尤其是代码)到 Vim,会出现格式错乱的问题。看样子,应该是自动缩进惹得祸。本文不去深究原因,直接给出解决方法。 1. paste 模式 运行如下命令,进入 paste 模式: :set...

观海562
47分钟前
7
0
OSM初识(三)OSM Data

一 导出数据 将XML格式的OSM数据转换成另一种格式。 二 提取数据 剪切你选择区域内的数据,或者提取出特定区域特定的特征 三 数据格式 OSM文件仅属于OSM,不能用别的软件打开。其中后缀为bz2...

yuankaichao
56分钟前
7
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部