微信作為一種通訊工具的使用可以說是越來越頻繁了，隨之興起的也有很多，比如服務號，小程序，但是似乎小程序更能符合大眾的心意，在面臨著越來越多的APP的普及，大家更多的是希望手機上的APP能越來越少

所以菜菜就順應時代的潮流學習如何做一個簡單的小程序（嘻嘻嘻）

---

一、開發環境的準備

首先就是要有自己的權限來開發一個小程序

• 注冊一個屬于自己的開發者賬號
  （由于我們后期需要調用微信端口等功能，即需要一個APPID）
  百度 微信公眾平臺-- 注冊–登錄
  要注意的是注冊需要一個沒有使用過的郵箱（或者在微信小程序官網）

登錄之后的界面如圖：

• 點擊紅色方框中的開發設置
  得到如下界面，獲取APPID
  （可以先提前復制保存，方便后期使用）
  

到了這里，我們就可以準備我們的微信開發工具了

• 下載對應工具
  寫代碼：vs code下載地址
  看效果：微信開發者工具下載地址

其界面分別為


選擇自己的版本下載即可

---

二、微信開發者工具使用

下載完成之后，打開微信開發者工具，微信掃一掃授權登錄得到如下界面

第一個小程序

在桌面建一個文件夾命名為01-demo

注意：
文件夾名稱應該與項目名稱一致
我使用的語言是Js
可選擇使用測試號
再點擊新建即可

認識我們的界面

• 1區域
  基本工具欄，對當前工具進行設置，比如改變外觀
• 2區域
  顯示界面，可在這里看到效果
• 3區域
  文件區，我們需要的所有文件
• 4區域
  代碼區，我們在里面進行一系列操作
• 5區域
  調試區，上面的一些選項可點開，看到類似HTML的代碼

大家可試著自己各種點擊一下了解其功能

（為綠色，表示可見，可自行操作選擇自己喜歡的顯示方式）

對于小程序模式，普通編譯我們一般不改變
編譯，預覽我想大家都明白
真機調試：對于我們不能在該界面找到的bug，可以通過手機掃描二維碼來體驗
其余的方框內的內容可自行了解

---

在對微信小程序的開發中我們對于軟件的安裝使用有了一定的基礎了解了，我們后面就將認真的學習如何開發小程序

第一篇Web微信小程序開發的學習就到此結束啦！

總結

以上是生活随笔為你收集整理的Web微信小程序开发（一）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。