现代Web开发需要学习的15大技术

简介:

将近4年前,我写了一篇名为《Future of Web and Mobile: HTML5, CSS3 and Javascript》的博客文章,其中我提到了Javascript的出现,以及JavaScript框架,例如jQuery、Knockout等的爆 发。

快进到现在,我发现现代web开发再一次将发生压倒性的改变。信息资讯的铺天盖地令人迷惑,尤其对于初学者而言。首要原因是新的框架,例如 Angular 2和ReactJs出现了,使用了尚未完全定型的ECMAScript 6特性。并且有更多的工具可用于转换ES6代码为普通的旧的JavaScript代码,也就是ES5。

我概括了一系列我们应该学习的编程语言/工具,以便于理解势不可挡和快速变化的现代web开发。

JavaScript

这是唯一一种所有浏览器都理解的编程语言,并且它是前端开发的支柱。JavaScript也被称为ECMAScript,ES 5。在深入其他语言之前好好理解这门编程语言非常重要。

ES6

这是Javascript语言的扩展,而且许多浏览器正在实现ES6。好处是哪怕是现在,你也可以开始编写ES6代码,因为你可以使用 transpiler(转译器)如Babel来转换ES6代码为ES5代码。经历这些并了解新功能是一件好事。不过,没有不要钻研得太深因为它们很容易发 生变化。

Babel

这是最流行的ES6到ES5转译器之一。此外,它还被许多框架,如React所推荐。要想实时地将ES6转换为ES5代码,在https://babeljs.io/repl/有一个可用的REPL。

需要注意的是Babel不仅仅是ES6到ES5的转译器。它也是JSX到JavaScript的转译器。不知道什么是JSX?那么请看下面。

NodeJS

NodeJS是一个服务器端平台,它允许你用JavaScript语言构建后端。为什么我要提NodeJS呢?这是因为,即使你对后端开发不感兴趣,但是许多前端工具依赖于NodeJS。至少要熟悉node和它的命令行工具。

NPM

NPM是node的软件包管理器。就像pip之于Python,ruby gems之于Ruby,以及Maven之于Java。了解如何安装/删除/升级软件包,尤其是package.json文件结构。

Grunt或Gulp

这两个是运行在Node平台上最为流行的任务运行器。从技术上讲,它们是针对npm的软件包。它们允许你自动化许多前端任务,如Lint源文件,串联,缩减,部署以及更多。

Bower

这是用于前端库本身的一个软件包管理工具。想添加Jquery到你的应用程序?和使用bower install jquery一样容易。

上述工具用于基本的前端开发已经足够。不过下面我还要说一说两个最流行的框架,即React和Angular。

ReactJs

ReactJs是构建视图最流行的前端库。请注意,它不仅仅是MVC中的V,因此和框架如Angular没有比较性。ReactJs是用ES6写的,并且可以用Babel转译为ES5。它还使用也可以用Babel转译为JavaScript的JSX。

WebPack或Browserify

这两个都是最流行的模块打包机。它们可以获取js源代码,找出正确的依赖关系,并发出可以驱动整个应用程序的JavaScript文件。我更喜欢WebPack。点此查看关于WebPack。

Flux或Redux

React组件被布置在一个层次结构中。大部分时间,数据模型遵循层次结构。在这种情况下,Flux并不怎么有用。然而,有时候你的数据模型是不分层的。当你的React组件开始接收外部道具,或你有少量的组件开始变得非常复杂的时候,那么你可能会想要试试Flux。

Immutable.js

Immutable.js提供了一套数据结构,可以帮助解决在构建React app时的某些性能问题。这是一个伟大的库,你可能会在你的app中大量使用它,但是当你关注于性能影响时,它就完全没用了。

Angular 2

Angular 2是JavaScript中最流行的MVC框架之一的下一个版本。它被完全重新设计过了,并且有一条陡峭的学习曲线。全面支持双向数据绑定。在选择Angular 2开发时要小心评估。

TypeScript

Angular 2推荐TypeScript作为编程语言的首选。我不是很熟悉TypeScript,但我认为它增加了静态类型到Javascript的动态特性中。最后,我相信它只是一个转译器。

Service workers

实验性的API。它就像是在浏览器用于做各种工作的一个后台线程。我想它也增加对离线浏览的支持。

Fetch API和Push API

请自行阅读链接。因为到目前为止我自己对此也是知之甚少。

译文链接:http://www.codeceo.com/article/15-teches-web-developer-need.html
英文原文:Things to learn for Modern Web Development


作者:小峰

来源:51CTO

相关文章
|
2月前
|
算法 Java Go
【GoGin】(1)上手Go Gin 基于Go语言开发的Web框架,本文介绍了各种路由的配置信息;包含各场景下请求参数的基本传入接收
gin 框架中采用的路优酷是基于httprouter做的是一个高性能的 HTTP 请求路由器,适用于 Go 语言。它的设计目标是提供高效的路由匹配和低内存占用,特别适合需要高性能和简单路由的应用场景。
269 4
|
3月前
|
安全 Java API
Java Web 在线商城项目最新技术实操指南帮助开发者高效完成商城项目开发
本项目基于Spring Boot 3.2与Vue 3构建现代化在线商城,涵盖技术选型、核心功能实现、安全控制与容器化部署,助开发者掌握最新Java Web全栈开发实践。
410 1
|
6月前
|
缓存 JavaScript 前端开发
鸿蒙5开发宝藏案例分享---Web开发优化案例分享
本文深入解读鸿蒙官方文档中的 `ArkWeb` 性能优化技巧,从预启动进程到预渲染,涵盖预下载、预连接、预取POST等八大优化策略。通过代码示例详解如何提升Web页面加载速度,助你打造流畅的HarmonyOS应用体验。内容实用,按需选用,让H5页面快到飞起!
|
6月前
|
JavaScript 前端开发 API
鸿蒙5开发宝藏案例分享---Web加载时延优化解析
本文深入解析了鸿蒙开发中Web加载完成时延的优化技巧,结合官方案例与实际代码,助你提升性能。核心内容包括:使用DevEco Profiler和DevTools定位瓶颈、四大优化方向(资源合并、接口预取、图片懒加载、任务拆解)及高频手段总结。同时提供性能优化黄金准则,如首屏资源控制在300KB内、关键接口响应≤200ms等,帮助开发者实现丝般流畅体验。
|
前端开发 JavaScript Shell
鸿蒙5开发宝藏案例分享---Web页面内点击响应时延分析
本文为鸿蒙开发者整理了Web性能优化的实战案例解析,结合官方文档深度扩展。内容涵盖点击响应时延核心指标(≤100ms)、性能分析工具链(如DevTools时间线、ArkUI Trace抓取)以及高频优化场景,包括递归函数优化、网络请求阻塞解决方案和setTimeout滥用问题等。同时提供进阶技巧,如首帧加速、透明动画陷阱规避及Web组件初始化加速,并通过优化前后Trace对比展示成果。最后总结了快速定位问题的方法与开发建议,助力开发者提升Web应用性能。
|
6月前
|
JSON 开发框架 自然语言处理
【HarmonyOS Next之旅】基于ArkTS开发(三) -> 兼容JS的类Web开发(三)
本文主要介绍了应用开发中的三大核心内容:生命周期管理、资源限定与访问以及多语言支持。在生命周期部分,详细说明了应用和页面的生命周期函数及其触发时机,帮助开发者更好地掌控应用状态变化。资源限定与访问章节,则聚焦于资源限定词的定义、命名规则及匹配逻辑,并阐述了如何通过 `$r` 引用 JS 模块内的资源。最后,多语言支持部分讲解了如何通过 JSON 文件定义多语言资源,使用 `$t` 和 `$tc` 方法实现简单格式化与单复数格式化,为全球化应用提供便利。
264 104
|
6月前
|
JavaScript 前端开发 API
【HarmonyOS Next之旅】基于ArkTS开发(三) -> 兼容JS的类Web开发(二)
本文介绍了HarmonyOS应用开发中的HML、CSS和JS语法。HML作为标记语言,支持数据绑定、事件处理、列表渲染等功能;CSS用于样式定义,涵盖尺寸单位、样式导入、选择器及伪类等特性;JS实现业务逻辑,包括ES6语法支持、对象属性、数据方法及事件处理。通过具体代码示例,详细解析了页面构建与交互的实现方式,为开发者提供全面的技术指导。
286 104
|
6月前
|
开发框架 编解码 JavaScript
【HarmonyOS Next之旅】基于ArkTS开发(三) -> 兼容JS的类Web开发(一)
该文档详细介绍了一个兼容JS的类Web开发范式的方舟开发框架,涵盖概述、文件组织、js标签配置及app.js等内容。框架采用HML、CSS、JavaScript三段式开发方式,支持单向数据绑定,适合中小型应用开发。文件组织部分说明了目录结构、访问规则和媒体文件格式;js标签配置包括实例名称、页面路由和窗口样式信息;app.js则描述了应用生命周期与对象管理。整体内容旨在帮助开发者快速构建基于方舟框架的应用程序。
287 102
|
6月前
|
缓存 前端开发 应用服务中间件
Web端实时通信技术SSE在携程机票业务中的实践应用
本文介绍了携程机票前端基于Server-Sent Events(SSE)实现服务端推送的企业级全链路通用技术解决方案。文章深入探讨了 SSE 技术在应用过程中包括方案对比、技术选型、链路层优化以及实际效果等多维度的技术细节,为类似使用场景提供普适性参考和借鉴。该方案设计目标是实现通用性,适用于各种网络架构和业务场景。
199 1
|
7月前
|
缓存 前端开发 应用服务中间件
Web端实时通信技术SSE在携程机票业务中的实践应用
本文介绍了携程机票前端基于Server-Sent Events(SSE)实现服务端推送的企业级全链路通用技术解决方案。文章深入探讨了 SSE 技术在应用过程中包括方案对比、技术选型、链路层优化以及实际效果等多维度的技术细节,为类似使用场景提供普适性参考和借鉴。
284 7

热门文章

最新文章