前言：
- 雖然小程序出來已久，但是因?yàn)楦鞣N原因一直沒有去學(xué)習(xí)，剛好最近公司有小程序的開發(fā)任務(wù)，所以開始學(xué)習(xí)小程序的開發(fā)。
- 接到任務(wù)之后就上網(wǎng)了解了下微信小程序開發(fā)所需的一些開發(fā)技能，以及對(duì)技術(shù)要求高低；
- 了解了一些基礎(chǔ)之后心里大概有個(gè)底，然后開始根據(jù)原型圖來評(píng)估開發(fā)所需的時(shí)間；
- 技能要求：CSS，JS
- 以下所有的步驟其實(shí)微信公眾平臺(tái)都有詳細(xì)的說明，建議可以直接去微信公眾平臺(tái)看官方說明；
- 微信官方有關(guān)軟件介紹下載說明：https://developers.weixin.qq.com/miniprogram/dev/devtools/devtools.html
一、軟件下載地址(有win64，win32，和Mac版本)
二、安裝微信Web開發(fā)者工具
- 安裝過程沒什么特別注意的，都比較簡(jiǎn)單，一步步按提示安裝即可，在此不贅述了；
三、創(chuàng)建一個(gè)簡(jiǎn)單的項(xiàng)目
- 1、打開微信Web開發(fā)者工具后，用微信登錄即可，后續(xù)不需要重復(fù)登錄
- 2、登錄后選擇對(duì)應(yīng)的項(xiàng)目類型，小程序項(xiàng)目還是公眾號(hào)網(wǎng)頁任務(wù)，這里我們選擇小程序項(xiàng)目即可，選擇之后基礎(chǔ)信息如下：
- createProject.png
- 項(xiàng)目目錄：項(xiàng)目將要存放的地址，設(shè)置后目錄之后，會(huì)出現(xiàn)建立普通快速啟動(dòng)模板，還是建立插件快速模板；
- AppID：小程序ID具體申請(qǐng)可去微信公眾平臺(tái)查看申請(qǐng)步驟,因?yàn)楝F(xiàn)在還沒申請(qǐng)AppID所以直接選擇體驗(yàn)就OK；
- 注冊(cè)接入流程說明：https://mp.weixin.qq.com/cgi-bin/wx
- 項(xiàng)目名稱：如名，沒什么好說的；
四、新項(xiàng)目的各個(gè)文件說明
- 小程序項(xiàng)目主要文件類型有;
- .js：邏輯交互，網(wǎng)絡(luò)請(qǐng)求等操作，類似MVC架構(gòu)Android項(xiàng)目中的Activity，響應(yīng)用戶在界面的一些操作，控制頁面的顯示以及與服務(wù)器的數(shù)據(jù)交換
- .wxss：主要是定義頁面中控件的樣式，有點(diǎn)類似Android中的View對(duì)應(yīng)的style
- .wxml：每個(gè)頁面對(duì)應(yīng)的布局
- .json ：每個(gè)page中的有一個(gè)json文件，可以設(shè)置頁面標(biāo)題等。。
- 項(xiàng)目建立之后會(huì)有app.json文件，這里面主要定義了狀態(tài)欄的顏色或者標(biāo)題顏色等樣式；
- 每個(gè)頁面需要在此注冊(cè)，按照Demo中的注冊(cè)方式仿照注冊(cè)即可
- 項(xiàng)目創(chuàng)建之后根目錄下有project.config.json文件，里面是項(xiàng)目的基礎(chǔ)配置文件，如AppId、項(xiàng)目名稱等；
五、軟件界面簡(jiǎn)單說明
- soft.png
六、總結(jié)說明
- 這篇主要是對(duì)小程序開發(fā)環(huán)境搭建的一個(gè)簡(jiǎn)單記錄，所以不涉及到有關(guān)開發(fā)語言問題；
- 以上所有的內(nèi)容其實(shí)微信官方都有比較詳細(xì)的說明，可以直接查看官方文檔，權(quán)威又詳細(xì)；
- 開發(fā)之初很多東西在微信公眾平臺(tái)都沒找到，只能在第三方的博客論壇去找資料，結(jié)果后面發(fā)現(xiàn)微信公眾平臺(tái)都有。浪費(fèi)了不少時(shí)間。。。
- 上一篇：《寫博客的初心》
- 下一篇：《小程序開發(fā)之界面編寫》
