前端小白是如何利用chatgt用一周時間從0做一款微信小程序的

隨著chatgpt的大火，真的是在工作上給各行各業(yè)的人帶來了極大的便利，本人是一個java程序員，其實我自己是一直想開發(fā)一款屬于自己的小程序的，但是迫于對前端知識的貧瘠，考慮到要學的前端開發(fā)知識有很多，比如js,ts,前端框架vue,react…,最難受的是css樣式，最簡單的效果都要弄好久，每次想一想就放棄了。最近出來的chatgpt，讓我對這個想法重新有了信心，然后就是直接開干！

?確定好方向

為什么要做一個題庫小程序呢？

之前幫人家做過自動答題的程序，所以不少人問我有沒有相關(guān)網(wǎng)站的題庫，所以既然別人有這個需求，我覺得還是有做的可行性的。

??模仿同類產(chǎn)品

既然想好了要做什么，那我就直接去應用市場，微信小程序搜相關(guān)的應用，我一口氣下載和看了十幾款搜題程序，搜題大俠，題海，刷題神器，聚題庫…,總結(jié)了幾點：

• 提供了豐富的搜題方式，手動輸入文字，語音輸入，拍照識別
• 提供題庫，可以讓用戶自己練習
• 用戶可以自主上傳題庫

上面這幾點，是用戶的基礎(chǔ)功能，也就是滿足題庫app的基本條件。
但是很多題庫都沒有把三點都做到，有些有拍照但是沒有語音輸入，有些只有文字輸入，有些題庫很豐富但是不支持用戶自己導入題庫，而且絕大多數(shù)app動不動就要收費，而且收費還很高，我覺得這可以是我的突破點，作為個人開發(fā)者，我的成本肯定比他們低，所以程序在收費方面肯定比他們低或者不收費。

??策劃產(chǎn)品ui和功能

功能方面，我就先模仿他人的題庫app，先把基礎(chǔ)的功能做起來，第一步先把搜題功能做好，再做其他的功能。

• 搜題方式：實現(xiàn)手動輸入文字，語音輸入，拍照識別題目。
• 題庫來源：我初步想的是爬數(shù)據(jù)+第三方api+用戶上傳，這樣才能覆蓋面廣，而且題庫也會一直更新。

根據(jù)要做的功能就簡單畫了下草圖，自己不懂ui，審美也不太行就只能潦草一點了

??開發(fā)

后臺

后臺接口想了下，先暫定三個接口，為了接口不被輕易爬取，采用前臺加密，后臺解密的方式，每次請求都會攜帶秘鑰，解密成功才會正確響應。

• 查詢題庫接口
• 登錄接口
• 百度ocr接口

因為后端是自己老本行，花了一天左右差不多就做完了

前臺

前臺我首先調(diào)查了那幾款框架好做微信小程序，就是坑比較少（包括uniapp,taro,原生），因為自己直接稍微接觸過一點react，鑒于taro對react的適配性比較好，taro也一直在更新，所以我選擇taro（原生也考慮過，但是感覺要多花時間去了解，所以就pass啦）。

準備事項

開發(fā)小程序還是有很多準備的工作要做的，

• 比如得先注冊一個微信小程序賬號，每次發(fā)布就是需要登錄這個賬號來發(fā)布，
• 選擇小程序的類目，這個挺重要的，因為有些類目，個人開發(fā)者不能申請，所以要特別小心，因為我做的屬于題庫，所以我選擇了 信息查詢和教育兩個類目。
• 想一個容易被記住和被搜索到的小程序名稱。
• 設(shè)計一個圖標，我自己不會，就在圖標網(wǎng)站先找了一個差不多適合的。
• 用戶隱私保護指引，這個需要根據(jù)自己的小程序功能來填寫，向我這邊就需要麥克風和攝像機的權(quán)限，這個需要在里面說明用途，更新提交上去，這樣才能保證審核可以成功。

根據(jù)demo修改

我先去官網(wǎng)clone了個demo下來，下載了微信開發(fā)者工具，嘗試運行了下，發(fā)現(xiàn)還真有用
Taro官網(wǎng)

然后自己先把首頁的樣子，用語言描述給chatgpt，給我畫出大概得雛形，然后再進行微調(diào)

如此往復，我就得到了一個簡潔的首頁

然后就是對接接口啦，查詢題庫，ocr的接口，還有登錄接口統(tǒng)統(tǒng)對接上去。
這里遇到了兩個比較坑的地方。

• 一個是微信官方有一個“微信同聲傳譯”插件，需要自己去市場里申請，結(jié)果發(fā)現(xiàn)自己死活申請不了，提示“個人主體不能申請”，可是我也看到類似的個人小程序也用了這個插件，這我就很迷糊了，憑什么我就不能申請成功，后面在我窮追不舍的搜索下，終于發(fā)現(xiàn)了另外的入口，申請成功！

申請步驟

1. 去微信服務(wù)平臺搜一下

2. 找到了微信同聲傳譯，登錄后選擇給哪個小程序添加，添加成功后去小程序的微信公眾平臺看已經(jīng)添加成功了，而且是已通過狀態(tài)。
   

• 獲取用戶的昵稱和頭像方式變了，之前只需要調(diào)用getUserProfile這個Api，在成功回調(diào)中就能獲取用戶信息，現(xiàn)在已經(jīng)廢棄了，現(xiàn)在需要開發(fā)者自己寫表單，用戶自己填寫頭像和昵稱，感覺這個會讓用戶操作變得麻煩，所以我暫時先不實現(xiàn)這個功能了，等到那天想到合適的操作邏輯再做

這里前前后后花了我三四天的時間（主要是下班來做，上班一般沒啥時間），主要是交互和摸清wx的api使用比較花時間，chatgpt在設(shè)計界面和交互真的幫了我很大的忙，還有一些前端錯誤他也能快速定位，并給出解決方案，給我節(jié)省了很多時間

發(fā)布

最后一步就是上傳代碼，提交審核，一般一天左右就會審核完成，再點擊發(fā)布，就能看到上線的小程序，這一刻心情還是無比的激動！??

??開發(fā)總結(jié)

使用chatgpt幫助我一個前端小白慢慢搭建起一個小程序的過程中，
缺點在我看來是chatgpt并不會準確無誤地給出我想要的答案，大多數(shù)是比較符合的，但是肯定不是特別符合，需要自己一點一點的調(diào)整。

優(yōu)點是chatgpt每次告訴你答案的時候往往還會為我解答代碼的作用，這讓我更快地了解語言的一些特性和框架的使用，節(jié)省了自己去官網(wǎng)查文檔的時間，這讓我感覺自己是真的參與了這個前端開發(fā)，而不是隨意地copy答案。

最后非常感謝大家看到這，很高興分享這次的開發(fā)過程，總之就是有意思，效率是真的高。文章來源地址http://www.zghlxwxcb.cn/news/detail-431405.html

到了這里，關(guān)于前端小白是如何利用chatgt用一周時間從做一款微信小程序的的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！