前端 微信小程序開發第一步

技術哥,給你不一樣的世界


前端 微信小程序開發第一步

技術哥已經在上兩期向大傢俱體介紹過微信小程序了,有的朋友已經蠢蠢欲動想自己動手開始了吧。那這次技術哥先手把手帶大家開發第一個屬於自己的微信小程序。

  1. 首先是先在微信公眾平臺上註冊並拿到屬於自己的AppID,然後進入微信公眾平臺:

前端 微信小程序開發第一步

2.選擇小程序:


前端 微信小程序開發第一步


3.在相應的位置填入對應的信息,填寫完整後點擊“繼續”:

每個賬號僅可申請一個小程序

填入的郵箱將成為微信公眾平臺登錄小程序時候的賬號,所填的密碼可設新密碼,與郵箱賬號相獨立。

前端 微信小程序開發第一步

4.開始郵箱激活步驟:登陸郵箱,在收件箱中找到題為:“請激活你的微信小程序”的郵件並打開,點擊郵件中的鏈接即可激活賬號:

前端 微信小程序開發第一步

前端 微信小程序開發第一步

5.點擊鏈接後,將會跳轉回微信公眾平臺,顯示如下界面,則郵箱激活成功。然後開始填寫信息登記:

前端 微信小程序開發第一步

一般我們選擇為個人開發者即可進行基本開發,如有其他需要可再查詢其他類型開發者後進行選擇;

前端 微信小程序開發第一步

6.填寫完基本信息後驗證管理員身份,顯示如下界面,表示註冊成功

前端 微信小程序開發第一步

7.跳轉微信公眾平臺/小程序的首頁,完善自己的個人信息,註冊就完成了

前端 微信小程序開發第一步

註冊好賬號之後就可以在開發者工具中進行自己的小程序開發和調試了。

1.那我們回到微信公眾平臺首頁,點擊小程序,找到開發者工具

https://mp.weixin.qq.com/cgi-bin/wx

前端 微信小程序開發第一步

2.進入開發者工具後,跳轉到如下界面:

前端 微信小程序開發第一步

3.在左邊菜單中找到“下載”,根據自己的系統選擇所需要的版本,點擊開始下載:

前端 微信小程序開發第一步

4.下載安裝後,點擊圖標,用註冊時的管理員微信賬號掃碼登陸

(下文以Mac版本為例,Windows版本相差不多,功能相同)

前端 微信小程序開發第一步

5.進入開發者工具模式選擇,點擊“小程序項目”

前端 微信小程序開發第一步

6.進入微信小程序,點擊右下角的加號創建新項目:

前端 微信小程序開發第一步

7.開始創建項目:

前端 微信小程序開發第一步

(1)項目目錄創建需選擇項目應存放的目錄。當選擇空目錄時,可以選擇是否在該目錄下生成一個簡單的項目。

(2)AppID獲得方式:

回到微信公眾平臺/小程序的首頁,在左側菜單最下方,找到“設置”-“開發設置”,出現下面界面,將AppID複製到輸入框中:

前端 微信小程序開發第一步

(3)輸入項目名稱,中英文皆可;

(4)在“建立普通快速啟動模板”處的勾上;

(5)點擊“確認”;

8.點擊“確認”後,出現下面界面,則並表示項目創建成功:

前端 微信小程序開發第一步

9.點擊上欄的“預覽”,用微信掃一掃:

前端 微信小程序開發第一步

10.掃碼後,將會跳到我們的第一個微信小程序,我們的第一個微信小程序就這樣完成啦:

前端 微信小程序開發第一步

下一期的微信小程序教程會開始教大家熟悉代碼並走上敲代碼的道路,敬請期待哦。大家如果覺得意猶未盡,大可以翻閱微信小程序的文檔進行自主學習,創造更多的可能。

留給大家個小問題,如果需要修改上圖中的“Hello World”變為其他文字,可以怎麼做呢?答案下期揭曉;)

進一步瞭解請持續關注技術哥

技術哥,給你不一樣的世界!


分享到:


相關文章: