五分鐘上手-微信小程式

1：用沒有註冊過微信公眾平臺的郵箱註冊一個微信公眾號， 申請帳號 ,點選 https://mp.weixin.qq.com/wxopen/waregister?action=step1 根據指引填寫資訊和提交相應的資料，就可以擁有自己的小程式帳號。註冊完成之後開始登入。

image

2：登入 https://mp.weixin.qq.com

我們可以在選單 “設定”-“開發設定” 看到小程式的 AppID 了 。小程式的 AppID 相當於小程式平臺的一個身份證，後續你會在很多地方要用到 AppID (注意這裡要區別於服務號或訂閱號的 AppID)。有了小程式帳號之後，我們需要一個工具來開發小程式。
根據官方教程進行開發

image

3：安裝開發工具

前往 開發者工具下載頁面 ，根據自己的作業系統下載對應的安裝包進行安裝，有關開發者工具更詳細的介紹可以檢視 《開發者工具介紹》 。開啟小程式開發者工具，用微信掃碼登入開發者工具，準備開發你的第一個小程式吧！我的電腦是64位的：

4：安裝完成之後

你的第一個小程式開啟：新建專案選擇小程式專案，選擇程式碼存放的硬碟路徑，填入剛剛申請到的小程式的 AppID，給你的專案起一個好聽的名字，最後，勾選 "建立 QuickStart 專案" (注意: 你要選擇一個空的目錄才會有這個選項)，點選確定，你就得到了你的第一個小程式了，點選頂部選單編譯就可以在 IDE 預覽你的第一個小程式。

5：編譯預覽

點選工具上的編譯按鈕，可以在工具的左側模擬器介面看到這個小程式的表現，也可以點選預覽按鈕，通過微信的掃一掃在手機上體驗你的第一個小程式。OK，你已經成功建立了你的第一個小程式，並且在微信客戶端上體驗到它流暢的表現。

小程式初始化目錄：

1：page 頁面資料夾 存放專案頁面渲染相關檔案

2：utils 存放js庫和數字格式化檔案

3： 配置檔案

我是分割線===開發ing

接下來就要開始開發了，我是第一次開發微信小程式，所以顯得特別的生疏，以至於無從下手，糾結了很久，找朋友要了一套模板，匯入自己的小程式開發工具裡面，對整個小程式目錄檔案結構有了一定的瞭解，就能很快的上手。

另外也在網站，GitHub上找了很多完整的小程式原始碼，學習起來速度也是相當快。

小程式的思想是：小程式開發框架的目標是通過儘可能簡單、高效的方式讓開發者可以在微信中開發具有原生 APP 體驗的服務。框架提供了自己的檢視層描述語言 WXML 和 WXSS，以及基於 JavaScript 的邏輯層框架，並在檢視層與邏輯層間提供了資料傳輸和事件系統，可以讓開發者可以方便的聚焦於資料與邏輯上。

1:第一個簡單小程式：極客小寨

2:第二個簡單小程式：輸入網址生成相應的二維碼

完成一個最簡易的介面

3:第三個簡單小程式：傳送祝福

4:第四個簡單小程式：仿網易雲音樂

網易雲音樂

示例步驟：

1：右鍵鍵盤開啟

2：把原始碼複製黏貼進去，替換掉原來初始化目錄，點選普通編譯，即可檢視左側效果，根據需要，作相應的增刪

到此為止小程式順利入門，三天上手，接下來就是一系列的邊學學習開發文旦邊開發邊踩坑的過程了，多讀小程式原始碼，想想也不是那麼難的一件事情咯

原文作者：祈澈姑娘
技術部落格：https://www.jianshu.com/u/05f416aefbe190後前端妹子，愛程式設計，愛運營，愛折騰。
堅持總結工作中遇到的技術問題，堅持記錄工作中所所思所見，歡迎大家一起探討交流。