按圖索驥系列之——從前端知識路徑圖開始

1. 覆盤，整理，再出發

入行前端也有一段時間了，從最開始的新奇，到如今的掌握。距離精通還有一段很長的路要走，可是如何在好奇心被知足的狀況下進一步提高本身。慢慢的變成了個人一個門檻。由於本身的狀態處在一個，問什麼，都能略知一二，而後想要進一步觸類旁通舉一反三。彷佛又差點什麼？想了好久，並非簡單地基礎不牢固之類。子曰，學而不思則罔。我所欠缺的，是一個總結，回顧。這就是我第一段的標題，也是爲何有這個系列的緣由：覆盤，整理，再出發。

2. 如何開始

這裏有個火過的前端路徑圖。它的副標題是一步步稱爲現代前端的開發者。這是一張很是粗略的地圖。剛好能夠做爲個人總綱。在這裏起步，拋轉引玉。利用萬能的 google 以及廣大的同行們不斷的積累，來梳理出更清晰的脈絡圖。

在一切開始以前，我打算使用「三步走」的方法論，來指引文章主體思路。即：是什麼？爲何？怎麼作？

是什麼？

這個問題須要回答概念性的內容，進一步拓展路徑圖。好比咱們在 HTML 分類下，只能看到：

• HTML
  • 學習基礎
  • 書寫語義化 HTML
  • 基礎 SEO
  • 可訪問性

這個路徑可謂是至關粗糙，可是不要緊接下來就是咱們自由發揮的空間了。順着【學習基礎】這個結點，經過查閱 W3C 對於 HTML 5.2 的規範來了解。固然，具體的規範你們能夠經過這個連接查閱。只是這裏面事無鉅細的定義了很是多的內容，咱們沒有必要去學習茴香豆有幾種寫法，也須要在細枝末節之間找到一個平衡。如下列表是我通過瀏覽 HTML 5.2 目錄來提煉的一份列表。接下來的日子中，咱們會針對這個列表展開學習 HTML 的基礎知識，讓咱們覆盤整理，再出發。

• HTML
  • 學習基礎
    1. 背景知識及簡介
    2. 常規的基礎架構
    3. 語義結構和 HTML 文檔的 API
    4. HTML 元素
    5. 用戶交互
    6. 加載 Web 頁面
    7. Web 應用接口
    8. HTML 語法
    9. XML 語法
    10. 渲染
    11. 廢棄特性

細心的同窗會發現，我其實在這裏是翻譯了 HTML 5.2 的目錄，固然，接下來梳理中，並不會對以上目錄逐一詳解。由於這是工程浩大的體力活，不必，也沒有意義。咱們須要掌握的更多應該是能夠指導咱們編寫和理解 HTML 代碼的內容。至於一些更深刻的背景知識和細節，就讓它在規範裏躺着，供學有餘力的同窗參閱吧。

拿即將開始的一節標題內容： 4. HTML 元素 來舉例。這能夠說是最簡單也最親民的路線。首先咱們須要搞清楚什麼是 HTML，對於簡單的概念性問題，我將以超連接和搜索引擎的結果或者關鍵字整理來展現。不打算作文字搬運工和復讀機。由於我相信，一個入行前端的同窗一定是有必定的信息檢索能力。咱們欠缺的，是概括和整理。這也是開始本系列的緣由。HTML 定義 在 MDN 中十分清晰。咱們須要深刻的是，何謂「標記語言」，它與編程語言的區別在哪裏？更進一步，編程語言的定義是怎樣的？當咱們搞清楚了以上問題，就同時回答了 what 和 why 的問題。接下來，how 該如何去作，我打算用一些簡單測驗來做爲每一章的結束。而後以此來不斷提出新的問題，螺旋式上升，像多周目同樣。一步步到達咱們期待的高處，去俯瞰更遠的風景。

本期內容做爲開篇，只是羅列了一些方法論，同時想聽聽廣大同行們的意見。 讓咱們一塊兒來整理一份，屬於本身的知識地圖。