1.1 Web 前端工程入门简介

优质
小牛编辑
127浏览
2023-12-01

Web 前端工程入门简介

前言

随着现代化网页(Modern Web)开发专业和複杂性的提昇以及对于使用者体验的要求下,网页开发已从过去的 Web Developer 一夫当关,转向专业分工,更加细分成网页前端(Web Front End)、网页后端(Web Back End)等职位。此外,由于跨平台、跨浏览器的需求日益增加,技术变化更迭快速,市场上对于前端工程师(Web Front End Engineer)的需求也与日俱增,前端工程的(Front End Engineering)所要面对的挑战也越来越多。

Web 前端工程入门简介

前端工程範畴

事实上,在目前的业界,前端工程的定位光谱非常广泛,有聚焦在网页设计(Web Design),也有专注在软体工程(Software Engineering)的部份,本书则是将前端工程定位在软体工程的範畴。而 HTML、CSS 和 JavaScript 是前端工程最重要的技术基础。过去一段时间,我们所认为的前端工程主要专注在浏览器平台,但现在的 Web 平台已经不再侷限于桌面浏览器,而是必须面对更多的跨平台、跨浏览器的应用开发场景,其中包含:

  1. 网页浏览器(Web Browser),一般的网页应用程式开发
  2. 透过 CLI 指令去操作的 Headless 浏览器(Headless Application)。例如:phantomJSCasperJS
  3. 运作在 WebView 浏览器核心(WebView Application)的应用。例如:Apache CordovaElectronNW.js 等行动、桌面应用程式开发
  4. 原生应用程式(Native Application),透过 Web 技术撰写原生应用程式。例如:React NativeNative Script

过去几年,前端开发就像经历了文艺复兴(Rinascimento)的年代,开始了各种框架、套件百花齐放的时代。虽然现在有更多好用工具可以协助开发,但前端工程师似乎并没有变得比较轻鬆。以往若能妥善运用 jQuery 等函式库就可以应付大部分前端工程师的工作,但现在前端徵才广告上不仅要求精通 HTML、CSS 和 JavaScript,还要对于还要对于 BackboneEmberAngularReactVue 等 JavaScript 框架或函式库有一定程度的了解。

在众多 JavaScript 框架或函式库中,React 是 Facebook 推出的开源 JavaScript Library,它的出现让许多革新性的 Web 观念开始流行起来,例如:Virtual DOM、Web Component、更直觉的宣告式 UI 设计、更优雅地实现 Server Rendering 等。接下来本书将透过介绍 React 生态系(ecosystem)带领读者入门 React 的世界,让读者可以从零开始真的动手用 React 开发跨平台应用程式。