2024年,我们该如何学习 WEB 前端开发?(1)

这一份代码是 2010 年写在 Node.js 官网的一段实例代码,机缘巧合之下我被这么一段简单的代码深深地吸引住了,虽然当时安装它仍需要从 GitHub 上克隆整个项目代码到本地并依次运行以下指令:

$ ./configure$ make$ make install

这一次编译就得花上至少十分钟,但完成安装后运行上面的一段代码,并在浏览器中打开 http://127.0.0.1:8124/,然后在浏览器上看到 Hello World 字样时仿佛新世界的门打开了。因为当时我所接触过的服务端程序只有 PHP,而 PHP 本质上就是一个模板引擎,它并不能很直观地处理请求本身而是借助 CGI 进行响应。能做更多的事情,这件事情对刚学习编程不久的新手来说是具有很大诱惑力的。

从这里开始,Node.js 配合 npm 便开始了长达 10 年的快速发展。从纯服务端应用开发,到开发工具、工程工具,再到如今的 FaaS(Function as a Service,Serverless)开发方式。Node.js 已经成为 Web 工程师不可或缺的一项技能,不管是用来开发服务端应用还是开发工具类应用,甚至是使用 Electron 开发桌面端应用还是配合 React Native 开发移动端 App,Node.js 能让前端工程师了解更多系统级别的概念,如网络、I/O、内存、文件系统等等,这些很多都是原本在浏览器端上看不到的。而学习这些知识对你理解前端开发背后的一些原理有非常好的价值,就跟学习算法一样。

结论:请学习 Node.js 和其中涉及到的一些基本计算机原理。


框架时代



当我在做 WordPress 主题的时候,绝大部分的主题开发者都会在前端做一些简单的效果,甚至有甚者会通过 JavaScript 实现一些原本只能通过后端来完成的事情,比如文章列表、文章内容的加载和渲染。而当年这些主题开发者基本上都会使用 jQuery 来进行这些 JavaScript 的操作,因为纯手写 JavaScript 在当时来说非常的繁琐(ES4时代,很多现在被广泛使用的原生 API 都仍未具备)所以当时 jQuery 就是大家的首选方案。

从非常早的 PrototypeJS、后来的 jQuery、进入 MVC 时代的 Backbone,AngularJS 开启 MVVM 模式,React 引入 FP 的概念,Vue 成功开启了渐进式开发体验的道路。一路下来一地的鸡毛,被各路人马诟病前端领域一个月开发一个新框架,“学不动了”。然而作为一个也写过框架、写过工具类库的开发者,我很喜欢用一个经常用于泛科技领域的例子来类比前端领域:

科技的终极目标,就是让人民感觉不到科技。

**jQuery 时代,**前端开发者使用 JavaScript 的模式是从页面中获取 DOM 元素,添加事件,然后通过 class 和 style 对页面进行动态地变更,以完成对用户行为的响应;

**Backbone 时代,**原本用在桌面端软件开发中的 MVC 模式被引入到了前端开发中,前端开发者们发现 Web 开发的复杂度已经需要用这些更成熟的开发模式进行管理了;

**AngularJS 时代,**从这里开始 Google 把数据双向绑定模式带到前端开发中,将原本需要通过 JavaScript 控制 DOM 元素这一繁琐的操作变成了只需要关心 Model 层需要改动什么内容即可。而 Vue 则将这种模式的开发成本降低到了一种相当可观的程度,让很多新手开发者也能很简单地入手这种便捷的开发模式。

React 时代,Facebook 的科学家们把函数式编程的思想引入到前端开发中,注重的是数据链路的可跟踪、可回溯、可管理,让整个数据链路是尽可能以单链路流转。

虽然前端领域常被说“一个月一个新框架”,但实际上每一个框架在迭代的过程中都是解决了它们所在业务场景的实际需求的,并不是“拍脑袋”地想要把每一个技术细节做出一个 break change。

而目前我目前推荐的学习的框架是 React 和 Vue:

  • 同样都是目前最流行的框架之一,而且可以预见未来 3~5 年内都是能满足找工作的需求的;

  • React:引入函数式编程(Functional Programming)的概念,使得写代码的思路更加严谨,更具有可维护性和逻辑可导性;

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值