小程式開發之基礎知識(0)

Spongelady發表於2018-08-10

前言:2016年9月21日,微信小程式正式開啟內測。 2017年1月9日0點,萬眾矚目的微信第一批小程式正式上線,使用者可以體驗到各種各樣小程式提供的服務。

人類發展史大抵經歷了石器時代青銅器與鐵器時代工業與科技時代(從第一次工業革命算起)。21世紀是一個資訊時代,網際網路和物聯網相輔相成,基於電腦、平板以及手機端的半人工智慧社會在人們越來越追求高效工作環境下誕生。從PC端到脫離笨重的電腦將人們對效率的要求把生活裝進口袋裡的手機app,我們正處於一個發展越來越快速的資訊時代。騰訊是我國的社交、遊戲大頭,“得流量者得天下”,BATJ推動了國家網際網路的快速發展,在形成巨頭壟斷的局面下也成為了推動技術發展的大推手。騰訊在手機工具的依託下再一次推動了產品的展現形式。最近我一直在思考,能準確進行下一代資訊革命的大佬會不會是可以那個可以在工具上(工具意指從pc->移動端)進行下一次革命的人。儘管手機這麼小巧的工具已經能很大的滿足我們的需求,但是若能在工具體驗上將裝置的精簡化發揮到極致,想必就會是一次較大的革命了。(原諒腦洞大開的我)

而小程式是直接對app產品展現形式的一次小變革,從騰訊軟肋出發,我一直認為小程式的初衷應該是彌補T與A在電商(遊戲就算是順帶的加成吧)方面的短板(小聲BB)。小程式發展到現在也將近2年,任意商家都可以擁有自己的小程式,但是不得不說實際上不好推廣。現在的小程式已經成為很多蠢蠢欲動的創業者的試金石,如果小程式流量入口尚且還行那麼大家就會將使用者轉移到自己的APP中,畢竟這仍舊是個流量為王的時代。也就是說,在下一個工具革命到來之前,不知道小程式會不會是唯一一個從產品展現形式來進行革命的產品。

 

開發:在進行小程式開發之前,要先了解什麼是小程式。小程式是以微信端為載體進行的產品依託平臺,當然這是我自己理解的。在微信小程式的開發文件裡有很多詳細的描述,包括基本的小程式標籤或者函式定義,基本的API介面介紹,每一期的迭代更新等。在進行大致的瞭解之後根據開發文件的介紹我們需要在本地安裝一個微信開發工具https://download.csdn.net/download/qq_25491201/10594550,該開發工具我用著覺得還不錯的。可能是小程式本來就是輕應用的原因吧,小程式提供了便捷的模擬器,還有基本的編輯頁和控制檯。其中常用的是頁面結構模組和編輯框。

安裝完微信開發小工具後在首頁進行登入,若未申請小程式賬戶需要註冊,註冊結束後該賬號會擁有相應的APPID和SecretID,常用的是APPID,將該串ID複製貼上到工具的登入頁,輸入其他相應的資訊,在下方選擇預設生成資料夾框架即可進入開發頁面。左邊有類似手機形狀樣的就是模擬器,在寫好一個專案後會將頁面前端的資訊在該模擬器中進行展示,接下來就是比較重要的檔案的結構介紹。

如上圖所示。這是我的一個開發好的小程式,下邊主要看文章結構。整個小程式專案主要由4種檔案構成,它們分別是.json檔案,.js檔案,.wxss檔案,.wxml檔案。其中.js檔案相當於是整個邏輯結構檔案,.json檔案就是在邏輯結構下進行配置的檔案,.wxml檔案相當於我們進行app開發或者網頁開發時的html寫的標籤頁面,wxss就是相當於css的樣式頁面。整個小程式專案都是由這4個檔案構成,我們在編寫每個檔案時參考小程式的官方文件就能很好地寫出小程式。再看看整個資料夾的結構,我們可以看到空白專案裡(hello還有logs資料夾),系統自動為我們生成pages資料夾,該資料夾下預設生成index資料夾和logs資料夾,pages資料夾裡的每個子資料夾基本上都是對應小程式裡每個頁面的內容,並且每個子資料夾裡定義的函式只能為本資料夾所呼叫。utils資料夾是一些在我們編輯專案時需要配置的一些檔案,在一級目錄下的app.js、app.json、app.wxss則是我們小程式的入口。其中我們小程式pages目錄下的每一個子資料夾的路徑我們都需要在.json檔案中的window項裡表示出來,詳情請見微信小程式開發文件。媽媽喊我去睡覺了,寫得實在匆忙。上圖是我花了一些時間開發的專案,還未申請上線,有興趣的朋友可以加我微信一起繼續開發(wechat:alonlady)。

相關文章