前言

前言很簡(jiǎn)單，因?yàn)榫蚪鸪隽藗€(gè)技術(shù)盤點(diǎn)的話題，哈哈哈哈

但是我覺(jué)得這個(gè)話題蠻有意思的，可以看看大家的技術(shù)廣度，可以進(jìn)行分享和學(xué)習(xí)以及討論

所以這里說(shuō)一下我對(duì)我的前端技術(shù)，做一下盤點(diǎn)和總結(jié)

因?yàn)槲业拈_(kāi)發(fā)年限有限，所以我覺(jué)得我的盤點(diǎn)更適合0-3年的前端人群，所以技術(shù)范疇沒(méi)有高年限大佬那么廣，請(qǐng)見(jiàn)諒~

個(gè)人技術(shù)棧

我對(duì)我的較為熟悉的、主要的前端技術(shù)棧做個(gè)介紹，然后分段進(jìn)行一下總結(jié)

Vue、TS、小程序、UniAPP、ThreeJS、Node后端、鴻蒙（目前我先放在前端這里，如果你說(shuō)歸屬于移動(dòng)端，那也沒(méi)問(wèn)題）

Vue

在國(guó)內(nèi)Vue和React的爭(zhēng)論一直存在，但是我覺(jué)得并無(wú)優(yōu)劣之分，都是很優(yōu)秀很好的框架，與原生相比，二者都方便了我的開(kāi)發(fā)

并且二者的生態(tài)也很好，有很多周邊的庫(kù)，以及衍生的上層框架

我覺(jué)得討論好壞是意義不大的，如果你覺(jué)得不好的話，可以不去使用自己不心儀的框架，并且大可以去自己做一個(gè)更好的開(kāi)源框架，或者是哪里讓你覺(jué)得不舒服了，大可以提個(gè)PR

我覺(jué)得討論這個(gè)意義真的不大，但是我們可以去討論一下框架的實(shí)際作用，在我們工作或者開(kāi)發(fā)層面有沒(méi)有幫助

在國(guó)內(nèi)，Vue的使用范圍是不用多說(shuō)的，不管它是不是培訓(xùn)機(jī)構(gòu)或者是什么別的原因普及的，但是在國(guó)內(nèi)，Vue足夠熟練的話，大概率是能有個(gè)工作的（當(dāng)然，并不完全，畢竟環(huán)境如此嚴(yán)峻）

在國(guó)外的話，Vue也有不少，但是遠(yuǎn)不及國(guó)內(nèi)這么普遍，這是一個(gè)不爭(zhēng)的事實(shí)，所以如果你真的想去國(guó)外，或者是找遠(yuǎn)程的話，學(xué)React我覺(jué)得是比較有必要的，當(dāng)然，這只是個(gè)建議

而且就是在國(guó)內(nèi)，要求React和Vue都會(huì)的的好像也慢慢變多了

所以我真的覺(jué)得，這已經(jīng)不是需不需要學(xué)的了，好像二者都要會(huì)似乎是必須技能了？但是也不用太擔(dān)心，不考慮源碼層面，其實(shí)上手另一框架進(jìn)行開(kāi)發(fā)是很快的~

Nuxt

關(guān)于Nuxt，大家都知道它是Vue的一個(gè)上層框架，處理SSR問(wèn)題的，目前是Nuxt3的版本

首先，我沒(méi)什么資格討論這個(gè)框架的優(yōu)劣

我說(shuō)一下我的開(kāi)發(fā)體驗(yàn)，約定大于配置的原則貫穿了這個(gè)框架，但是也因此有一定的學(xué)習(xí)成本，而且在國(guó)內(nèi)大部分的公司，好像沒(méi)用上Nuxt，至少在招聘要求上，Nuxt好像不怎么提，但是在一些大廠我是知道在用SSR的，之前我在某廠的時(shí)候用的Next

我并不清楚大家在公司是否業(yè)務(wù)上會(huì)用到這個(gè)框架，但是我之前在國(guó)企給公司做官網(wǎng)的時(shí)候，提出用Nuxt做，被無(wú)情否決了，原因有幾方面吧

這是我當(dāng)時(shí)的開(kāi)發(fā)任務(wù)表

• 成本問(wèn)題，公司人員為了這官網(wǎng)需要學(xué)習(xí)一個(gè)新的框架嗎，而且資源并不多，穩(wěn)定性誰(shuí)也無(wú)法保證
• 真的需要這個(gè)SSR嗎
• Nuxt全棧對(duì)于一個(gè)技術(shù)主管是Java出身的人，毫無(wú)優(yōu)勢(shì)

后來(lái)我從公司離職了，現(xiàn)在我也不知道用了什么技術(shù)棧做的官網(wǎng)，不排除JSP的可能性，這里大家會(huì)說(shuō)JSP遠(yuǎn)古時(shí)代的東西了，但是技術(shù)主管也是從那個(gè)時(shí)代過(guò)來(lái)的，而且JSP在服務(wù)端渲染上還是鼻祖級(jí)別

那么Nuxt好嗎？我覺(jué)得對(duì)學(xué)Vue的人來(lái)說(shuō)，真的是個(gè)不錯(cuò)的框架，當(dāng)然除了SSR，你做官網(wǎng)也可以有SSG的選擇，但是Nuxt作為一個(gè)框架來(lái)說(shuō)更為完善，我覺(jué)得目前更適合個(gè)人網(wǎng)站層面的開(kāi)發(fā)

可惜的是，我在Github瀏覽的時(shí)候，Nuxt好的項(xiàng)目比較少，尤其是Nuxt3的項(xiàng)目，當(dāng)然，這是在上半年的時(shí)候了，而且目前市面上Nuxt教程也不足，為學(xué)習(xí)帶來(lái)一些不小的挑戰(zhàn)

同時(shí)Next的資源會(huì)更多一些

總的來(lái)說(shuō)，我覺(jué)得SSR框架是很好的趨勢(shì)，也很有學(xué)習(xí)的必要~

TS

今年罵TS的人格外多，什么什么取代TS的文章都很火，遺憾的是，我還并沒(méi)有去使用JSDoc,我無(wú)法進(jìn)行比較層面上的討論，所以我只能說(shuō)一些我關(guān)于TS的看法

我個(gè)人覺(jué)得，你可以把JS和TS看成是兩門語(yǔ)言

在封裝層面，我覺(jué)得TS對(duì)我的幫助是比較大的，因?yàn)樵谄綍r(shí)開(kāi)發(fā)中，我封裝組件以及hook比較頻繁，我覺(jué)得TS帶給我的體驗(yàn)層面是不錯(cuò)的

在頁(yè)面開(kāi)發(fā)層面，其實(shí)TS大部分是做一些提示，甚至在寫(xiě).vue組件的時(shí)候，看到TS的地方并不是很多，看到的也是引入封裝過(guò)一些限制

有一個(gè)東西比較有意思，就是Typescript類型體操方面，這可能算是一個(gè)拔高的地方？在面試中會(huì)遇到？我并不是很清楚，但是我看的其實(shí)比較頭疼。。真的不想看，而且我面試沒(méi)被問(wèn)過(guò)類型體操。。

說(shuō)實(shí)話，并沒(méi)有仔細(xì)地去研究這方面，因?yàn)榫臀椰F(xiàn)在的開(kāi)發(fā)過(guò)程中，復(fù)雜的類型體操過(guò)于加大了我的開(kāi)發(fā)難度，而且實(shí)在用不上，當(dāng)然，可能是我開(kāi)發(fā)的項(xiàng)目過(guò)于簡(jiǎn)單，可能大佬們?cè)诖箜?xiàng)目的開(kāi)發(fā)過(guò)程中已經(jīng)熟練于心了

那么TS要學(xué)嗎？我的建議是需要的，因?yàn)楣卷?xiàng)目很多都在用，但是就我接觸的項(xiàng)目中來(lái)說(shuō)，TS的使用并不復(fù)雜，合理地運(yùn)用TS會(huì)讓項(xiàng)目更有健壯性，可以放心食用~

當(dāng)然，如果你覺(jué)得js足夠，那也沒(méi)有任何問(wèn)題，js就是這么一個(gè)奇妙的語(yǔ)言~

小程序、uniAPP

這二者我放在一起了，比較類似

小程序開(kāi)發(fā)似乎是前端必備的一個(gè)技能了，目前主要是兩種開(kāi)發(fā)方式

微信原生開(kāi)發(fā)、UniAPP開(kāi)發(fā)

其實(shí)如果是單單開(kāi)發(fā)微信小程序的話，我覺(jué)得原生的體驗(yàn)會(huì)好一些，我覺(jué)得這比較好理解，簡(jiǎn)單來(lái)說(shuō)，微信原生小程序就是干小程序的，是官方的，而Uni會(huì)有一些限制，而且在調(diào)試的時(shí)候還要配合小程序的開(kāi)發(fā)工具

但是如果你考慮多端的話，那么答案也比較簡(jiǎn)單了，肯定是uni

我其實(shí)是uni的粉絲，uni對(duì)于我這種個(gè)人開(kāi)發(fā)者可以說(shuō)是福音，它提供了一個(gè)完整的全棧生態(tài)，如果你說(shuō)小程序也可以用云開(kāi)發(fā)，沒(méi)問(wèn)題，但是在我當(dāng)時(shí)使用的時(shí)候云開(kāi)發(fā)的體驗(yàn)和功能方面的確不是uni，而且uni全棧的生態(tài)做的的確很好

而且uni對(duì)我這種想獨(dú)立做產(chǎn)品的獨(dú)立開(kāi)發(fā)者來(lái)說(shuō)，的確很方便

有很多人說(shuō)小程序、說(shuō)uni哪哪有問(wèn)題，都是bug，真難用

其實(shí)，這也是我想說(shuō)的。。這二者的開(kāi)發(fā)體驗(yàn)相較于正常的pc的確沒(méi)法比

但是不可否認(rèn)的是，小程序在國(guó)內(nèi)的用戶使用度太高了，我曾經(jīng)做自己產(chǎn)品的時(shí)候，讓很多人幫忙填了問(wèn)卷，就是產(chǎn)品的形式，大致是下面幾種

• App
• H5
• PC
• 小程序

App和小程序占了90%，而二者之間小程序比App還高了一些

所以我覺(jué)得小程序是沒(méi)有辦法的辦法，如果有一天小程序真的沒(méi)有用戶了，那我真的放倆掛鞭慶祝一下

同時(shí)我需要吐槽的是小程序的組件庫(kù)的確很少，基本上就選Vant吧，Tdesign小程序版的真的不好用，別的我也沒(méi)用過(guò)，也不想試了。。要是varlet能做小程序的就好了(狗頭)

那么學(xué)還是不學(xué)呢？我的建議是如果需要用了再學(xué)即可，二者的學(xué)習(xí)成本不高，大部分可以直接做項(xiàng)目入手，文檔也比較完善

Threejs

今年比較熱門的話題了，前端可視化，數(shù)字孿生，3D大屏，貌似很多人不知道卷什么，看3D這玩意高級(jí)，就都卷ThreeJs去了（babylonjs爆哭，為啥沒(méi)有卷我）

很多人覺(jué)得3D很難，沒(méi)錯(cuò)，的確很難，但是難的是openGL，并不是three，難的是高級(jí)用法，例如著色器，而不是做個(gè)智慧廠房

拿我來(lái)說(shuō)，你讓我做個(gè)那種炫酷的高大上的粒子效果，還有很多國(guó)外的炫酷小游戲，炫酷的特效，那對(duì)不起，我真不太行，但是你拿個(gè)現(xiàn)成模型，讓我做個(gè)廠房，地下室，管道，這其實(shí)是不難的。。這也是我當(dāng)時(shí)做的東西

而國(guó)內(nèi)大部分的公司也就是要后者而已，所以沒(méi)必要擔(dān)心自己學(xué)不會(huì)，網(wǎng)上資料這么多，而且大家都有資源，沒(méi)必要過(guò)于擔(dān)心

同時(shí)，現(xiàn)在可視化會(huì)和零代碼或者是低代碼配合在一起，比如帆軟的產(chǎn)品

再或者是專注于可視化產(chǎn)品解決方案的公司，以thingjs舉例

我覺(jué)得是比較鮮明的例子，可以沒(méi)事看看

「沒(méi)有打廣告，就是大家可以去關(guān)注一下現(xiàn)在市面上可視化的一些產(chǎn)品，從而進(jìn)行思考」

Node后端

這是我最想說(shuō)的一個(gè)話題

我理解的Node后端的框架大致是下面這些（包括但不完全）

express、koa、koa2、egg、nest

這是我學(xué)過(guò)并應(yīng)用過(guò)的一些，我說(shuō)說(shuō)我的看法

「前端有必要有一些后端的思維」

「有必要學(xué)習(xí)一下這種Node后端的框架」

「但是如果你沒(méi)什么基礎(chǔ)，沒(méi)必要學(xué)習(xí)太復(fù)雜的」

在國(guó)內(nèi)，express、koa、egg其實(shí)應(yīng)用已經(jīng)不少，甚至我之前在公司的時(shí)候也會(huì)去用express、koa去寫(xiě)插件

而且最關(guān)鍵的是，expres、koa這種的框架學(xué)習(xí)成本不高，并且已經(jīng)足夠你有一定的后端思維了

而nest，我其實(shí)不是特別推薦初級(jí)前端去學(xué)習(xí)，至少在國(guó)內(nèi)的話，我覺(jué)得是這樣的，但是國(guó)外大可以去選擇

首先，nest的上手難度對(duì)于前端來(lái)說(shuō)不低，作為Java出身的我，看到nest真的很親切，但是更覺(jué)得nest在國(guó)內(nèi)的受眾不太行

雖然工作的年限不長(zhǎng)，但是其實(shí)我在好多公司待過(guò)，有大廠、有國(guó)企，但是在國(guó)內(nèi)的公司，很難去選擇nest去做公司后端架構(gòu)（很少，但是不完全）

90%以上會(huì)選擇Java、甚至是Go等等，而且會(huì)使用express、koa去做插件，但是基本上不會(huì)去選擇nest

可能會(huì)被很多nest的噴，因?yàn)楝F(xiàn)在nest天天被推薦，其實(shí)我并不否認(rèn)，nest真的是個(gè)很好的框架，他很優(yōu)秀，但是我只是覺(jué)得它不適合國(guó)內(nèi)

你可能會(huì)說(shuō)，nest可以做完整的系統(tǒng)，分布式啥的都沒(méi)問(wèn)題，但是國(guó)內(nèi)還是直接用spring全家桶

你說(shuō)一說(shuō)nest對(duì)比spring的優(yōu)勢(shì)在哪呢，尤其是在國(guó)內(nèi)是后端偏技術(shù)主導(dǎo)的情況下

當(dāng)然如果你的公司技術(shù)選擇了nest，那真的很棒，是有助于技術(shù)提升的！

當(dāng)然如果你真的想去學(xué)習(xí)更系統(tǒng)的Node后端，那么可以去學(xué)，或者說(shuō)你公司真的用到了，也可以去學(xué)，你會(huì)收獲很多東西

我覺(jué)得資深的前端可能更適合，因?yàn)樗麄兛赡軟](méi)什么可學(xué)的了。。但是對(duì)于初級(jí)來(lái)說(shuō)，真的適合嗎

同時(shí)目前有些大佬出的課其實(shí)是很不錯(cuò)，質(zhì)量很高，就不說(shuō)具體名字了，畢竟這里不是打廣告

鴻蒙

這里我把鴻蒙放在前端的范疇了，是因?yàn)槲矣X(jué)得我作為一個(gè)前端愛(ài)好者，入手鴻蒙很絲滑，并且覺(jué)得沒(méi)什么門檻

當(dāng)然，flutter的小伙伴也這么覺(jué)得，所以你們說(shuō)這算是移動(dòng)端我也沒(méi)什么意見(jiàn)~

最近我出了一套鴻蒙的教學(xué)，開(kāi)了一個(gè)專欄，起因是最近鴻蒙在掘金很火，但是教學(xué)偏少，于是就出了一些文章帶著大家入門一下

就我個(gè)人覺(jué)得吧，目前鴻蒙其實(shí)是有不少問(wèn)題的，文檔有問(wèn)題，生態(tài)不完善，真機(jī)卡頓等問(wèn)題，開(kāi)發(fā)體驗(yàn)真的蠻差的

所以我推薦可以當(dāng)做愛(ài)好進(jìn)行學(xué)習(xí)，但是說(shuō)要是當(dāng)飯碗來(lái)學(xué)習(xí)，至少得看明年Next版本怎么樣才能繼續(xù)說(shuō)下去

因?yàn)槲也皇桥嘤?xùn)機(jī)構(gòu)，是一個(gè)比較客觀的角度，所以實(shí)話實(shí)說(shuō)我覺(jué)得作為一個(gè)前端來(lái)說(shuō)，學(xué)上面的東西遠(yuǎn)比學(xué)習(xí)鴻蒙性價(jià)比來(lái)的高

雖然我會(huì)繼續(xù)做鴻蒙的專欄，但是并不代表我就很推薦去學(xué)，因?yàn)榫褪区櫭赡奶煺娴氖袌?chǎng)真的起來(lái)了，你現(xiàn)學(xué)也來(lái)得及~

而且那時(shí)候生態(tài)也比較完善了，對(duì)我來(lái)說(shuō)，我只是覺(jué)得很感興趣，而且比較享受這種探索的感覺(jué)，才去做的

其它

有很多沒(méi)細(xì)說(shuō)的技術(shù)，因?yàn)槠鋵?shí)我覺(jué)得區(qū)別不大，比如React和Next，我覺(jué)得就是對(duì)比Vue和Nuxt

還有一些了解并不深的東西，比如低代碼，微前端

很遺憾，我并沒(méi)有接觸過(guò)這二者，所以無(wú)法進(jìn)行建議和評(píng)價(jià)（但是貌似口碑都不太好？）

還有就是webcomponent，其實(shí)這真的是個(gè)不錯(cuò)的東西，但是受眾真的很小（這不是個(gè)新東西，這么多年了也沒(méi)多火）

我覺(jué)得是國(guó)內(nèi)更注重產(chǎn)出多一些，而不是技術(shù)探索方面

還有比較熱門的Rust，也很不錯(cuò)，國(guó)外和開(kāi)源上面廣受好評(píng)，并且很適合基建方面，但是對(duì)于咱們這小開(kāi)發(fā)來(lái)說(shuō)，倒也先不用在意

還有關(guān)于前端單測(cè)方面，這個(gè)其實(shí)我用的很多，但是基本是在開(kāi)源項(xiàng)目當(dāng)中，因?yàn)楹芏嚅_(kāi)源項(xiàng)目你不走單測(cè)的話，PR是不給過(guò)的，現(xiàn)在我主要是vitest，比jest要好用不少，但是這玩意，大家在平時(shí)公司開(kāi)發(fā)的話，能用到多少呢，公司有沒(méi)有正規(guī)的CR都不一定

關(guān)于monorepo也不是啥新東西了，也談不上趨勢(shì)不趨勢(shì)的

還有一個(gè)是組件庫(kù)的問(wèn)題，尤其是Vue的，最近ElementPlus不知道為什么天天被噴

其實(shí)現(xiàn)在來(lái)看ElementPlus的確是有一些過(guò)度封裝的意思，但是我覺(jué)得目前ElementPlus依舊還是Vue3組件庫(kù)的典范，當(dāng)然還有很多組件庫(kù)很優(yōu)秀，不一一列舉了，如果你覺(jué)得ElementPlus不好的話，大可以自己去搞一個(gè)，開(kāi)源出來(lái)，給XDM開(kāi)開(kāi)眼，而且別的組件庫(kù)我也都用過(guò)，別說(shuō)有多多好用了。。反正我最開(kāi)始用的是AntdVue我的使用體驗(yàn)。。。（當(dāng)然，也很優(yōu)秀?。?/span>

我想說(shuō)的是，人家開(kāi)源出來(lái)給你簡(jiǎn)化開(kāi)發(fā)過(guò)程的，你覺(jué)得不好可以提issue，提PR，而不是整天說(shuō)這個(gè)不好，那個(gè)不好，沒(méi)太大意義

結(jié)尾和建議

這里更多是對(duì)初級(jí)一些的前端朋友，跟我差不多年份的

高級(jí)、資深的佬就當(dāng)看個(gè)樂(lè)就行

如果你會(huì)Vue的話，建議學(xué)一下React，工作幾率會(huì)變高的

面試八股越來(lái)越少了，就是八股也是偏難一些的八股了，基本就是挖項(xiàng)目了，或者是場(chǎng)景題

當(dāng)然，大廠的話還是那樣，會(huì)多考一些計(jì)網(wǎng)和操作系統(tǒng)

可以去試著看一些源碼，并不是Vue或者是React的，因?yàn)榭赡芸雌饋?lái)并不容易，但是可以去看一些組件庫(kù)的項(xiàng)目，比較容易懂一些，學(xué)一些思路和封裝我覺(jué)得對(duì)能力是很有提升的

工作難找，我發(fā)現(xiàn)初級(jí)的難找，佬也難找，所以也沒(méi)必要過(guò)于焦慮，只能繼續(xù)學(xué)下去

國(guó)外遠(yuǎn)程比較火，技術(shù)棧偏向React全棧（React、Next、nest），看了一些佬的文章，看的那些招聘網(wǎng)站技術(shù)棧基本都是這樣的

別想著學(xué)Java啥的。。沒(méi)必要

加油吧，學(xué)無(wú)止境~