学习web前端要注意什么?工作中最常用的技术是什么?怎样着手学更快?

html-css09

学习web前端要注意什么?工作中最常用的技术是什么?怎样着手学更快?,第1张

都说前端入门低,想学好前端绝对不容易,可以说现在前端所需要掌握的技能超过后端和以往,新技术概念层出不穷,到底所谓的前端都应该干些什么都应该会写什么呢?

本人身边有太多的人会切几张图, 会用jQuery做个特效, 会从bootstrap里复制粘贴, 会用html游戏框架写个flappy bird, 会在Github里找各种模板自和库拼拼凑凑, 就口口声声大言不惭的称自己为前端工程师. 说什么前端好简单啊, 前端找工作好难啊, 没有出路啊, 想转行啊. 甚至有更多的人还不明白什么是HTML, 就到处问(知乎里尤其多)怎么开始学前端啊, 前端前景好不好啊. 依照本人的经验, 什么东西难不难, 什么东西好不好, 可不是这样问出来的. 我相信在这在这种网络信息资源及其丰富的年代, 花个半小时自行搜索一下你应该可以得到你想要的答案.

好了言归正传, 前端工程师真的是一个无关紧要的职位么? 我们先来看看前端工程师都要做些什么, 看看那些称自己是'所谓'的前端同学们都能走到哪一步.

这里直接跳过最基本的HTML+CSS+JS, 包括但不仅限于:

- HTML各种element怎么用什么时候用?

- Event? EventLitsener? HTML中触发event以及JS中处理event?

- DOM tree? 添加? 修改? 删除? 搜索? 遍历? 选择? children? parent? sibling?

- 什么是window? 什么是document?

- JS基本语法? function? loop&condition? scope&closure? array&object? this?

- CSS 什么是box modal? position? float? 各种选择器(*, >, ~, :nth-child)?

如果看到这里有任何一项完全没听说过没用过, 或者查各种文档后'大概'知道怎么用的同学们, 很遗憾, 你们现在算不上是一个合格的前端工程师. 如果不是, 请继续.

### 程序员的基本素质和知识

(有些人觉得前端不同于传统意义上的程序员, 这点我十分不赞同. 或许把前端工程师叫做JS程序员更加贴切, HTML和CSS就好比其他语言中的UI库)-

- 高数, 基本的概率统计 (连简单的微分方程都不会解的朋友们就不要称自己为前端人员了!)

- 基本数据结构 能用JS写出linked list, stack, queue, (binary)tree, graph, hashtable么?

- 基本算法 能用JS实现各种search(linear, binary..), 各种sort(bubble, insertion, merge, quick, selection), 以及树的搜索(Breadth First/Depth First)和遍历(3种顺序)么?

- 设计模式 知道什么是singleton, factory, strategy, decrator么?

- Git 不要只是停留在把Github当做一个网络储存器的层面上, 知道branch, diff, merge么?

- 基本的英语能力(不要求听说, 只用来读/写文档资料)

- 基本的计算机知识 知道位运算, 溢出, thread, lock, concurrency, parallelism么?

- 熟悉unix的基本命令么? 知道ssh public/private key都是干嘛的么?

- 知道正则么? 能够熟练的使用么?

- 能写出详细的注释/文档, 让阅读你代码的人知道你要干嘛么? 能短时间内快速地读懂来自你同事或者其他地方(github, blog)的代码, 知道什么东西应该写在什么地方, 以便迅速地参与其中么?

- 给你一个你从来没有接触过的库/语言, 能能够在较短的时间内在你的代码里正确使用么?

- 有一个得心应手用的熟练地编辑器/IDE么? 不要求大家都是vim/emacs大神, 但也不要做什么都是用鼠标来点.

- 基本的检索查询能力(google, stackoverflow, MDN)

- 单独思考解决问题的能力, 团队合作, 与人相处

如果以上的内容都有所了解(这里不会强调精通), 恭喜你, 你拥有了成为前端工程师的基础知识. 继续.

### 前端专业知识

- 知道什么是AMD, COMMONJS么? 知道call, apply, bind么? 知道JS中foreach, filter, some, every么? 知道怎么实现functional JS(curry等)么?

- 知道各种所谓的高级HTML的API(File, Web Audio, WebSocket)么?

- 知道各种CSS Preprocessors么? 能讲出他们各自的优点和缺点么? 熟悉并且会用其中的一种么?

- 知道各种CSS框架么? 能讲出他们各自的优点和缺点么? 熟悉并且会用其中的一种么?

- 知道canvas, SVG么?

- 知道怎么把你的东西做成responsive, cross-browser support么?

- 知道什么是SEO并且怎么优化么? 知道各种meta data的含义么?

- 知道什么是Ajax, restful, get, post么? 知道怎么和后台交互么?

- 知道各种JS框架(Angular, Backbone, Ember, React, Meteor, Knockout...)么? 能讲出他们各自的优点和缺点么? 熟悉并且会用其中的一种或多种么?

- 知道什么是webkit么? 知道怎么用浏览器的各种工具来调试和debug代码么?

- 知道现在前端一般的工作流程(gulp, grunt, git, svn, npm)么?

- 知道怎么测试代码么? 知道BDD, TDD, Unit Test么? 知道怎么测试你的前端工程么(mocha, sinon, jasmin, qUnit..)?

- 知道前端templating(Mustache, underscore, handlebars)是干嘛的, 怎么用么?

- 知道npm, V8, node, express, socket么? (这里补充一点, 现在越来越多的公司都采用: '前端网页 ->前端后台 ->后台'这种构架来搭建东西, 也就是说, 前端工程师不仅要做传统前端的网页, 还要写自己的后台, 来跟真正的后台进行交互, 至于前端的后台用什么语言来写, 一般是node/python/ruby, 不太会用到庞大的java, 所以这里我把node列为前端工程师必须要掌握的技能之一) 知道cache, authentication么?

- (如果要用node)知道route, middleware, cluster, nodemon, pm2, server-side rendering么?

- 另外, 前端这个行业跟传统的c/c++/java程序员还是有一定的差别的. 由于是新兴产业, 所以各种行业标准, 框架, 库会随时随地的产生和更新 (作为一个c程序员, 十年前怎么写东西现在还是怎么写东西). 今天出了node和react, 明天又出了io和mean. 所以, 积极关注各种前端产品, 跟上变化的节奏, 也是身为一个前端程序员必备的技能之一. 知道ECMAScript 6里怎么写class么? 知道react, flux, reflux么? 知道polymer, dart么? 知道meteor么?

以上是摘自知乎某大牛的文章=====

感觉对新人挺打击的,不过理清从大体上重新认识前端对学习理解也有一定帮助,只要自己想好了就坚持下去,学前端的最重要的随时学习能力,应该前端领域知识面涵盖太广,很多技术也不成熟,正在发展中,只能不停学习各种新技术新知识。。能分辨哪些技术是必须掌握的,哪些是少数人创造用来提”升逼格“的概念,能把PS+HTML+CSS+js玩熟,会一两个框架,懂点设计。就可以了

这里直接跳过最基本的HTML+CSS+JS, 包括但不仅限于:

- HTML各种element怎么用什么时候用?

- Event? EventLitsener? HTML中触发event以及JS中处理event?

- DOM tree? 添加? 修改? 删除? 搜索? 遍历? 选择? children? parent? sibling?

- 什么是window? 什么是document?

- JS基本语法? function? loop&condition? scope&closure? array&object? this?

- CSS 什么是box modal? position? float? 各种选择器(*, >, ~, :nth-child)?

## 程序员的基本素质和知识

(有些人觉得前端不同于传统意义上的程序员, 这点我十分不赞同. 或许把前端工程师叫做JS程序员更加贴切, HTML和CSS就好比其他语言中的UI库)-

- 高数, 基本的概率统计 (连简单的微分方程都不会解的朋友们就不要称自己为前端人员了!)

- 基本数据结构 能用JS写出linked list, stack, queue, (binary)tree, graph, hashtable么?

- 基本算法 能用JS实现各种search(linear, binary..), 各种sort(bubble, insertion, merge, quick, selection), 以及树的搜索(Breadth First/Depth First)和遍历(3种顺序)么?

- 设计模式 知道什么是singleton, factory, strategy, decrator么?

- Git 不要只是停留在把Github当做一个网络储存器的层面上, 知道branch, diff, merge么?

- 基本的英语能力(不要求听说, 只用来读/写文档资料)

- 基本的计算机知识 知道位运算, 溢出, thread, lock, concurrency, parallelism么?

- 熟悉unix的基本命令么? 知道ssh public/private key都是干嘛的么?

- 知道正则么? 能够熟练的使用么?

- 能写出详细的注释/文档, 让阅读你代码的人知道你要干嘛么? 能短时间内快速地读懂来自你同事或者其他地方(github, blog)的代码, 知道什么东西应该写在什么地方, 以便迅速地参与其中么?

- 给你一个你从来没有接触过的库/语言, 能能够在较短的时间内在你的代码里正确使用么?

- 有一个得心应手用的熟练地编辑器/IDE么? 不要求大家都是vim/emacs大神, 但也不要做什么都是用鼠标来点.

- 基本的检索查询能力(google, stackoverflow, MDN)

- 单独思考解决问题的能力, 团队合作, 与人相处

### 前端专业知识

- 知道什么是AMD, COMMONJS么? 知道call, apply, bind么? 知道JS中foreach, filter, some, every么? 知道怎么实现functional JS(curry等)么?

- 知道各种所谓的高级HTML的API(File, Web Audio, WebSocket)么?

- 知道各种CSS Preprocessors么? 能讲出他们各自的优点和缺点么? 熟悉并且会用其中的一种么?

- 知道各种CSS框架么? 能讲出他们各自的优点和缺点么? 熟悉并且会用其中的一种么?

- 知道canvas, SVG么?

- 知道怎么把你的东西做成responsive, cross-browser support么?

- 知道什么是SEO并且怎么优化么? 知道各种meta data的含义么?

- 知道什么是Ajax, restful, get, post么? 知道怎么和后台交互么?

- 知道各种JS框架(Angular, Backbone, Ember, React, Meteor, Knockout...)么? 能讲出他们各自的优点和缺点么? 熟悉并且会用其中的一种或多种么?

- 知道什么是webkit么? 知道怎么用浏览器的各种工具来调试和debug代码么?

- 知道现在前端一般的工作流程(gulp, grunt, git, svn, npm)么?

- 知道怎么测试代码么? 知道BDD, TDD, Unit Test么? 知道怎么测试你的前端工程么(mocha, sinon, jasmin, qUnit..)?

- 知道前端templating(Mustache, underscore, handlebars)是干嘛的, 怎么用么?

- 知道npm, V8, node, express, socket么? (这里补充一点, 现在越来越多的公司都采用: '前端网页 ->前端后台 ->后台'这种构架来搭建东西, 也就是说, 前端工程师不仅要做传统前端的网页, 还要写自己的后台, 来跟真正的后台进行交互, 至于前端的后台用什么语言来写, 一般是node/python/ruby, 不太会用到庞大的java, 所以这里我把node列为前端工程师必须要掌握的技能之一) 知道cache, authentication么?

- (如果要用node)知道route, middleware, cluster, nodemon, pm2, server-side rendering么?

- 另外, 前端这个行业跟传统的c/c++/java程序员还是有一定的差别的. 由于是新兴产业, 所以各种行业标准, 框架, 库会随时随地的产生和更新 (作为一个c程序员, 十年前怎么写东西现在还是怎么写东西). 今天出了node和react, 明天又出了io和mean. 所以, 积极关注各种前端产品, 跟上变化的节奏, 也是身为一个前端程序员必备的技能之一. 知道ECMAScript 6里怎么写class么? 知道react, flux, reflux么? 知道polymer, dart么? 知道meteor么?

来自:http://www.zhihu.com/question/28860309 

@haochuan 的回答