1.基礎(chǔ)知識(shí)
學(xué)會(huì)下面這些基本知識(shí),能夠?qū)懗龌镜捻?yè)面,不同的布局樣式。
2.動(dòng)態(tài)性
動(dòng)態(tài)性是指通過 document 可以動(dòng)態(tài)修改 HTML 元素的樣式和布局,添加事件,獲取元素的 frame。
3.語(yǔ)言
學(xué)習(xí)某個(gè)方向的時(shí)候,需要深入學(xué)習(xí)它所用到的語(yǔ)言,這樣才能「更有效地寫好代碼」。前端主要的語(yǔ)言是 JavaScript,由它衍生出來(lái)的有 TypeScript,ESMScript。優(yōu)先掌握?JavaScript。
4. node.js
node.js 是前端必須要掌握的技能,它可以創(chuàng)建便捷的工具輔助前端便捷開發(fā)。可用于作為 web 服務(wù)。
5.框架
使用框架可以更快速、高效地實(shí)現(xiàn)業(yè)務(wù)邏輯。目前主流的是 React 和 Vue,需要深入掌握其中一個(gè)框架,san 是百度開源的 MVVM 框架。初學(xué)者有一個(gè)誤解,以為使用框架就不需要 HTML 和 CSS 了,事實(shí)不是這樣的
6.構(gòu)建工具
瀏覽器只能識(shí)別 HTML、CSS 和 JavaScript,所以不管使用什么框架寫的代碼最終都需要讓瀏覽器能夠識(shí)別。不同瀏覽器對(duì) JavaScript 的特性支持的不一致,可以通過構(gòu)建工具把 JavaScript 代碼轉(zhuǎn)換成瀏覽器能支持的。使用構(gòu)建工具也能夠做到性能優(yōu)化,比如壓縮代碼。
7.模塊化
模塊化可以方便地管理前端項(xiàng)目,使不同的業(yè)務(wù)拆分成不同的代碼,方便管理與維護(hù)。
8.開發(fā)與調(diào)試工具
前端開發(fā),首推 VSCode,學(xué)會(huì)這個(gè)IDE,也可以幫助你開發(fā)其它語(yǔ)言的項(xiàng)目,比如 python。另外需要掌握瀏覽器的調(diào)試技巧。
9.三方庫(kù)
前端開發(fā)中有些前端庫(kù)是很常用的,它適配了很多瀏覽器,對(duì)開發(fā)者比較友好。
10.資源
好的資源會(huì)達(dá)到事半功倍的效果。關(guān)于資源方面我只推薦 MDN,像那些一文搞懂 xxxxxx,10分鐘搞懂 xxxxxx。別做夢(mèng)了,學(xué)習(xí)沒有捷徑。想學(xué)好就必須系統(tǒng)深入學(xué)習(xí)。
11.瀏覽器工作原理
網(wǎng)頁(yè)最終由瀏覽器渲染,掌握瀏覽器工作原理是必須的。首先要搞懂HTTP,然后弄懂瀏覽器顯示一個(gè)頁(yè)面所要經(jīng)歷的過程。這也是我正在寫網(wǎng)絡(luò)編程相關(guān)內(nèi)容的初衷,網(wǎng)絡(luò)太重要了,處處多需要。
上面這些內(nèi)容,是我做前端以來(lái)總結(jié)出來(lái)的。我會(huì)按照上面的大綱逐步深入寫下去。目前正在寫第三階段網(wǎng)絡(luò)編程相關(guān)內(nèi)容。大家加油!!!