在知乎上看到一個(gè)問題鳄厌，問題如下：
大二荞胡，學(xué)前端大半年了，html了嚎，css泪漂，js，jq歪泳，less萝勤，bootstrap這些不敢說精通，但也熟練掌握呐伞，項(xiàng)目也做了不少敌卓。最近學(xué)react的時(shí)候開始感覺力不從心了，之后再去了解webpack伶氢，npm趟径，node等簡(jiǎn)直一臉懵逼，各種配置命令行根本看不懂癣防，仿佛到了另一個(gè)世界蜗巧。到了這個(gè)階段應(yīng)該怎么繼續(xù)學(xué)下去呢，是我基礎(chǔ)知識(shí)不足的問題嗎蕾盯？
針對(duì)這個(gè)問題幕屹，我講講我的理解吧，暴力分割線預(yù)警
這種先易后難的學(xué)習(xí)現(xiàn)象其實(shí)不僅僅是在前端領(lǐng)域，在任何一個(gè)領(lǐng)域都是一樣的望拖。入門簡(jiǎn)單迅腔，隨著學(xué)習(xí)的不斷深入，需要學(xué)習(xí)的東西越來(lái)越多靠娱，越來(lái)越復(fù)雜，這是十分正常的掠兄。
你回想下你剛開始學(xué)數(shù)學(xué)的時(shí)候像云，是不是覺得很簡(jiǎn)單呢，1+1蚂夕，1-1迅诬。之后慢慢開始學(xué)乘法，學(xué)方程式婿牍，學(xué)積分侈贷，是否感覺越來(lái)越難，步履維艱等脂。
回到題主問的問題俏蛮。web前端其實(shí)在編程界是最容易入門的分支，其中html上遥，css搏屑，js，jq粉楚，less辣恋，bootstrap這些你都可以理解成數(shù)學(xué)中最簡(jiǎn)單的 加減乘除法，所以當(dāng)你稍微花點(diǎn)心思學(xué)習(xí)下html模软，css伟骨，js，你就發(fā)現(xiàn)你能開始寫頁(yè)面了燃异，做簡(jiǎn)單的項(xiàng)目了携狭。然后如果只是局限在做頁(yè)面，不管做再多項(xiàng)目回俐，你也只是一個(gè)頁(yè)面仔而已暑中，技術(shù)水平不會(huì)有所提升。這時(shí)你突然去接觸react鲫剿，webpack鳄逾，npm這些高級(jí)的前端框架和工具的時(shí)候，就如同從 1+1跳躍到解微積分灵莲，當(dāng)然會(huì)懵逼雕凹，覺得這還是前端嘛，我以前學(xué)的都是啥啊。
所以首先排除學(xué)習(xí)者自身的學(xué)習(xí)態(tài)度問題枚抵，我們假設(shè)大家都是努力學(xué)習(xí)的人线欲，題主說的問題其實(shí)是在前端領(lǐng)域的一個(gè)學(xué)習(xí)順序的問題。
一個(gè)簡(jiǎn)單的前端項(xiàng)目從開發(fā)到上線我認(rèn)為是要經(jīng)歷以下幾個(gè)步驟的：
1. 用html實(shí)現(xiàn)頁(yè)面結(jié)構(gòu)
2. css實(shí)現(xiàn)頁(yè)面樣式
3. js實(shí)現(xiàn)頁(yè)面交互
4. 使用壓縮混淆工具如 grunt或者gulp 處理css和js汽摹，減小css文件和js文件的體積李丰，從這個(gè)步驟開始其實(shí)就是前端項(xiàng)目的構(gòu)建了，也就是進(jìn)入到了題主所說的另一個(gè)世界
5. 部署項(xiàng)目
如果你一直局限在前三個(gè)步驟逼泣，那么當(dāng)然不會(huì)有什么進(jìn)步趴泌。 從第4個(gè)步驟開始就是真正需要去花大量時(shí)間研究學(xué)習(xí)的了。首先拿構(gòu)建工具grunt或者gulp舉例拉庶，如果說你對(duì)js十分熟練的話嗜憔，那么grunt或者gulp里面的每一行代碼你是能看的懂得，你需要學(xué)習(xí)的是
1. 這些工具為什么會(huì)出現(xiàn)氏仗，他在整個(gè)前端開發(fā)和構(gòu)建上線過程扮演者什么樣的角色
2. 他能實(shí)現(xiàn)哪些東西吉捶，每一項(xiàng)功能的具體代碼實(shí)現(xiàn)是怎么樣的
3. 為什么要這么來(lái)實(shí)現(xiàn)
按著這么個(gè)研究學(xué)習(xí)順序，你會(huì)發(fā)現(xiàn)這些東西都是通過很簡(jiǎn)單的無(wú)數(shù)的接口拼裝而成的皆尔。研究完一個(gè)工具呐舔，接著按照整個(gè)項(xiàng)目的工程順序，研究接下來(lái)需要哪些東西慷蠕。這樣的話學(xué)習(xí)webpack滋早，react等都和上文說到grunt沒有任何差別，自己也能循序漸進(jìn)砌们。
所以希望迷惘的人不要過于焦慮杆麸，認(rèn)清學(xué)習(xí)路徑，按部就班就行了浪感。
