如何開發(fā)微信小程序?星光科技小編為了讓更多人的了解微信小程序。
下面的回答側(cè)重于微信小程序開發(fā)的實際操作方法,肯定適合零基礎(chǔ)沒有開發(fā)經(jīng)驗的人。
微信官方的文檔確實很重要,隨時都要用,但身為小編,先動手、做起來、做出來更首要。沒有編程基礎(chǔ),上來就以學(xué)文檔學(xué)代碼為主,太抽象太枯燥了,很容易把自己嚇跑的。
下面是小編我自己做微信小程序開發(fā)的簡要過程(包括制作、提交審核、發(fā)布、下載小程序碼等,總共有13步):
1. 小程序原型設(shè)計
開發(fā)前,最好先做個原型,把自己的需求理順。我用的工具為Axure, 下載的是一個免費版,功能不全,但自己梳理想法足夠了。
2. 注冊一個開發(fā)工具賬號
現(xiàn)在微信小程序開發(fā)工具大多都是純線上版本,無需下載;并且,打開注冊頁后一般都可以用微信掃碼即可完成注冊,非常簡便。
需要補充說明下:想開發(fā)微信小程序,微信官方的開發(fā)工具肯定是要用的,但是對于沒有編程基礎(chǔ)的人來說,這個官方工具只能做做最后的發(fā)布。最復(fù)雜的開發(fā)制作環(huán)節(jié),咱這種初級人員玩不轉(zhuǎn)。所以像我這樣的菜鳥群體,制作時得依靠市面上第三方工具。有很多,各有特色;當(dāng)然,工具固然重要,但背后思路方法更為本質(zhì)。
3. 選擇模板
在模板市場中,選擇跟自己需求最為接近的模板,點擊“使用”,即可進入開發(fā)制作臺,開始小程序的正式制作。開發(fā)微信小程序,早期最好基于現(xiàn)成模板就行搭建,在使用過程中再逐步調(diào)整,在后期越來越熟悉后,就可以嘗試進行深度個性化開發(fā)。
4.對模板進行修改、開發(fā)
選好模板并“使用”后,在制作臺中央,模板以及模板的各個組成部分就會可視化的展現(xiàn)出來了。選中希望修改的模塊,在右側(cè)對基礎(chǔ)屬性、樣式和觸發(fā)條件(什么情況下該模塊開始工作)等進行設(shè)置。如果需要增加一些新功能模塊,可以在制作臺左側(cè)找到相應(yīng)的模塊(星光科技稱為組件),然后直接拖放到屏幕中央的小程序界面里,再回到右側(cè)做做樣式設(shè)置,就能完成一個基本模塊的開發(fā)。
小程序的前端、后臺服務(wù),都可以參考上面的方法進行開發(fā)制作,具體可以進入“高級”標(biāo)簽頁詳細查看。
如果模塊拖拽的方式覺得不過癮,想更徹底的掌控小程序開發(fā)細節(jié),也可以切換到IDE模式:
星光科技的IDE模式,支持用javascript、html5和css語言對微信小程序進行編程。因為代碼編寫我暫時還不會,介紹不上來,等過段時間學(xué)下這幾個語言,再補充點代碼操作的案例上來。
開發(fā)制作操作完成后,將進入配置、發(fā)布環(huán)節(jié)。
5. 注冊并配置微信小程序賬號信息
首次發(fā)布小程序,需要先進行小程序注冊,獲得小程序賬號的appid和appsecret。
然后再回到所使用的開發(fā)制作工具(星光科技)里完成小程序賬號信息配置。在星光科技制作臺導(dǎo)航欄上選"高級"——>再在屏幕左上方選“管理后臺”——>左側(cè)功能樹列表里選“微信配置”:
6. 為微信小程序獲取并配置上服務(wù)器域名
小程序正式發(fā)布前需要進行服務(wù)器域名配置。有服務(wù)器域名微信小程序才能正常工作。
在星光科技制作臺的“發(fā)布”頁面中,單擊“第三步 導(dǎo)入微信開發(fā)者工具”按鈕,顯示出發(fā)布版本的服務(wù)器域名:
為微信小程序獲取服務(wù)器域名信息
然后,在小程序官網(wǎng)登錄小程序賬號,單擊首頁中的“開發(fā)頁面”按鈕,打開開發(fā)頁面,向下滾動,即可看到服務(wù)器域名的配置。注意服務(wù)器域名在一個月內(nèi)只能修改5次。
登錄小程序賬號,配置服務(wù)器域名信息
7. 下載安裝微信開發(fā)者工具
下載 · 微信官方的小程序開發(fā)工具(即所謂的"微信開發(fā)者工具")
8. 下載制作好的微信小程序包
點擊星光科技制作臺右上角的“發(fā)布”按鈕,進入“發(fā)布”頁面,單擊頁面中的“第二步 下載小程序”按鈕,頁面中顯示“正在生成微信小程序,請稍等…”,使用瀏覽器的下載功能,下載步驟4中制作好的微信小程序包:
9. 在微信開發(fā)者工具里創(chuàng)建一個新項目
打開微信開發(fā)者工具。在微信開發(fā)者工具中新建一個項目,輸入小程序賬號的appid、項目名稱、選擇項目目錄,為導(dǎo)入制作好的微信小程序包做準(zhǔn)備:
10. 上傳微信小程序包到微信開發(fā)者工具
在微信開發(fā)者工具中,單擊“上傳”按鈕,上傳步驟8導(dǎo)出的小程序包。上傳后,因為還未審核,所以都叫"開發(fā)版本"。
上傳后,登錄微信公眾平臺|小程序,在“開發(fā)管理”中可以看到剛上傳的開發(fā)版本。
11. 提交開發(fā)版本進行審核
將開發(fā)版本提交審核,審核通過后,才能提交發(fā)布,提交審核的方法是:單擊“開發(fā)版本”右側(cè)的“提交審核”按鈕,打開“提交審核相關(guān)須知”,按向?qū)瓿商峤粚徍肆鞒獭?br />
開始進入提交審核的向?qū)?br />
提交審核后,登錄微信公眾平臺|小程序,在"開發(fā)管理"頁面中的審核版本中會顯示“審核中”。等待審核結(jié)果。
12. 正式發(fā)布微信小程序
審核通過后,審核版本中顯示“審核通過,待發(fā)布”,單擊審核版本右側(cè)的“提交發(fā)布”按鈕,小程序?qū)⒄桨l(fā)布到線上提供服務(wù)。
13. 下載微信小程序碼
小程序提供了小程序碼,用于掃描后打開小程序。登錄微信公眾平臺|小程序,在設(shè)置頁面中下載小程序碼,單擊“下載更多尺寸”按鈕,打開更多尺寸對話框,提供多種顏色和尺寸的小程序碼用于下載。
再就題主的問題補充說一下:我剛開始甚至連HTML5、CSS都沒聽說過,更別說js(javascript)了。后來在制作過程中,我并沒有滿足于拖拉放,而是一邊圖形化搭建著,一邊注意經(jīng)常切換到代碼狀態(tài)琢磨琢磨,現(xiàn)在雖然還不能自己獨立寫代碼,但基本上能讀懂個大概了,還能做做簡單代碼修改。
當(dāng)然,微信小程序做的好不好,零基礎(chǔ)入門知識作為普通個體經(jīng)營戶用是可以,作為企業(yè)型微信小程序建議還是更多的尋求專業(yè)開發(fā)團隊來完成。一個重要原因是,專業(yè)的事情專業(yè)人士去干,作為小編我作為星光科技一員,希望有需求的同志可以聯(lián)系我們。