首頁>科技>

微信小程式的特點無需下載APP即可使用用完就走,不必擔心安裝了太多的應用讓應用無處不在隨用隨取

我們現在用的微信小程式都是別人開發好了的小程式,那麼,我們自己能不能開發小程式呢?當然是可以的,那麼,就隨著小編來進一步的認識一下小程式把。

開發小程式的人群劃分有一點的邏輯性對學習新知識有熱情無需太多基礎如果有js+css的基礎可以更快學習

怎麼樣,看到這個人群劃分,是不是覺得自己有能力學好這個小程式呢?沒錯,小程式本身不難,誰都可以開發簡單的小程式,至於你說那些高大上的程式,只要你學的夠深入,都是沒有問題的。

我們在開發前需要準備哪些準備工具呢?首先就是註冊:

小程式的註冊(機構、企業、政府開發的方法)選擇小程式賬號選擇註冊的賬號型別填寫郵箱和密碼啟用郵箱填寫主體資訊登陸小程式管理平臺完善小程式資訊繫結開發者獲取APPID(上述的操作目的都是為了這一步)下載開發者工具小程式註冊(個人)下載開發者工具個人沒有APPID沒有APPID的限制不能上傳和釋出小程式不能真機執行,可以pc模擬器執行錄音、網路狀態、撥打電話等功能無法實現獲取使用者資訊是模擬流程不影響我們開發小程式

說白了,沒有APPID也是可以開發的,屬於測試版的開發,不影響學習,但是以後進入企業工作的時候,還是需要進行企業的步驟獲取APPID。

第一個程式-helloWorld開發者工具下載開發者工具安裝動手開發helloworld那麼,我們用什麼工具進行開發呢?第一步,這裡啊,需要大家來記住一個網址:https://mp.weixin.qq.com//(微信公眾平臺的位置)其中,這裡面的Windows32是指32位的作業系統,Windows64則是64位的作業系統,大家根據自己的電腦安裝具體的版本即可。安裝好了之後,頁面就會出現這樣的一個程式,這便是我們進行操作的主程式了。安裝好了之後,頁面就會出現這樣的一個程式,這便是我們進行操作的主程式了。認識頁面開啟開發工具,首先,需要使用微信掃碼。這個時候回彈出一個頁面,我們需要點選建立小程式。設定小程式的名字,路徑,和型別,當然了,剛才說了,我們不是企業、機構,只能以個人註冊小程式,那麼,我們就來使用測試號,使用系統的APPID來程式設計。接下來,我們認識一下頁面的佈局,頁面的佈局主要分為模擬頁面、程式設計頁面,目錄樹、編輯頁面,和除錯頁面為主要組成部分,當然,還有其他的頁面我們是可以通過設定調出來的。除錯區域詳解console:控制檯,可以看到各種錯誤檔案sources:存放編譯之後的檔案network:監視微信小程式的網路資料和操作storage:快取,和使用者體驗有關APPdate:每個頁面儲存資料流,資料物件,面向物件的內容也在內wxml:程式碼的呈現效果有印象的會發現,這個和平常瀏覽器裡面用右鍵檢視審查元素的樣子很像,沒錯,他們是一家人,都是一樣的。程式碼結構分析pages資料夾:存放頁面的位置

index.js:微信小程式的操作和動作,可以獲取微信的資訊,一些操作的位置

index.wxml:在平常開發前端的時候,這個叫做HTML,頁面結構(外觀,呈現效果)

index.wxss:對照前端的css,樣式檔案,呈現的樣子,美化,修飾

app.js:是小程式的指令碼程式碼app.json:是對整個小程式的全部配置app.wxss:是對整個小程式的公共樣式表index.wxml:是頁面的結構檔案=HTMLindex.js:是頁面的指令碼檔案=jsindex.wxss:是頁面的樣式表=css

實現HelloWorld

講了那麼多,該如何實現helloworld樣子呢?看我接下來的操作:

如圖所示,在建立的這個小程式欄目裡面,找到“index.wxml”,將下面的這個<text></text>裡面改成“hello,微信小程式”即可

完成!!!

注意:沒有APPID的話,製作出的小程式是無法上傳在真機測驗的,希望大家注意。

三大不一樣字尾不一樣小程式,沒有DOM操作,但是web前端可以對節點進行操作,小程式封裝了,無法操作配置,web是通過url來控制的,小程式是json進行配置的寫在最後

大家通過第一章的講解,學會了嗎?我會在未來分享更多的教程,希望大家可以關注小編,謝謝大家了。

最新評論
  • 整治雙十一購物亂象,國家再次出手!該跟這些套路說再見了
  • 打敗京東順豐,運貨飛機數量達420架,一舉成為快遞行業龍頭老大