Monaca Web IDE 初體驗 —— 開發PhoneGap/Cordova應用程序,還用什么Eclipse/XCode!


技術能實現的,就一定會發生,現在輪到Web IDE了。

Monaca 是純在Web端運行的一個基於Cordova生態的Web IDE,其功能之完善與易用已經足以讓Eclipse和XCode汗顏。坊間傳聞Javascript一統江湖的時候不遠了,因為控制了UI,你就控制了世界。

先來看看怎么用吧:

1、登錄 http://monaca.mobi 以后打開左上角的“DashBoard”

2、Monoca不愧是良心作品,提供了很多入門的Sample,其中的Onsen UI是一個非常優秀的Mobile App框架,在這里我選擇添加了一個Onsen UI Sliding Menu 的 App 

    

3、不用做任何的修改,點擊DashBoard上的Preview,就可以在當前瀏覽器中瀏覽預期的UI效果了

當然不能用這個Preview來調試代碼,因為PC瀏覽器里可沒有Cordova的Framework啊。

4、那怎么真正讓應用程序跑在手機上呢?很簡單,在Monaca上Build一個debug-apk並且安裝到手機上就完了

運行起來就是這個樣子:

5、到目前為止介紹的功能除了在線編輯器以外,使用PhoneGap提供的在線打包工具照樣能夠實現這些功能,要是這樣看就太小瞧Monaca了,Monaca還提供了一個debugger

同樣會生成一個apk,但這個apk是用來對你的賬號下所有新建Cordova的應用程序進行調試用的,在app中登錄之后就可以看到你在Monaca上上傳的所有app了:

6、點擊對應的app之后,可以看到之前寫在index.html里面的alert("55555")這句話生效了:

     

Monaca估計里面集成了socket.io的模塊,在雲端的IDE中更新任何代碼並Ctrl+S保存之后,會在手機上實時的更新並運行

    

點擊右下角的那個圓圈,會彈出各種功能,比如查看當前頁面的HTML,還有Log信息等等:

 

7、注意到左邊的文件樹,如果覺得上傳一個一個的圖片或者js太麻煩的話可以使用WebDAV的映射,把雲端的空間映射到本地的磁盤上,具體過程可以參考http://docs.monaca.mobi/3.5/en/manual/monaca_ide/webdav/

8、Monaca還提供了更多高級功能和他擴展的Monaca JS API,這些都可以在官網上找到文檔

9、如果你開發了第三方的Plugin,可以在這里進行上傳,記得要選擇到plugin.xml文件,當然這個高級功能需要付費,一年500刀,這樣生成的Debugger中就會包含第三方的Plugin了,Cordova的Plugin的生態非常開放,可以在這里找到好的Plugin:http://plugreg.com

10、Monaca居然還提供了Monaca BackEnd,抽象了用戶登錄等功能組件,還可以在Monaca上面新建數據表。。只能說Monaca在下一盤很大的棋。。。

 

體驗到這里,我似乎想不出再用Eclipse和XCode再開發Cordova應用程序的理由了。。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM