小程序開發文檔官網（小程序開發文檔 官方）

本篇文章(zhāng)給大家談談小程序開發文檔官網，以及小程序開發文檔 官方對應的(de)知識點，希望對各位有(yǒu)所幫助，不要忘了收藏本站喔。

本文目錄一(yī)覽：

• 1、小程序開發所有(yǒu)的(de)流程？
• 2、微信小程序可(kě)以自(zì)己做(zuò)嗎
• 3、微信小程序如(rú)何開發
• 4、如(rú)何快速開發個微信小程序
• 5、小程序開發流程？

小程序開發所有(yǒu)的(de)流程？

小程序開發流程其實很簡單，如(rú)下：

1、微信小程序注冊

在微信公衆平台注冊小程序，完成注冊後可(kě)以同步進行(xíng)信息完善和(hé)開發。

2、微信小程序信息完善

填寫小程序基本信息，包括名稱、頭像、介紹及服務範圍等。

3、微信小程序開發

完成小程序開發者綁定、開發信息配置後，開發者可(kě)下載開發者工具、參考開發文檔進行(xíng)小程序的(de)開發和(hé)調試。　

4、測試

在軟件設計完成之後要進行(xíng)嚴密的(de)測試，一(yī)發現軟件在整個軟件設計過程中存在的(de)問題并加以糾正。可(kě)以是開發人員內(nèi)部測試（內(nèi)測）或者交給客戶的(de)公開測試（公測） 。整個測試階段分為(wèi)單元測試、組裝測試、系統測試三個階段進行(xíng)。

5、微信小程序提交審核和(hé)發布

完成小程序開發後，提交代碼至微信團隊審核，審核通過後即可(kě)發布(公測期間不能發布)。

微信小程序可(kě)以自(zì)己做(zuò)嗎

微信小程序可(kě)以自(zì)己做(zuò)。

擁有(yǒu)一(yī)個小程序需要很多步驟，注冊小程序，開發前準備，開發，提交審核，通過了小程序才能開始正常使用。

一(yī)步一(yī)步來制作一(yī)個可(kě)以正常使用的(de)微信小程序

1.注冊

普通的(de)注冊步驟就點立即注冊，跟公衆号登錄是同一(yī)個入口。

點“2”指向的(de)地(dì)方-小程序圖标，是小程序開發文檔，底部也有(yǒu)注冊小程序的(de)入口，點擊進入注冊。

個人小程序和(hé)商(shāng)城小程序

到了這一(yī)步你要選類型，是要開通個人，還是開通企業?

請點擊輸入圖片描述

如(rú)果這個小程序僅僅是展示用的(de)小程序，那類型選擇個人就好了，免認證費。

如(rú)果是商(shāng)家，想要小程序帶有(yǒu)支付系統，制作一(yī)個商(shāng)城小程序，那就選擇用企業/組織認證。通過這種方式開通的(de)小程序需要300認證費。

但如(rú)果你擁有(yǒu)一(yī)個認證過的(de)企業類型公衆号，

請點擊輸入圖片描述

在公衆号後台操作，點擊小程序管理(lǐ)小程序快速認證小程序。

2.開發前準備

1.綁定開發者

請點擊輸入圖片描述

2.設置開發設置，獲取AppID

請點擊輸入圖片描述

3.發布流程

請點擊輸入圖片描述

需要下載的(de)軟件--開發者工具

請點擊輸入圖片描述

開發過程中有(yǒu)任何問題，可(kě)以參考微信文檔

請點擊輸入圖片描述

如(rú)果是如(rú)果完全零基礎想要搭建一(yī)個微信小程序，有(yǒu)簡化了的(de)步驟，不需要代碼，拖拽式模塊化設計，支付系統，營銷插件統統支持。

同樣零成本，甚至連小程序300認證費都可(kě)以免去(qù)。注冊步驟和(hé)開發制作發布步驟都大大簡化，開發完成的(de)小程序商(shāng)城審核通過就可(kě)以立即投入運營。

通過輕棧注冊微信小程序，微信平台同樣需要認證商(shāng)家資質，為(wèi)了保護商(shāng)家和(hé)用戶的(de)權益，該做(zuò)的(de)不能少，隻是我(wǒ)們(men)幫你簡化了步驟，企業/組織 認證+法人實名認證，沒有(yǒu)公衆号也可(kě)以直接免300認證費注冊微信小程序。

請點擊輸入圖片描述

注冊成功後不需要開發前準備，直接制作，拖拽式制作，按住鼠标左鍵，把需要的(de)模塊拉到合适的(de)位置，松手，右鍵編輯。

輕棧【Design Lab】編輯頁面

上架商(shāng)品在電商(shāng)系統

一(yī)切準備就緒，就可(kě)以發布了，如(rú)果商(shāng)品數量10個左右，整個制作過程約30分鍾。同樣的(de)商(shāng)城小程序效果，同樣的(de)0成本，使用第三方可(kě)以節省很多時間和(hé)精力。

但也有(yǒu)問題，模塊化，拖拽式的(de)編輯器滿足不了所有(yǒu)商(shāng)家的(de)需求，功能再豐富也不可(kě)能100%覆蓋所有(yǒu)行(xíng)業，這種情況想要自(zì)己做(zuò)就要慢慢摸索了。

微信小程序如(rú)何開發

微信小程序的(de)優勢十分明 顯，小程序是不需要下載安裝便可(kě)以使用的(de)應用，它實現了應用觸手可(kě)及的(de)夢想，用戶掃一(yī)掃或搜一(yī)下即可(kě)打開應用，也體現了用完即走的(de)理(lǐ)念，用戶不用關心是否安裝太多應用的(de)問題，應用将無處不在，随時可(kě)用，但又無需安裝卸載。

小程序觸及了PC網頁，公衆号，H5，APP無法觸及的(de)地(dì) 方，其無需安裝，用完即走的(de)理(lǐ)念能夠滿足用戶需求且節省手機(jī)內(nèi)存。站在小程序的(de)擁有(yǒu)者的(de)立場，其開發成本大大減小，同時可(kě)借助微信強大的(de)流量入口，因而也降低(dī)了推廣的(de)難度。總的(de)來說，微信小程序是一(yī)種全新的(de)方式，能夠更好地(dì)在用戶和(hé)服務中建立連接，并且可(kě)以在微信中便捷地(dì)獲取和(hé)傳播，具有(yǒu)不錯的(de)使用體驗。

小程序全面開放申請以後，作為(wèi)企業、政府、媒體、其他組織或者個人的(de)開發者，都可(kě)以申請并注冊小程序。小程序和(hé)微信的(de)訂閱号、服務号以及企業号是并行(xíng)的(de)體系，具有(yǒu)獨立的(de)注冊以及發布流程。

小程序的(de)接入主要有(yǒu)4個步驟：

(1) 小程序注冊：在微信公衆平台官網首頁注冊并提交注冊信息、完善主體信息和(hé)管理(lǐ) 員信息。

(2) 完善小程序信息：完善小程序的(de)基本信息如(rú)名稱、 頭像及服務範圍等。開發前需綁定開發者并獲取APP ID，以保證程序可(kě)以通過手機(jī)進行(xíng)掃碼測試。

(3) 開發小程序：下載安裝微信開發者工具，微信官方提供了一(yī)套完整的(de)開發框架，開發者可(kě)以根據微信開發文檔進行(xíng)小程序的(de)開發與調試。

(4) 代碼審核及發布：小程序開發完成後，不能夠直接發布，需提交代碼與開發配置信息提交審核，完成後尚可(kě)發布。

微信Web開發者工具區别于H5的(de)開發工具+浏覽器 Device Mode預覽的(de)模式，而是基于自(zì)己的(de)開發者工具，可(kě)以實現同步本地(dì)文件+開發調試+編譯預覽+上傳+發布等一(yī)整套流程。同時小程序自(zì)己開發了一(yī)套WXML标簽語言和(hé) WXSS樣式語言，并非直接使用标準HTML5+CSS3。同時 提供了很多原生APP的(de)組件，之前在HTML5中需要模拟才 能實現的(de)功能，在小程序中可(kě)以直接調用組件來實現。

小程序開發框架的(de)核心是一(yī)個響應的(de)數據綁定系統。 分為(wèi)視(shì)圖層和(hé)邏輯層，小程序開 發工具提供了視(shì)圖層描述語言WXML和(hé)WXSS，以及基于 JavaScript的(de)邏輯層框架，并在視(shì)圖層與邏輯層間設置了數據傳輸和(hé)事件系統，使得開發者能夠很簡單地(dì)将重心放在數據與邏輯上。處理(lǐ)事務邏輯的(de)地(dì)方被稱為(wèi)邏輯層。在微信小程序中，所有(yǒu).js腳本文件的(de)集合構成邏輯層。邏輯層與視(shì)圖層相互配合，完成數據處理(lǐ)及接收事件反饋。框架的(de)視(shì)圖層由WXML與WXSS編寫，通過組件進行(xíng)展現。對于小程序本身，.wxml文件與.wxss文件的(de)集合構成了視(shì)圖層，邏輯層處理(lǐ)數據之後，會發送給視(shì)圖層用于與用戶的(de)交互，同時接收用戶對視(shì)圖層的(de)反饋。視(shì)圖層以給定的(de)樣式展現數據并反饋事件給邏輯層，數據展現是通過組件來進行(xíng)的(de)。視(shì)圖的(de)基本構成是組件。

項目開發完成後，管理(lǐ)員需手動打包上傳代碼，填寫相關配置類目并将代碼提交審核，若第一(yī)次審核未通過，再次提交審核将開放提供測試的(de)入口，該入口由開發者提供， 用于微信審核人員審核微信小程序時登錄。審核後手動發布即可(kě)。

微信小程序站在月活躍用戶9億人次的(de)微信的(de)肩膀上，自(zì)帶流量趨勢，入口多，功能簡單便捷。小程序功能快速叠代，意味着圍繞小程序的(de)開發和(hé)生态工具建設将會是移動互聯網的(de)一(yī)個巨大機(jī)會。目前各行(xíng)業內(nèi)諸多企業單位紛紛加入了小程序開發，開通了小程序功能。但小程序進行(xíng)優化後，開放了很多入口，使得開發者和(hé)用戶關注度不斷提升。縱使一(yī)些高(gāo)頻和(hé)複雜應用暫時無法被小程序取代，但是一(yī)些低(dī)頻應用的(de)主要功能，隻要能在小程序上實現，APP就可(kě)以完全卸載了。總的(de)來說，微信小程序目前發展空間甚好，至于以後未來的(de)發展仍舊(jiù)不能夠準确預測。

如(rú)何快速開發個微信小程序

無論是前端開發，還是後端開發，時間長(cháng)了，你總會能總結出它的(de)一(yī)些規律的(de)，對于前端開發主要就兩條，頁面展現，邏輯處理(lǐ)。如(rú)果是全流程開發的(de)話，那就是，如(rú)何創建項目，頁面如(rú)何實現，數據獲取和(hé)邏輯處理(lǐ)如(rú)何實現，如(rú)何打包上線。移動端或者前端，基本開發流程就這個四個步驟。所以在在前端方面去(qù)學(xué)習新一(yī)門開發技術，隻要你解決了這四個問題，那一(yī)切就OK了，下面我(wǒ)就講一(yī)下，我(wǒ)在學(xué)習微信小程序開發，如(rú)何用這四步法快速上手開發的(de)

學(xué)習一(yī)門新技術先看下它的(de)開發文檔 小程序介紹

然後呢(ne)就是開始一(yī)些準備的(de)步驟，微信公衆平台提供我(wǒ)們(men)開發管理(lǐ)的(de)功能 微信工作平台

賬号注冊

小程序信息配置

請看 小程序開發步驟

小程序項目的(de)創建

到此第一(yī)個問題我(wǒ)們(men)就算完成了，接下來解決小程序界面如(rú)何搭建。

然後最重要的(de)，微信提供自(zì)己的(de)開發者工具，不需要用chrome什麽調試， 微信開發者工具 提供wxapi的(de)調用測試能力，這些在chrome裏面是測試不了的(de)

框架的(de)視(shì)圖層由 WXML 與 WXSS 編寫，由組件來進行(xíng)展示。

将邏輯層的(de)數據反應成視(shì)圖，同時将視(shì)圖層的(de)事件發送給邏輯層。

WXML(WeiXin Markup language) 用于描述頁面的(de)結構。

WXS(WeiXin Script) 是小程序的(de)一(yī)套腳本語言，結合 WXML，可(kě)以構建出頁面的(de)結構。

WXSS(WeiXin Style Sheet) 用于描述頁面的(de)樣式。

小程序的(de)頁面是由wxml 和(hé)wxss這兩個文件來實現的(de)，wxml結構如(rú)何寫請參考 微信小程序組件

wxss是負責樣式控制的(de)，基本類似于css,支持flex布局，所以要想上手構建微信小程序的(de)界面，最好要熟悉html ,css.

還有(yǒu)最重要的(de)就是生命周期了

//index.js

Page({

  data: {

    text: "This is page data."

  },

  onLoad: function(options) {

    // 頁面創建時執行(xíng)

  },

  onShow: function() {

    // 頁面出現在前台時執行(xíng)

  },

  onReady: function() {

    // 頁面首次渲染完畢時執行(xíng)

  },

  onHide: function() {

    // 頁面從前台變為(wèi)後台時執行(xíng)

  },

  onUnload: function() {

    // 頁面銷毀時執行(xíng)

  },

  onPullDownRefresh: function() {

    // 觸發下拉刷新時執行(xíng)

  },

  onReachBottom: function() {

    // 頁面觸底時執行(xíng)

  },

  onShareAppMessage: function () {

    // 頁面被用戶分享時執行(xíng)

  },

  onPageScroll: function() {

    // 頁面滾動時執行(xíng)

  },

  onResize: function() {

    // 頁面尺寸變化時執行(xíng)

  },

  onTabItemTap(item) {

    // tab 點擊時執行(xíng)

    console.log(item.index)

    console.log(item.pagePath)

    console.log(item.text)

  },

  // 事件響應函數

  viewTap: function() {

    this.setData({

      text: 'Set some data for updating view.'

    }, function() {

      // this is setData callback

    })

  },

  // 自(zì)由數據

  customData: {

    hi: 'MINA'

  }

})

微信提供的(de)界面組件很多，沒必要一(yī)下子(zǐ)全學(xué)會，會用一(yī)兩個就行(xíng)，其他的(de)遇到需要的(de)時候現查先做(zuò)，這樣又節約學(xué)習時間，又能夠加深理(lǐ)解。到此第二個問題我(wǒ)們(men)解決了，下面看第三個問題，數據邏輯如(rú)何處理(lǐ)。

數據定義

數據展現

邏輯處理(lǐ)是通過js文件來操作的(de)

一(yī)個服務僅僅隻有(yǒu)界面展示是不夠的(de)，還需要和(hé)用戶做(zuò)交互：響應用戶的(de)點擊、獲取用戶的(de)位置等等。在小程序裏邊，我(wǒ)們(men)就通過編寫 JS 腳本文件來處理(lǐ)用戶的(de)操作。

view{{ msg }}/view

button bindtap="clickMe"點擊我(wǒ)/button

點擊 button 按鈕的(de)時候，我(wǒ)們(men)希望把界面上 msg 顯示成 "Hello World"，于是我(wǒ)們(men)在 button 上聲明一(yī)個屬性: bindtap ，在 JS 文件裏邊聲明了 clickMe 方法來響應這次點擊操作：

Page({

  clickMe: function() {

    this.setData({ msg: "Hello World" })

  }

})

響應用戶的(de)操作就是這麽簡單，更詳細的(de)事件可(kě)以參考文檔  WXML - 事件  。

此外你還可(kě)以在 JS 中調用小程序提供的(de)豐富的(de) API，利用這些 API 可(kě)以很方便的(de)調起微信提供的(de)能力，例如(rú)獲取用戶信息、本地(dì)存儲、微信支付等。在前邊的(de) QuickStart 例子(zǐ)中，在 pages/index/index.js 就調用了 wx.getUserInfo 獲取微信用戶的(de)頭像和(hé)昵稱，最後通過 setData 把獲取到的(de)信息顯示到界面上。更多 API 可(kě)以參考文檔  小程序的(de)API  。

現在幾乎每個應用都需要從後端獲取數據，那麽小程序如(rú)何獲取呢(ne)，當然是通過網路操作了。我(wǒ)們(men)封裝了小程序的(de)網絡操作

const app = getApp()

const request = (url, options) = {

  return new Promise((resolve, reject) = {

    wx.request({

      url: `${app.globalData.host}${url}`,

      method: options.method,

      data: options.method === 'GET' ? options.data : JSON.stringify(options.data),

      header: {

        'Content-Type': 'application/json; charset=UTF-8'

        // 'x-token': 'x-token'  // 看自(zì)己是否需要

      },

      success(request) {

        if (request.data.error_code === 0) {

          resolve(request.data)

        } else {

          reject(request.data)

        }

      },

      fail(error) {

        reject(error.data)

      }

    })

  })

}

const gets = (url, options = {}) = {

  return request(url, { method: 'GET', data: options })

}

const post = (url, options) = {

  return request(url, { method: 'POST', data: options })

}

const put = (url, options) = {

  return request(url, { method: 'PUT', data: options })

}

// 不能聲明DELETE（關鍵字）

const remove = (url, options) = {

  return request(url, { method: 'DELETE', data: options })

}

module.exports = {

  gets,

  post,

  put,

  remove

}

如(rú)何使用請看下圖

數據獲取

數據展現如(rú)下圖

數據展現

到此，第三個問題我(wǒ)們(men)就解決的(de)了下面看第四個問題。

小程序發布文檔說明

小程序發布步驟

到此四個問題都解決了。

總結：本文內(nèi)容是很簡單的(de)，借用了大部分官方文檔，其實本文目的(de)不是教你學(xué)小程序開發，而是分享一(yī)下在學(xué)習一(yī)項新事物我(wǒ)的(de)方法和(hé)思路，互聯網技術變化是很快的(de)，我(wǒ)覺得一(yī)個人的(de)能力，不僅僅是你技術有(yǒu)多好，你要明白技術是用來幹什麽的(de)，技術是用來解決現實生活中的(de)問題的(de)，一(yī)個好的(de)程序員，不是技術能力，而是解決問題的(de)能力，解決問題不可(kě)能隻用一(yī)種技術，這就要求你的(de)學(xué)習能力要強，針對不同的(de)問題，使用不同的(de)技術，哪怕使用的(de)技術你不熟悉，但它是解決問題最好的(de)方法，那就要求你有(yǒu)快速學(xué)習并解決問題的(de)能力。

學(xué)習一(yī)項新技術，我(wǒ)們(men)要先抓住主線，把流程搞通了，以後再在工作中慢慢的(de)熟悉和(hé)豐富對它細節的(de)一(yī)些認知，所以學(xué)一(yī)項東西前多問自(zì)己幾個問題，我(wǒ)學(xué)什麽，我(wǒ)為(wèi)什麽學(xué)，我(wǒ)怎麽學(xué)，等。先思考後學(xué)習，一(yī)定會讓你事半功倍。

對于怎麽學(xué)習微信小程序開發，我(wǒ)問了自(zì)己上面的(de)四個問題，每個問題，我(wǒ)隻需要了解大體內(nèi)容，四個問題都解決了，然後整個流程也就通了，以後也就是慢慢的(de)對每個問題內(nèi)容的(de)細節慢慢的(de)熟悉和(hé)了解了，其實花了不到一(yī)下午的(de)時間，我(wǒ)就搞出了一(yī)個簡單的(de)demo出來了，了解的(de)內(nèi)容基本已經覆蓋微信小程序日常開發80%的(de)內(nèi)容了。以上就是我(wǒ)的(de)一(yī)點學(xué)習心得。

最後 小程序Demo

Demo截圖

首頁

我(wǒ)的(de)

點擊我(wǒ)的(de)任意條目，數據是從第三方聚合平台提供的(de)api獲取的(de)

最後目前有(yǒu)很多的(de)多端開發框架，背景大多是都是因為(wèi)小程序開發的(de)盛行(xíng)

其他還有(yǒu)很多例如(rú)

阿裏的(de)rax

我(wǒ)們(men)自(zì)己的(de)ditto

小程序開發流程？

可(kě)以選擇小程序開發公司開發，有(yǒu)以下兩種方式可(kě)選擇：

1、定制開發公司，但是這種開發價格較高(gāo)，上萬，甚至十幾萬都有(yǒu)，還有(yǒu)就是開發周期較長(cháng)，幾個月，或者更長(cháng)；

2、第三方平台開發，這種呢(ne)，開發價格較低(dī)，根據更能幾千就可(kě)以實現，主要的(de)是開發周期短(duǎn)，一(yī)個星期左右就可(kě)以上線運營，因此，你可(kě)以結合自(zì)身進行(xíng)選擇開發。

如(rú)果是行(xíng)業內(nèi)比較成熟的(de)标準化系統就會相對便宜點。如(rú)：餐飲行(xíng)業類的(de)和(hé)電商(shāng)類以及酒店預約類的(de)小程序的(de)一(yī)般幾千元就可(kě)以了，因為(wèi)模闆的(de)功能已經相對豐富了。而簡單的(de)企業宣傳類的(de)一(yī)般幾百到幾千元就可(kě)以了。

但如(rú)果是全部需要開發定制，且功能也比較複雜、繁瑣，周期比較長(cháng)的(de)話，一(yī)般都是一(yī)萬至好幾萬甚至超過10萬，而且像這種是需要商(shāng)家提出具體的(de)需求服務商(shāng)才能判斷出具體價格。

總之，開發一(yī)個小程序需要考慮的(de)方面有(yǒu)很多，具體要根據你的(de)要求以及市(shì)場的(de)需求等因素來定價格，但不會跟上面的(de)價格相差太大，關于開發一(yī)個小程序商(shāng)城大概會花費多少錢，你可(kě)以參考上面的(de)介紹以及自(zì)己的(de)實際情況，自(zì)己來定奪選擇哪家公司合作。另外，金融類的(de)小程序需要具備相關資質，才可(kě)以發布上線。

關于小程序開發文檔官網和(hé)小程序開發文檔 官方的(de)介紹到此就結束了，不知道(dào)你從中找到你需要的(de)信息了嗎 ？如(rú)果你還想了解更多這方面的(de)信息，記得收藏關注本站。