本篇文章給大家談談小程序開發(fā)技術棧，以及小程序全棧開發(fā)對應的知識點，希望對各位有所幫助，不要忘了收藏本站喔。

小程序開發(fā)和App開發(fā)有什么區(qū)別，哪個好學一些？

小程序有很多種，微信小程序、釘釘小程序 等等。而App也分分了好幾個陣營。

我們現(xiàn)在說的小程序一般都是基于H5的，或者說語法非常的類似，配合js和css樣式達到相應的顯示效果。開發(fā)時涉及的技術棧主要是h5、css、js 相關的。

App 來說也分原生App 和 H5 App 還有就是混合開發(fā)的。原生App來說體驗好，Android app主要的開發(fā)語言是java和Kotlin，iOS 的app開發(fā)語言是Objective-C 和 swift。原生App需要了解平臺語言和相關的UI框架。

混合App 也有很多框架類似ionic 等等，這部分需要了解相關的js，例如Angularjs reactjs vue.js 等等，體系也很多。

谷歌的flutter 號稱跨平臺開發(fā)，使用的是dart語言。這也是近幾年推出的。

總的來說難易程度上小程序應該會更容易一些吧。當然這也是因人而異。

盤點 7 個超棒的微信小程序項目

小程序上線后，改版了很多次，包括一些 Api 接口也有改動。如果你學習一個很久之前的小程序項目是沒有意義的，本文推薦的小程序都是最近有更新的。相信在你學習、部署的過程中，不會遇到很多問題。

本文推薦的項目從入門到進階都有，收藏起來吧。

02. 小程序書店

技術棧：Taro + Taro UI + Redux + Webpack + ES6 + Mock。這個項目可以作為你第一個小程序練手項目。

這個小程序非常簡單，可以作為初學者第一個實戰(zhàn)項目。幫助新手理解 Taro 與 Redux 的配合方式與 Taro 的基本使用。本項目還提供了一個快速搭建本地 mock 服務的解決方案。

除此之外，這個項目還提供了學習文檔：

03. 高仿喜馬拉雅

如果你僅僅有 HTML CSS Js 的知識儲備，想開發(fā)一個屬于自己的小程序，這個 Demo 再適合你不過了，這個高仿喜馬拉雅是一個初級項目完全使用微信小程序原生開發(fā)，沒有使用自定義組件，非常的適合微信小程序開發(fā)新手。

04. 網(wǎng)易云音樂小程序

基于Taro與網(wǎng)易云音樂 api 開發(fā)，技術棧主要是：typescript+taro+taro-ui+redux+react-hooks。

目前主要是著重小程序端的展示，主要也是借此項目強化下上述幾個技術棧的使用，打造一個最佳實踐項目，通過這個項目也可以幫助你快速使用 Taro 開發(fā)一個屬于你自己的小程序。

這是該小程序實現(xiàn)的一些功能：

小程序 GitHub Trending Hub 是一個以 Feed 流形式查看 GitHub Trending 倉庫集合的工具，通過它可以及時查看最近更新的熱門倉庫。

剛剛提及的項目適合新手入門，這個小程序適合進階選手。這個程序涉及很多組件的使用比如：

07. 情書站點

第一個項目是校園小情書的微信小程序，該項目功能包括表白墻、樹洞、校園論壇。

下載。

小程序開發(fā)的難點是什么？

自建小程序開發(fā)團隊：

一部分大型企業(yè)或者有雄厚資金實力的企業(yè)，都會選擇自己組建開發(fā)團隊。雖然組建自己的團隊，無論是前期開發(fā)，還是后期的維護、升級、改版等，溝通起來都比較方便。但是，自己組建開發(fā)團隊，會是一筆不小的開支，因為不僅要招聘專業(yè)的技術人員，還要支付技術人員的工資。如果企業(yè)沒有長期的開發(fā)工作，但又要維系這個團隊，是非常不劃算的。

購買三方平臺的模板小程序：

購買三方平臺的模板小程序，可以讓企業(yè)和商家省下一筆組建團隊的成本，而且還不用每個月都支付一筆人力費用。但是，從第三方平臺購買的模板小程序，往往都是根據(jù)行業(yè)的特點來設計的，在板式上很容易出現(xiàn)雷同，沒有新意，很難給用戶留下較深刻的印象。此外，一些第三方平臺還會將某些功能拿出來，單獨收費，無形之中增加了企業(yè)和商家的開發(fā)成本。

找專業(yè)的小程序開發(fā)公司定制開發(fā)

對于普通企業(yè)和商家而言，找專業(yè)的小程序開發(fā)公司來定制開發(fā)小程序，不僅可免去組建團隊的麻煩，而且還可以省下一筆人力成本。此外，定制開發(fā)的小程序，無論是版式、結構、內(nèi)容、圖片等，都可以根據(jù)自己企業(yè)的特色、產(chǎn)品的賣點進行設計，從而提升用戶的體驗感受，加深用戶對小程序的印象。

小程序開發(fā)與前端開發(fā)區(qū)別

技術上看，WEB前端開發(fā)技能與小程序開發(fā)技能高度重合。但在能力、條件允許的前提下，WEB開發(fā)給人的感覺還是比小程序開發(fā)好。因為很多時候，人們理解的小程序開發(fā)工程師，只是做前端，而前端在WEB開發(fā)中只是技能的一小部分?！军c擊查看小程序開發(fā)底價】

小程序開發(fā)也默認是包含小程序前端技術和小程序后端技術的話，后端技術上WEB開發(fā)與小程序開發(fā)是通用的，而前端開發(fā)小程序就相當于WEB開發(fā)的眾多前端中的一種框架，類似WEB前端的VUE框架一樣，它們之間的技術棧區(qū)別并不大。

想要了解更多有關小程序開發(fā)的相關信息，推薦咨詢豬八戒網(wǎng)。豬八戒網(wǎng)成立于2006年，是中國領先的企業(yè)服務平臺，服務交易獨角獸企業(yè)。豬八戒網(wǎng)現(xiàn)有注冊用戶2800萬、在全國布局線下數(shù)字化創(chuàng)業(yè)園區(qū)超過100個。十余年來，累計有10萬余個人通過平臺孵化成長為公司，超過100萬人通過平臺實現(xiàn)靈活就業(yè)，千萬企業(yè)通過平臺解決專業(yè)服務需求；專業(yè)性值得選擇。

微信小程序(Mini Program)技術棧與框架簡介

關鍵字：微信小程序、Mini Program、技術棧、框架、WePy、MPVue

整體小程序開發(fā)類似Web App開發(fā)，尤其是使用了Vue或React框架的Web App開發(fā)。

小程序原生技術棧與框架WePY、MPVue之間的比較，參考 博客

前端基礎設施怎么搞？看騰訊TDesign跨技術棧組件庫的最佳實踐

在 6 月 28 日的首屆 Techo Day 騰訊技術開放日上，騰訊發(fā)布了一系列“輕量級”產(chǎn)品，將騰訊多年自研產(chǎn)品的底層能力釋放給了開發(fā)者。

正如騰訊云高級副總裁 CTO 王慧星，在前不久的騰訊 TDesign 技術生態(tài)日提到的那樣：“自騰訊確立了開源協(xié)同，自研上云的技術戰(zhàn)略，成立了十大技術領域委員會，推出了眾多 PaaS 能力，并將這樣的能力放在云上，實現(xiàn)對內(nèi)部和外部用戶的統(tǒng)一服務?！?

而騰訊設計云旗下的企業(yè)級產(chǎn)品設計體系騰訊 TDesign 正是這樣一款產(chǎn)品，其也在首屆 Techo Day 騰訊技術開放日活動中，發(fā)布了新的產(chǎn)品動態(tài)。據(jù)了解，目前騰訊 TDesign 的大部分組件已經(jīng)完成了內(nèi)測版本的發(fā)布， Vue 2、Vue 3、React 和移動端 Vue 3 也已經(jīng)發(fā)布了公測版本和候選版本。與此同時，Augular、Flutter 、taro 等熱門技術棧也在開發(fā)的行列當中。

如果要回溯騰訊自研 UI 組件庫的緣由，這或許要先了解下前端領域的發(fā)展史。

縱覽底層的前端框架領域，先是經(jīng)歷了 JQuery 一統(tǒng)江湖的時代，而后過渡到了 MVVM 框架成為主流的時期。目前，Vue、React 以及 Angular 則成為了前端開發(fā)人員使用最多、最廣的底層框架?？梢钥闯觯瑯I(yè)界并沒有完全占據(jù)主導地位的前端開發(fā)框架，這也就導致前端技術團隊在迭代技術棧時，往往存在較大的切換成本，跨團隊共享前端資產(chǎn)時也會遇到技術棧差異的壁壘。

此外，由于組件庫和團隊技術棧存在一定耦合性的關系，對于很多企業(yè)中后臺系統(tǒng)這樣的弱設計風格場景，我們可以根據(jù)整個棧的風格，大致推測出這個項目使用了哪種組件庫。例如，前端團隊選擇了 React 開發(fā)框架，大概率會用 AntD 組件庫；使用 Vue 開發(fā)框架，則大概率會直接用 iview-admin 頁面模板。這樣一來，技術棧的差異不僅會導致整個組件庫的選型受到一定限制，還會讓對外曝露的產(chǎn)品體驗存在較大的偏差。

因此，在產(chǎn)品體驗、開發(fā)效率與設計效率等因素的驅動下，騰訊通過開源協(xié)同的方式，與多個業(yè)務團隊共建了企業(yè)級設計體系騰訊 TDesign ，通過提供復用性的設計體系，為設計研發(fā)各個流程環(huán)節(jié)提供需要的設計和研發(fā)等解決方案。

在代碼組件庫中，騰訊 TDesign 基于業(yè)界實際的使用需求，已經(jīng)覆蓋了 Vue、Vue Next、React 等主流的前端開發(fā)框架，目的在于讓公司內(nèi)外部使用的同學都可以根據(jù)自身實際需求，選擇對應的組件庫產(chǎn)品，不再受技術選型的限制。當項目同時有桌面端和移動端使用需求的時候，騰訊 TDesign 還可以統(tǒng)一產(chǎn)品在兩端上的業(yè)務體驗。

從另一個角度來看，如果沒有統(tǒng)一的 UI 組件體系，UI 設計師的工作效率同樣是大打折扣的。在“騰訊前端通用 UI 組件庫技術生態(tài)日”活動中， 騰訊用戶研究與體驗設計部總經(jīng)理陳妍說道：“如果沒有騰訊 TDesign 這樣的 UI 組件庫，設計師是最大的受害者，因為我們的工作需要不斷的重復，沒有辦法把時間節(jié)省下來做更加有價值的事情。”

基于設計師的痛點，騰訊 TDesign 目前也提供了 Figma、Sketch、Axure 等設計資源以及 Sketch 設計插件，讓設計和代碼能夠無縫銜接，使設計資源分配到必要的環(huán)節(jié)。

既然騰訊 TDesign 選擇了支持各種技術棧的原生開發(fā)，就不可避免地會遇到幾類問題。例如，UI 組件庫怎么保證與技術棧產(chǎn)物一致性？交互和 UI 實現(xiàn)怎么保持一致？組件 API 怎么保持一致？官網(wǎng)體驗與用戶的實際使用如何保持一致？

據(jù)騰訊 TDesign 團隊透露，雖然業(yè)界基于上述挑戰(zhàn)已經(jīng)有幾種不同實現(xiàn)的方式，但其各有優(yōu)劣：

一種方案是基于 Web Components 做一個組件，將其使用在各個框架當中，但 Web Components 方案的優(yōu)勢與具體實現(xiàn)框架沒有太大關系，因為是由瀏覽器原生支持，其最大的問題還是瀏覽器的兼容性，部分瀏覽器可以通過 polyfill 解決，但是有些政企瀏覽器的兼容性依然是不可小覷的問題。

另一種方案是直接將一份 React 代碼轉成 Vue，這帶來的好處是可以真正做到維護一份代碼，同時支持多技術棧，但統(tǒng)一整個前端技術棧其實是比較大的課題，目前業(yè)界還沒有統(tǒng)一的方案。另外，代碼轉換支持多技術棧的方案，其實在應用開發(fā)層會更常見，對于騰訊 TDesign 這種底層依賴而言，轉化后代碼的穩(wěn)定性還是難以得到保障。

不僅于此，這種轉化方案的中間層代碼相當于是新的框架，既不是 Vue，也不是 React，對于貢獻者來說門檻比較高，會進一步導致開源社區(qū)不夠活躍，這同樣是騰訊 TDesign 團隊需要考慮的問題。

最終，騰訊 TDesign 團隊決定選擇用 Vue 開發(fā) Vue 技術棧，React 開發(fā) React 技術棧，除了 Angular、小程序等受技術棧限制，其他技術棧均統(tǒng)一用 Jsx 來維護組件實現(xiàn)，并主要解決了以下幾個問題：

組件 API 保持一致

騰訊 TDesign 團隊梳理出了開源項目前端組件上線的流程，在組件進入開發(fā)的前置階段，設置了 API / 交互稿統(tǒng)一評審環(huán)節(jié)，邀請各技術棧的實現(xiàn)者、UI/ 交互設計師以及 PMC 成員同學一起針對組件 API 的易用性、靈活性以及必要性進行評審，充分的討論過后，會將大家的意見形成整個組件的 API 描述，并錄入騰訊 TDesign 的組件 API 管理平臺。

最終，API 管理平臺會生成各個技術棧的 API 文檔、某個組件的 props.ts、typeb.ts 等文件。當組件開發(fā)者進行開發(fā)時，不需要對照文檔做開發(fā)，直接根據(jù)已經(jīng)生成的定義文件開發(fā)即可，做 API 開發(fā)同學提了 PR 做 review 時，有任何更改會同步到各個技術棧實現(xiàn)的倉庫。

用戶實際使用與官網(wǎng)體驗保持一致

為了讓用戶的實際使用感受與官網(wǎng)體驗保持一致，騰訊 TDesign 做了一層官網(wǎng)共同的架構，目前所有的組件文檔包括文字部分，以及我們要展示的組件 Demo。各個端實現(xiàn)時，會各自引入一個 Web Components 實現(xiàn)官網(wǎng)的公共部分，通過統(tǒng)一的 Markdown 解析工具，最終解析出來的棧點就會完全一樣。

各個技術棧產(chǎn)物的 UI 和交互保持一致

除了要保證組件 API 一致，還要保證各個技術棧的產(chǎn)物里 UI 和交互都要完全一樣，這里 TDesign 做了兩件事情：第一，以 TDesign Token 貫穿設計開發(fā)流程，從最初設計師提供的設計稿，到組件庫里代碼的實現(xiàn)變量，一直到最終組件庫里面 NPM 包產(chǎn)物，每個變量都有一一對應的關系；第二，抽取一個獨立的倉庫，將每個組件都獨立維護在 TDesign-common 倉庫，通過 Submodule 的方式引入到實現(xiàn)倉庫里。當 UI 需要調(diào)整的時候，直接在獨立的庫里修改，再同步到各個技術棧實現(xiàn)的倉庫，最終保證整個 UI 和交互在各個技術棧上面實現(xiàn)完全一樣。

部分組件代碼復用

除了 UI 相關實現(xiàn)代碼做到了各技術棧復用，騰訊 TDesign 也參考了業(yè)界類似組件庫產(chǎn)品的實踐， 探索 了一些代碼邏輯復用的方案：一些與技術棧無關的組件抽象類，也抽取到了 TDesign-common 倉庫中；合理分層組件實現(xiàn)，通過 Hooks 和 Composition API 來跨技術棧復用部分代碼實現(xiàn)。

據(jù)了解，當前騰訊 TDesign 在內(nèi)外部已經(jīng)有了比較廣泛的應用基礎，騰訊內(nèi)部在積極推動各個業(yè)務統(tǒng)一到 TDesign，也支持了多個領域和行業(yè)外部項目落地，并從中孵化出了多個行業(yè)組件庫。這些組件庫也將在未來逐步開源，持續(xù)支持各行業(yè)領域的系統(tǒng)建設。

而當我們開始回溯騰訊 TDesign 自開源以來的歷程，可以發(fā)現(xiàn)其取得的成績已經(jīng)可圈可點：在開源社區(qū)的建設方面，騰訊 TDesign 仍然秉持著為社區(qū)貢獻價值的初心，不斷向有活力、高質(zhì)量的開源社區(qū)進階。據(jù)統(tǒng)計，上半年 TDesign 共有 280+ 貢獻者，其中外部 17 ，核 貢獻者 47 ，GitHub star 4k+。

展望未來，騰訊 TDesign 還將繼續(xù)圍繞著兩個既定目標邁進：

第一，讓更多人使用騰訊 TDesign。后續(xù)組件庫各技術棧將發(fā)布 Stable 版本，并針對移動端開展專項優(yōu)化，以確保提升組件質(zhì)量和用戶使用體驗。為了最大化提升設計師的工作效率，還將提供 模板、移動端 Figma UIKit Variant（設計可配置能 ）等設計資源，并建設物料市場，承載更多的 業(yè)組件和模板資源。除此之外，TDesign 還計劃支持國際化以及無障礙適老化的適配；

第二，建設更有活 、更 質(zhì)量的開源社區(qū)。為了幫助更多從業(yè)者了解企業(yè)級設計體系 騰訊 TDesign，社區(qū)后續(xù)計劃沉淀、總結設計體系和組件庫專業(yè) 章 / 課程。另外，為了吸引更多外部開發(fā)者加 貢獻，透明化內(nèi)外部協(xié)作進度，開源社區(qū)將優(yōu)化開發(fā)者的招募和激勵機制。

談及未來的發(fā)展規(guī)劃，騰訊 TDesign 團隊在接受 InfoQ 采訪時表示，未來除了會支持現(xiàn)有的前端技術棧，還將協(xié)同社區(qū)的力量推出 Web components、Flutter 等更多技術棧產(chǎn)品，服務于公司內(nèi)外使用者。同時，也期待更進一步復用跨框架實現(xiàn)的代碼，在降低維護成本的同時，不顯著額外提升參與貢獻的門檻。

作為騰訊設計云的關鍵產(chǎn)品，騰訊 TDesign 的誕生便是為了讓 UI 組件庫擺脫技術選型的影響，讓其回歸到前端基礎設施的地位上來。事實證明，在一步步的迭代與優(yōu)化之下，騰訊 TDesign 已經(jīng)逐步地將開源協(xié)同能力滲透給了更多企業(yè)。

與此同時， 騰訊用戶研究與體驗設計部總經(jīng)理陳妍還在接受 InfoQ 采訪時透露：未來，騰訊設計云將繼續(xù)在設計資產(chǎn)、設計協(xié)作效率發(fā)力，針對圖標庫、設計資產(chǎn)開源平臺以及智能設計工具進行迭代升級。目前，騰訊設計云已經(jīng)初步完成平臺建設階段，后續(xù)騰訊設計云將逐步向內(nèi)容建設方面進階。

我們也堅信，今后騰訊設計云在實現(xiàn)高效設計、輕松協(xié)同目標的過程中，也將邁出更加堅實的一步。

小程序開發(fā)技術棧的介紹就聊到這里吧，感謝你花時間閱讀本站內(nèi)容，更多關于小程序全棧開發(fā)、小程序開發(fā)技術棧的信息別忘了在本站進行查找喔。