構建基於Javascript的移動web CMS——Hello,World,cmshello
在一篇構建基於Javascript的移動web CMS入門——簡介中簡單的介紹了關於墨頎CMS的一些原理,其極架構組成,於是開始接著應該說明一下這個CMS是如何一步步搭建起來。
RequireJS 使用庫及依賴
這裡用的是bower的JS來下載庫,詳細可以參考一下bower install js使用bower管理js 這篇文章。
需要下載的庫有
- RequireJS
- Backbone
- Underscore
- Mustache
- jQuery
使用RequireJS
引用官網的樣本
<!DOCTYPE html><html> <head> <title>My Sample Project</title> <!-- data-main attribute tells require.js to load scripts/main.js after require.js loads. --> <script data-main="js/main" src="lib/require.js"></script> </head> <body> <h1>My Sample Project</h1> </body></html>
我們需要一個require.js和一個main.js放在同一個目錄,在main.js中用使用require()來載入需要載入的指令碼。
require.config({ baseUrl: 'lib/', paths: { jquery: 'jquery-2.1.1.min' }, shim: { underscore: { exports: '_' } }});require(['../app'], function(App){ App.initialize();});
在config中可以配置好其他的庫,接著調用了app.js。
define(['jquery', 'underscore'], function($, _){ var initialize = function() { console.log("Hello World"); } return { initialize: initialize };});
當開啟index.html的時候便會在console中輸出Hello World。這樣我們就完成一個基本的架構,只是還沒有HTML,這個將會在下次繼續。
相關資源
QQ討論群: 344271543
源碼 Github: https://github.com/gmszone/moqi.mobi
問教你怎高效的開發移動Web應用
繼電腦、互連網之後,移動互連網正掀起第三次資訊技術革命的浪潮,新技術、新應用不斷湧現。今天這篇文章向大家推薦10大優秀的移動Web開發架構,協助開發人員更加高效的開發移動Web應用。1、Sencha Touch FrameworkSencha Touch 是世界上第一個基於 HTML5 的移動 Web 開發架構,支援最新的 HTML5 和 CSS3 標準,全面相容 Android 和 Apple iOS 裝置,提供了豐富的 Web UI 組件,可以快速的開發出運行於移動終端的應用程式。2、jQuery MobilejQuery Mobile 架構把“write less, do more”精神提升到更高的層次。jQuery 移動架構可以協助你設計一個可運行於所有流行智能手機和平板平台的應用程式,而不需要為每種移動終端都開發一個特別的版本。3、jQTouchjQTouch 是一款 jQuery 的外掛程式,用於手機上實現動畫、列表導航、預設應用樣式等各種常見UI效果。支援 iPhone、Android 等手機。4、The M ProjectThe-M-Project 是一個包含各種UI組件,基於 jQuery 開發 HTML5 應用程式的移動Web應用程式框架,支援 iOS、Android、Palm WebOS和BlackBerry 等平台。5、DHTMLX Touch – HTML5 JavaScript Framework for MobileDHTMLX Touch 是一個基於 HTML5 的免費 JavaScript 庫,用於構建跨平台的移動 Web 應用程式。
做手機端移動web,html5+css3+javascript,有什適合做展示新聞的架構?
jQuery Mobile
jquerymobile.com/