微信号:imooc-com

介绍:慕课网是一个超酷的互联网、IT技术免费学习平台,创新的网络一站式学习、实践体验;服务及时贴心,内容专业、有趣易学。专注服务互联网工程师快速成为技术高手!

独家分享:大牛教你如何学习Web前端开发

2017-07-07 17:37 color




写在前面的话



前端是互联网行业不可或缺且无可替代的职位。


但入门容易、提升难,当初、中级市场几近饱和时,如何极速晋升为独挡一面的高级前端工程师,就成为头等大事!想要技能UP,脱颖而出?想要薪资UP,高人一等?


为此开展的花式填坑第9期话题里,让用户与技术大咖嘉宾互相交流,为大家解决平时学编程的一些烦恼与疑惑。



如何学习前端开发





Q

前端技术繁多,怎样系统的学习和提高?


1.对于初级前端更多的是注重原生js,还是框架的学习?

2.到达什么水平算是有一个好的技术基础?

3.怎样在工作中学习与自我提升?


ustbhuangyi:1. 原生 JS 和框架学习 2 者需要兼顾,原生 JS 是基础,所有的框架都是基于原生 JS 开发的,万变不离其宗。对原生 JS 熟练了,对学习框架是绝对有帮助的。对于前端 mvvm 框架,我建议是重点学习一门(工作中需要的),其它的顺带了解即可,因为一旦精通了一个,学习其它是非常轻松的。


 2. 能够把握项目中的重要子系统(功能模块集合),或中等难度的基础技术方向,对负责方向的技术判断基本没有问题,能够很好地把产品需求转换为技术需求。对于前端而言,前端基础知识 HTML、JS、CSS 熟练掌握,对于一些功能的实现与否有判断力,可以快速学习并掌握一门新框架,对于一些表象的事情能充分认识到本质问题。


 3. 既要会偷懒,又要勤奋。这里说的“偷懒”,并不是说少做需求,而是从业务开发中多去思考和总结,学会抽象,学会复用代码,减少重复的劳动。学会使用工具来帮我们解决人肉的问题。举个例子,前端最近非常火热的编程思想就是模块化、组件化,本质上都是为了复用代码,提升代码的可维护性,比如我们是不是需要开发通用组件库、JS库等等,来辅助我们的业务代码。还有几乎现在所有项目都会用构建化工具帮助我们开发,最有代表性的就是 webpack,它能帮我初始化代码,调试,编译打包等等,极大的帮助我们节约了开发时间,我们是不是多花点时间去研究它的配置,甚至是它的源码。


所以,去花时间学习这些编程思想,掌握这些工具,都能够很好的帮助我们提升技术。除了会“偷懒”之外,我们也要勤奋,虽然业务忙,但往往也不会忙到8小时工作时间都在写代码的地步吧。


如果我们把每天在群里斗图、刷微信朋友圈等等的时间节约下来学习技术的话,相信只要坚持,技术一定会提升比别人快,特别是初级的同学,你们的进步空间还很大,一定要多花时间在学习,而不是浪费时间问“我工作1-3年,出去要多少钱合适”这类的问题,薪资一定是和能力匹配的。



Q

前端攻城狮对于初学者,懂点脚本,JS了解的不深,如何才能升华提高自己呢(学了些框架,结果更加打击自己的自信心)

老师你走过弯路没,当我们遇到弯路,应该如何避免走弯路


ustbhuangyi:初学者更要去补基础了,如果基础不牢固,学习框架会比较吃力。而且更要努力了,要比其他人多花时间,恶补缺乏的基础知识。


就我个人而言,弯路没怎么走,我上学期间玩的c#,毕业后接触的前端,但是由于基础和学习能力还不错,我很快就把前端基础知识系统的学习了一遍,并在工作中运用和强化。建议学习基础知识的过程中,也要多思考,多问,多总结,提升学习效率。



Q

作为一名前端开发者,Node.js这门后端语言相比其他后端语言来说有什么优势?还需要掌握其他后端语言吗?


算法和数据结构重要吗?


为什么要现在都采用前后端分离的方式开发项目?

ustbhuangyi:1.Node.js 比较适合 IO 密集型的系统,不太适合 CPU 密集型的系统,前端学习 Node.js,相比其它语言的优势仅仅在于属性 JS 这个语言而已,如果想深入学习后端,多了解一些其它的后端语言会有很有帮助。后端最重要的是数据存储和服务稳定性,除了学习理论知识,还需要有实战的经验才可以真正掌握。 


2.算法和数据结构很重要,虽然看上去做前端很少接触到算法,但当你去做一些工具的时候,比如分析一个依赖树中是否有环,就需要用到算法知识了。再比如做大数据处理的时候,如果算法不好的人写出的代码可能会有严重的性能问题。


 3. 前后端分离主要是为了前后端可以并行开发,提升开发效率;而且前端不依赖后端语言的实现,代码可移植性强;还有一点就是因为现在 B 端发展很快,功能和交互也越来越丰富,传统提交表单,刷新页面的交互已经不能满足了;同时也得益一些 mvvm 框架,在前端帮我们完成了数据到模板的自动映射,前端就可以处理这些复杂的交互,促进了前后端分离的开发模式。



Q

从慕课网自学的前端已经工作,工作中项目用到的东西很少,如何去快速地提升自己呢,还有就是原生JS学习到何种程度?自己在前端方向还在迷茫,前端的东西太多了,希望指点一二,谢谢

ustbhuangyi::慕课网学习的知识要学会举一反三,项目中也要多去运用学习的知识,不断巩固。尝试去做不同的事情而不是一味重复劳动。原生JS一定要熟练掌握,达到红宝书和犀牛书中的知识点理解完全没有问题的程度,并且在工作中也适当尝试用原生JS去写一些库和工具方法等等。



Q

我倒是蛮想问 一直在互联网创业团队里 有必要去bat学习一下么 以及 进bat都需要什么样的基本技能

ustbhuangyi:bat 是一座好学校,里面牛人众多,也会有系统的培训,开发流程也会很规范,能进去学习还是很不错的。一般来说, bat 看重的是基础和潜力 2 方面。基础包括专业方向的基础知识,不局限于某个框架;潜力包括(自驱、逻辑、学习能力)等等。当然,项目经验也很重要,如果你擅长的事情正是他们招人所需要的方向的话,会有加分的。



Q

Html css还可以,Js不精通,遇到问题没有思路,而且一般都用jquery,前端mvc框架也不会,感觉看不到希望,怎么办?

ustbhuangyi:你这种情况应该是属于基础比较差,还是需要恶补基础知识,需要比其他人更加努力,花更多的时间学习。建议去系统学习高程或者犀牛书,把书中的代码写一遍。原生 JS 掌握差不多了,再去选择一门 mvvm 框架系统的学习。



Q

老师,我感觉我的js编写能力不是太好,很多交互功能要实现的时候都没能思考到点子上,有时想到了思路方向,但是到写的时候还是会有迷糊的感觉

请问老师有什么方法可以提高这方面的能力?谢谢


ustbhuangyi:主要还是因为写的不够多,JS 不够熟练。对于常见的交互功能,先去找开源项目的源码,看看他们的实现思路和方法。先从模仿开始,同时多思考,再尝试自己去实现;思路一定要清晰,要看清问题的本质,把复杂的功能拆成几个功能的集合,逐个击破。最后也推荐学习我的课程,你会学到很多酷炫功能交互的实现和思想,相信会对你有所帮助。



Q

慕课网上的vue.js项目,大多数是在vue.cli脚手架上开发的,同学们项目做得很好,功能也都实现,但是前不久有同学在群里问,为什么能识别.vue结尾的文件这种问题(当时我就惊了)。我想问,在学习vue之前,是不是得去学习node的相关知识(慕课网的课程)和webpack相关课程(慕课网上的课程(1.X版本))。虽然vue的官网上面,建议新手不要使用脚手架来学习vue,但是不使用脚手架的话,用vue做一个成型的项目将会很复杂。考虑到慕课网上也有很多人初次接触vue就碰到vue-cli,老师后期能出一个脚手架方面的实战课程(慕课网现在的那个webpack版本好像是1.x版本)么?

ustbhuangyi:Vue-cli 是一个方便我们初始化 Vue 项目的非常好用的工具,它会帮我们配置好 webpack,方便我们的开发、调试编译和打包。Vue 和 webpack 也是天然配的,.vue 文件就是通过 vue-loader 来编译的,也是因为它,我们可以使用 runtime-only 的 Vue,可以不用写晦涩的 render 函数,而用 <template> 模板标签。对于 Webpack 的配置,我的第一门课程《Vue.js高仿饿了么外卖App 前端框架Vue.js 1.0升级2.0》有介绍,基于 webpack 1.x 版本的,2.x 版本的配置,这里有一篇介绍:https://github.com/DDFE/DDFE-blog/issues/10。不管是 1.0 还是 2.0,他们都有相通的地方,其实学习 webpack 最好的方式就是看官方文档,然后自己在一些项目中尝试自己动手配置一下。当然在以后的实战课程中,我也会考虑补充一下这块的知识,不会专门为webpack出实战,但是实战可以顺带介绍webpack~



Q

老师,目前都说JAVA是做大项目的,php是小项目,工资收入也没有java高,对这个你有什么看法?

另外市面上很多做APP的,据说原生的不多,一些大公司都是用的跨平台APP,用php也可以实现一个非原生的APP,那么就没有再学的必要了吗?

最后一个问题,我做PC前端的比较多,手机端框架太多了,感觉没有一个好用的,能不能推荐几个最适合做APP前端的UI框架。


ustbhuangyi:首先薪资和语言无关,和前端后端也无关,和能力相关;其次像滴滴,百度这样的大公司,php开发的居多;app属于前端的范畴,不是用后台语言开发的;移动端的产品一般都是面向用户的,所以都是有设计师出设计的,一般很难有非常通用的组件库。我建议还是多补充基础以及提升自身的能力比较重要,而不是面向薪资编程。



Q

老师,我没有vue基础,新手,怎么才能快速学会vue呢,好想学会

ustbhuangyi:首先去官网看文档,写几个小demo。对Vue基本语法和api熟悉后,可以先学习我的第一门课程高仿饿了么App,那门课程是一个小型规模的项目,也是手把手的教学,比较适合入门;学完并对课程内容掌握后,可以再去学习Vue的进阶课程音乐App;你除了能学到Vue的知识,还能学到好的编程思想和编码习惯,移动端开发技巧等等,当然学习的过程也要善于利用文档,多思考,多总结。



Q

3年前端工程师如何进阶?前端工程师未来发展方向有哪些?


老师 撸完了 高仿ele 接着撸 音乐播放器 next呢


ustbhuangyi:1. 工作3年,说明项目经验很丰富了,需要多沉淀,比如平时总结写一些技术文章;要尝试做不一样的事情,切忌重复劳动;对新技术要保持敏感和关注,尝试在项目中适当使用一些新技术;多看看一些优秀开源作品的源码,尝试做一些源码分析的工作;还是要读书,注意知识深度和广度 2 个方向的培养。


 2. 前端工程师未来有 2 个方向,一个是技术路线,做到架构师、专家这个级别;一个是转技术管理路线。这两个方向都需要你除了前端知识精通之外,也要对大前端和后端方面都要有所了解,因为那个时候,你就不仅仅是个前端了。





讲师介绍





讲师荐文推荐



点击下图,即可阅读




慕课网

程序员的梦工厂


在线编程 | IT技术 | 项目开发




想要学习ustbhuangyi讲师教程的,戳原文!
 
慕课网 更多文章 抽奖 | 双11实战大狂欢,“肾7”、iPad都给你准备好了! 新课速递 | Vue.js高仿饿了么外卖App 新课速递 | Android专项及自动化测试 Unittest测试 Fiddler抓包 新课速递 | 微信小程序入门与实战 常用组件 API 开发技巧 项目实战 图说架构系列 - 架构师的坎坷成长路
猜您喜欢 使用virtualenv管理多个Python版本 MySQL开发规范与使用技巧总结 想要《机器学习》《架构即未来》?猫友会免费送书 知来者之可追,有志者事竟成!程序媛加油! 抓包,只为让DBA过的更开心