摩登前端课程体系


你好,我是 Peter ,一个从 2006 年就全职做开发的人。最近几年我搞了一个好奇猫视频站。上面每周都发布一门课程。但是课程虽然多,其实都是围绕一个中心的,我把它起了个名字叫“摩登前端”,业界也有人叫“大前端”,基本说的知识体系是一样的。

什么是前端?

在互联网公司里面:一般开发团队中有三种人,后端,前端,还有设计师(公司里面一般把前端开发工程师就简称为前端)。设计师好理解了,就是用 photoshop,sketch 这样的软件作图的。那前端跟后端有什么区别呢?

先说相同点,这两种人都是写代码的。前端用的比较多开发语言就是 JS ,或者全称叫 Javascript ,当然也会用到 html 和 css 。开发出来的东西是用户能看到的能操作的,最常见的就是网页了。

后端,流派就比较多了,比如语言类型,我自己用过的就有 PHP ,Python ,Ruby 还有 Nodejs ,另外一种就是大家比较熟悉的 Java 了。其他的还有很多很多了。虽然优秀的前端对设计和后端都应该会一些。但是后端开发的内容显然不属于摩登前端课程体系的。

一个学了摩登前端的人,我们就叫他,摩登前端开发者。摩登前端开发者不要求能写后端,但是要能熟练的掌握如何去调用后端提供的 API 。 API 就是一个前端跟后端沟通的接口。API 能帮我们把数据存入数据库,从数据库读出来,或者在服务器上做各种运算。

总之,前端也叫客户端,前端代码运行在用户手机或者电脑上。后端也叫服务器端,后端代码运行在服务器上。

摩登前端和传统前端有何区别?

那你会说,哦,我明白了,前端就是把人家设计师做出的图,实现成能用的网页的代码狗,每天干的事情就是展示人家后端的 API 的数据。这个说法不能算错,但是属于比较传统上理解的前端了。那传统前端和我这里说的摩登前端有什么区别呢?

第一个,也是最大的一个区别就是:摩登前端引入了编译过程。也就是在代码写完之后,引入了编译这一步,先编译后运行。因为有了这一步,前端摆脱了各种限制,可以使用各种工具来提高开发效率。摩登前端开发者,可以用 React 框架和 Vue 框架,可以自由的选择 npm 生态下的数以万计的各种库,都是得益于有了编译这一步。从此前端开发者从每天有大量重复劳动的苦逼切图仔,变成了有了各种高级自动化技巧的前端工程师,这是锄头到联合收割机的转换。

第二个区别就是摩登前端是做 APP 的,不是做网页的,摩登前端写的代码当然是可以运行在 chrome/IE 这些浏览器上的,运行在浏览器里面的 APP ,有个术语叫 Web APP ,说白了就是网页 APP ,比如大家打开浏览器上天猫,天猫就是个 Web APP。但是同时,摩登前端的 APP ,还能运行在微信里面,也就是所谓的微信小程序。甚至也能变成原生 APP 直接装到手机(代表技术是 React-Native )或者电脑上(代表技术是 Electron) ,运行直接安装在手机或者电脑上的 APP ,传统上都是用 Java/C++ 来写,但是摩登前端开发者用 JS 写的,用户也看不出任何区别。因为我们做的是 APP ,或者叫应用程序。所以摩登前端开发的内容也不仅仅是纯界面,单纯的展示后端的数据了。前端程序中也越来越多的把原本在后端进行的运算移动到前端来运行。

最后一个区别,摩登前端拥抱微服务机构和无服务器架构,摩登前端的思路是前后端完全分离,前端代码变成了一个独立的程序。而在传统思路下,前端和后端是一体的,例如我之前做过五年的 Ruby On Rails 的网站就属于传统架构。摩登前端应用可能会调用几个来自不同厂商的 API 来实现各种常见功能,例如登录认证,搜索,数据存储,现在都有现成的厂商的接口可以拿来直接用。对于一些特殊功能,也不一定非要购买自己的服务器,而是可以直接调用云端的可自定义的函数接口来完成运算,业界知名的解决方案就是亚马逊的 lambda ,国内有阿里云的 Function Compute 服务。总之,随着微服务和无服务器架构的流行,未来后端工作会逐渐的被同质化封装,工作量会减少,而前端开发者在项目中会扮演更加主导型的角色。

学习路线图是?

目前比较火的摩登前端开发框架有两个,一个是 Vue ,另一个是 React 。摩登前端开发,可以说就是可以使用摩登开发框架进行开发。所以好奇猫上的学习路线图也是以框架为核心来学习。先学上手框架前必备的基础,然后学框架本身,最后学基于框架的高阶方法论和具体业务实战。

先说基础部分。基础中的基础,就是 Web 三大技术,包括 html 和 css 还有 JS 。HTML 和 CSS 负责界面的样式,相对难度小。JS 是咱们前端开发者的看家本事,相关的技术是 ES6 和面向对象编程的思想。然后是学习 npm 生态系统。npm 简单来说就是一种打包格式,这种格式的包已经有几十万个了,大部分都是可以用在 JS 项目中的插件。再就是学习 github ,这个世界上最大的开源软件托管平台,几百万职业开发者的代码都可以在上面找到,方便大家学习和参考。另外,对编辑器,命令行,版本控制,摩登开发者都应该具有自己的一套,这些在课程体系中都会有所体现。

再来说说框架本身。Vue 和 React 都很棒。好奇猫上目前是 React 的课程更多。基础好的人,其实学一套框架并不难。但是也别小瞧了框架。选择了一套框架就选择了一套方法论,也融入了一个同行们组成的社区。React 社区里面,你很快就会被大家推动着学习函数式编程,也很快就会被大家推动着逐渐放弃 jQuery 。我们会使用 Facebook 开发的 create-react-app 做开发环境,上面不仅仅可以编译 react 还可以编译 ES6 ,还有任何 npm 包。

最后是高阶方法论和业务实战。Redux 和函数式编程,测试驱动开发,这些都是我所谓的提高开发效率的方法论,也是任何的使用 React 企业里的高手每天都会用的内容。所以方法论,也不是为了要什么理论深度的,也就是为了提高开发效率。业务实战就好理解了,比如要开发一个电商网站,项目架构应该是怎样的,哪些插件是业界最流行的,使用的时候都有哪些坑。再比如要开发一个后台管理系统,为何大家都那么喜欢阿里巴巴的蚂蚁设计组件库,具体这套组件库怎么用。再有就是微信小程序怎么写等等,这些都是需要一些时间踩坑之后才能总结出成套的实践方案。

职业定位

学习写代码可以让我们更好理解和操作数据。所以编程应该是跟读书写字一样重要的基础技能。程序的本质是把人的智慧总结起来,让它可以自动化的执行,从而把人从重复劳动中解放出来。所以未来即使不是专职做程序开发的人,也应该会写程序,就像今天的人会用鼠标,会操作日常软件一样。

再说到前端开发这个具体领域。这个具体领域其实也逐渐变得越来越不具体了。以前写软件的人都是去一些互联网公司。现在,什么公司都会找写前端的,我有朋友在国家电网,在航天部门,也都是写前端的。另外现在新兴了一些领域,比如最近最火的区块链。我自己在 2004 年的时候专职搞过半年的区块链,所以我现在朋友圈里应该有上百个好友都是搞这个的。其实说实话很多都是原来跟我一样搞前端的,但是会编程对数据就敏感,学习区块链知识当然就比较快。另外一个事实是,即使是在区块链公司内部,也需要大量的专职前端开发人员。什么应用也得有界面,对不?要不怎么操作呀。所以有人说,物联网,人工智能,区块链,这些新兴的技术会取代前端开发,我自己的理解是不会的。

总结

总结一下,后端工作跟机器打交道多。前端跟人接触多。前端开发者,跟设计妹子有交集。后端开发者通过 API 的形式跟前端开发者沟通。前端,是一个科技跟艺术交叉,理性和感性交叉的工作。所以是非常有意思的。同时,前端开发也是企业目前需求最旺盛的一个领域,适合年轻人做职业转型。


欢迎所有朋友加我微信:happypeter1983