Mobile web開發架構與入門

1,338 views
1,207 views

Published on

Published in: Technology, Design
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,338
On SlideShare
0
From Embeds
0
Number of Embeds
6
Actions
Shares
0
Downloads
9
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Mobile web開發架構與入門

  1. 1. Mobile Web 開發架構與入門一 Mobile Web 與 Web 開發差異性二 Target三 開發環境與工具四 CSS JS HTML五 網路資源
  2. 2. 一 . Mobile Web 與 Web 開發差異性 Web Mobile WebBrowser 需考慮各家多種版本 只需考慮 WebKitWindow Size 固定大小 因旋轉而改變HTML5 Support 非所有瀏覽器都支援 IOS 完全支援, Android 絕大部分都支援 (android2.2 以下佔有率大 約是 6%)Display Area window viewportPerformance PC 效能通常不差 CPU Memory Storage 通 常都比較小
  3. 3. 二 .TargetBroswer 只需針對 Webkit-base Browser Chrome and Safari 做測試開發技術 採 HTML5+CSS3+JavaScript(JSON)
  4. 4. 三 . 開發環境與工具開發 IDE 工具 Eclips and AptanaDebug 1.Adobe Shadow(iOS and Android) 2.Android Chrome USB Debug(Android) 3.iOS Debug 4.debug.phonegap.com (weinre)
  5. 5. 四 .CSS JS HTMLCSS 1.Bootstrap 2.Less 3.CompassJS 框架 1.jQueryMobile+jQuery 2.BackboneJS +Zepto+RequireJS 3.Sencha Touch+ExtJS
  6. 6. 四 .CSS JS HTMLPackage Tool 1.RequireJS 2.Sencha TouchWrapper Tool 1.PhoneGap 2.Sencha TouchUtils 1.UnderscoreJS 2.SoundManager 3.iScroll
  7. 7. 五 . 網路資源Github電子報 JavascriptWeekly Html5Weekly社團 FB HTML5
  8. 8. CodeIgniter 使用經驗特色1. 目前效能最好也輕量的 Server 端 MVC 架構2. 使用 URI Router3. 使用簡單 , 幾乎不用設定安裝codeIgniter官網安裝參考
  9. 9. CodeIgniter 使用經驗使用1.Router 例 $route[admin/store/(:id)/(:cmd)] = admin/store/$id/$cmd $route[admin/citys] = admin/citys;2.Controller public function citys(){ header(Content-type: application/json); $this->load->database(); $citys=$this->_citys(); $this->db->close(); echo json_encode($citys);

×