Web視角下的前端開發(fā)

• ?序言
• ?一、關(guān)于前端開發(fā)
• • 1. 起源、架構(gòu)、變遷
  • • （1）起源
    • （2）架構(gòu)
    • （3）變遷
  • 2. 前端應(yīng)用的領(lǐng)域
  • • （1）所面向群體
    • （2）所面向領(lǐng)域
  • 3. 語(yǔ)言、框架、工具
  • 4. 瀏覽器、網(wǎng)絡(luò)、服務(wù)器
  • 5. 前端學(xué)習(xí)路線圖
• ??二、關(guān)于Web標(biāo)準(zhǔn)
• • 1. 了解Web標(biāo)準(zhǔn)組織
  • • （1）四個(gè)概念
    • （2）概念細(xì)述
    • • 1）W3C
      • 2）Ecma TC39
      • 3）WHATWG
      • 4）IETF
  • 2. W3C與Ecma會(huì)員
  • 3. W3C規(guī)范制定流程
  • 4. Ecma TC39規(guī)范制定流程
• 🕰?三、結(jié)束語(yǔ)
• ??往期推薦

?序言

前段時(shí)間參加了青訓(xùn)營(yíng)，很榮幸聽到了紅寶書作者——李松峰老師的課，同時(shí)呢，在一次班會(huì)上，還見(jiàn)到了李老師真人👋

除此之外呢，還拿到了李老師犀牛書的親筆簽名😉

廢話說(shuō)太多啦！下面就讓我們跟著李老師的步伐，一起來(lái)探索 Web 世界的前端開發(fā)~

?一、關(guān)于前端開發(fā)

1. 起源、架構(gòu)、變遷

（1）起源

Web 起源于 1984 年，當(dāng)時(shí) Tim Berners-Lee 發(fā)布了一篇論文，隨著這篇論文的發(fā)表，隨之也代表了 Web 的誕生。

我們來(lái)看一下作者寫的一句話：

“Suppose all the information stored on computers everywhere were linked. 試想一下，在任何地方存儲(chǔ)的計(jì)算機(jī)，都可以相互的鏈接。 Suppose I could program my computer to create a space in which everything could be linked to everything.” 再試想一下，我可以在我的電腦中寫程序來(lái)創(chuàng)建一個(gè)空間，在這個(gè)空間里，一切東西都被相互連接著。 - Tim Berners-Lee, inventor of the World Wide Web

下面附上論文的網(wǎng)頁(yè)版和 PDF 版本：

👉論文網(wǎng)頁(yè)版

👉論文 PDF 版

很多人分不清 “上網(wǎng)” 是上的哪個(gè)網(wǎng)？即使在互聯(lián)網(wǎng)的誕生地也是如此。Web的普及和深入人可見(jiàn)一斑。

上網(wǎng)，其實(shí)指的是接入Internet，它是地球上相互連接的計(jì)算機(jī)構(gòu)成的網(wǎng)絡(luò)。計(jì)算機(jī)網(wǎng)絡(luò)誕生于上個(gè)世紀(jì)的 60 年代，標(biāo)志性通信協(xié)議是 TCP/IP 。

（2）架構(gòu)

1989年誕生時(shí)，Web由三種技術(shù)構(gòu)成： HTML 、 HTTP 、 URL 。

而 CSS 和 JavaScript 是幾年之后才出現(xiàn)的。

（3）變遷

對(duì)于 Web 來(lái)說(shuō)，有三個(gè)比較重要的變遷時(shí)期。分別是：

• 只讀時(shí)代
• 體驗(yàn)時(shí)代
• 敏捷時(shí)代

如下圖所示：

2. 前端應(yīng)用的領(lǐng)域

（1）所面向群體

對(duì)于前端應(yīng)用來(lái)說(shuō)，主要面向三類用戶。分別是： to B 、 to C 和 to D 。 to B 表示的是面向商業(yè)， to C 表示的是面向用戶， to D 呢，表示面向開發(fā)者。

（2）所面向領(lǐng)域

①前端應(yīng)用的領(lǐng)域之瀏覽器：

②前端應(yīng)用的領(lǐng)域之服務(wù)器：

③前端應(yīng)用的領(lǐng)域之跨端和終端：

3. 語(yǔ)言、框架、工具

我們用兩張圖來(lái)看看實(shí)際開發(fā)中常用的一些編程語(yǔ)言、框架以及工具。具體如下圖：

4. 瀏覽器、網(wǎng)絡(luò)、服務(wù)器

除了上面談到的，我們還要了解到瀏覽器中的一些內(nèi)容。如下圖所示：

文章傳送門：深入理解現(xiàn)代瀏覽器

同時(shí)，我們也要了解一些 HTTP 相關(guān)的知識(shí)。如下圖：

文章傳送門：An overview of HTTP

5. 前端學(xué)習(xí)路線圖

對(duì)于前端來(lái)說(shuō)，學(xué)習(xí)路線依據(jù)下圖：

對(duì)應(yīng)網(wǎng)站鏈接：https://roadmap.sh

在這個(gè)網(wǎng)站中，基本上涵蓋了所有方向的學(xué)習(xí)路線圖，大家可以根據(jù)自身需求進(jìn)行查看~

??二、關(guān)于Web標(biāo)準(zhǔn)

1. 了解Web標(biāo)準(zhǔn)組織

（1）四個(gè)概念

對(duì)于 Web 標(biāo)準(zhǔn)來(lái)說(shuō)，我們需要了解以下幾個(gè)概念：

• W3C: World Wide Web Consortium ；
• Wcma: Ecma International；
• WHATWG: Web Hypertext Application Technology Working Group ；
• IETF: Internet Engineering Task Force ；

（2）概念細(xì)述

下面我們就上面這四個(gè)標(biāo)準(zhǔn)來(lái)了解一些相關(guān)的內(nèi)容。

1）W3C

• 官網(wǎng)：https://www.w3.org
• Github：https://github.com/w3c
• 規(guī)范查詢：https://www.w3.org/TR

2）Ecma TC39

• 官網(wǎng)：https://www.ecma-international.org
• TC39：https://tc39.es
• Github：https://github.com/tc39
• Discourse：https://es.discourse.group

3）WHATWG

• 官網(wǎng)：https://whatwg.org/
• Github：https://github.com/whatwg
• 規(guī)范查詢：https://spec.whatwg.org/

4）IETF

• 官網(wǎng)：https://www.ietf.org/
• Github：https://github.com/ietf

2. W3C與Ecma會(huì)員

• W3C目前在全球有 444 家會(huì)員，其中北航總部（中國(guó)區(qū)）會(huì)員46家。
• Ecma的AM（Associate Member）會(huì)員目前有18家，中國(guó)公司有字節(jié)跳動(dòng)、360、阿里、華為、騰訊等5家。

3. W3C規(guī)范制定流程

現(xiàn)在，我們來(lái)了解一下 W3C 規(guī)范的制定流程，具體如下圖：

文檔傳送門：w3c規(guī)范制定流程

4. Ecma TC39規(guī)范制定流程

繼續(xù)，我們來(lái)了解 ECMA 規(guī)范的制定流程，具體如下圖：

文檔傳送門：ECMA規(guī)范制定流程、ECMA規(guī)范核心術(shù)語(yǔ)

🕰?三、結(jié)束語(yǔ)

到這里，我們就簡(jiǎn)單的了解了 Web 視角下的前端開發(fā)。不知道大家對(duì) Web 前端開發(fā)有了一個(gè)更深入的了解呢？

如果您覺(jué)得這篇文章有幫助到您的的話不妨點(diǎn)贊支持一下喲~~😛

??往期推薦

👉值得關(guān)注的HTML基礎(chǔ)知識(shí)

👉css還只停留在寫布局？10分鐘帶你探索css中更為奇妙的奧秘！

👉前端只是切圖仔？來(lái)學(xué)學(xué)給開發(fā)人看的UI設(shè)計(jì)

👉緊跟月影大佬的步伐，一起來(lái)學(xué)習(xí)如何寫好JS（上）

👉緊跟月影大佬的步伐，一起來(lái)學(xué)習(xí)如何寫好JS（下）

總結(jié)

以上是生活随笔為你收集整理的听红宝书译者谈Web视角下的前端开发的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。