微信小程序開發(fā)初探：工具界面，調(diào)試區(qū)六大工具介紹
【主要內(nèi)容:】
1. 微信小程序web開發(fā)工具下載地址
2. 創(chuàng)建項目
3. 開發(fā)工具界面
4. 調(diào)試區(qū)六大工具介紹
5. 我與微信小程序的插曲
6. 微信小程序總結(jié)
一、微信小程序web開發(fā)工具下載地址
1.1 在微信公眾平臺-小程序里邊去下載開發(fā)工具下載地址。
1.2 下載后安裝一下就可以使用了：
二、創(chuàng)建項目
2.1 微信小程序web開發(fā)工具需要掃碼登陸，所以必須先綁定開發(fā)者才可以：
2.2 已經(jīng)綁定的開發(fā)者可以創(chuàng)建項目，需要填寫AppID、項目名稱、本地開發(fā)目錄。
AppID需要去設(shè)置里邊獲取，如果不填的話官方給的提示是部分功能受限：
三、開發(fā)工具界面介紹：
1. 編輯：開發(fā)的時候，需要到編輯區(qū)去寫代碼
2. 調(diào)試：開發(fā)完需要調(diào)試程序的時候需要切換到這個區(qū)域，調(diào)試區(qū)有很多工具可供使用。
3. 項目：在這里可以上傳或者預(yù)覽項目
4. 編譯：就相當于運行項目的意思
5. 關(guān)閉：關(guān)閉當前工程
6. 微信小程序web開發(fā)工具提供實時預(yù)覽的功能，界面的效果會在這個區(qū)域顯示
7. 這個區(qū)域可以看到整個項目的文檔目錄結(jié)構(gòu)
8. 這個區(qū)域是編碼區(qū)
9. 這里是選擇屏幕尺寸的地方
10. 模擬網(wǎng)絡(luò)環(huán)境：2G/3G/4G/WiFi
四、調(diào)試區(qū)六大工具介紹：
在調(diào)試區(qū)開發(fā)工具提供了6種調(diào)試模式：
4.1 Console
Console的意思是控制臺，做過開發(fā)的都知道幾乎每個IDE都會有控制臺，可以顯示錯誤信息和打印變量的信息等。
4.2 Sources
Sources顯示了當前項目的所有腳本文件，微信小程序框架會對這些腳本文件進行編譯。
Source下邊還有一個區(qū)域，做過軟件開發(fā)的都知道，一般下邊是控制臺會顯示一些log信息、斷電調(diào)試等等。
4.3 Network
Network顧名思義：這個區(qū)域顯示的是與網(wǎng)絡(luò)相關(guān)的信息，我這里暫時沒有進行網(wǎng)絡(luò)請求。
4.4 Storage
官方的解釋是顯示當前項目的使用wx.setStorage或者wx.setStorageSync后的數(shù)據(jù)存儲情況。這個后續(xù)用到再慢慢研究
4.5 AppData
AppData是顯示當前項目顯示的具體數(shù)據(jù)，可以在這里編譯，并且會在頁面實時顯示。
4.6 Wxml
Wxml調(diào)試區(qū)：把他的名字換一下的話大家就好理解了，其實他的實質(zhì)就是HTML+CSS，微信只是把HTML改成了Wxml而已。學(xué)過HTML的人一看就明白，左側(cè)的區(qū)域是HTML語言+CSS的一些標簽屬性。右側(cè)可以便捷的設(shè)置CSS的屬性。
五、我與微信小程序的插曲
讓我和朋友誤以為微信出的這個小程序類似于Xcode的Storyboard功能一樣可以進行拖拽開發(fā)。申請完的第一時間我就可以找這個功能找了一下午都沒有找到，最后找到一個微信小程序設(shè)計指南，在這里邊我找到了之前看到過的圖，原來之前看到的那些圖都是一些小程序的設(shè)計規(guī)范而已，并不是我想象的那樣可視化開發(fā)，讓那些不會代碼的人也能開發(fā)。
雖然目前的內(nèi)側(cè)版本并沒有這個功能，但是不排除不就的將來微信會出類似Xcode的Storyboard這樣的可視化開發(fā)功能。
六、微信小程序總結(jié)
當然其他程序猿也不必慌張，微信小程序才剛出來，目前還是內(nèi)測階段對于我們來說有大把大把的時間來學(xué)HTML5相關(guān)的技術(shù)。畢竟一門語言學(xué)會了，其實語言和語言之間的思想是相同的，只是每個語言的語法不同而已。
其次，還想聊聊前端開發(fā)程序猿（iOS/Android/H5/WP.....）未來的發(fā)展方向。再往前四五年，當時大家都是100% Native開發(fā)。但是隨著HTML5的發(fā)展和性能不斷的改進，再加上強大的網(wǎng)絡(luò)支持，HTML5做出來的東西非常接近原生語言開發(fā)的App，而且原生app還不具備HTML5頁面的靈活性。在易到用車開發(fā)的時候HTML5的頁面大概能占到所有頁面的10%，而且這個比例也再不斷增長。因為運營可能會經(jīng)常的發(fā)布活動，如果用Native開發(fā)，那么每次活動都需要重新提交審核太麻煩了，所以HTML5的優(yōu)勢就體現(xiàn)出來了。所以像iOS或者Android開發(fā)的工程師都可以去學(xué)習web前端的開發(fā)技術(shù)，即使不為了開發(fā)小程序，也為了程序中日漸變多的HTML5頁面的交互和相互調(diào)用。
未來微信小程序的開發(fā)對于中小企業(yè)的公司來說確實不錯，如果對業(yè)務(wù)和性能方面要求不是很高，完全可以用微信小程序開發(fā)就可以，這樣前端的開發(fā)工作只需要招一個web前端的程序猿即可。至少可以干掉iOS和Android兩個程序猿。但是作為iOS和Android程序猿也沒必要擔心會被web前端搶了飯碗。語言都是互通的只要學(xué)習誰都可以做。而且目前只是內(nèi)測微信小程序做出來的app的性能不得而知，所以目前的任務(wù)就是先學(xué)習web前端技術(shù)，以備不時之需。
