在一篇构建基于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

构建基于Javascript的移动web CMS——Hello,World的更多相关文章

  1. 构建基于Javascript的移动web CMS——模板

    在上一篇<构建基于Javascript的移动CMS--Hello,World>讲述了墨颀 CMS的大概组成,并进行了一个简单的演示样例,即Hello,World.这一次,我们将把CMS简单 ...

  2. 构建基于Javascript的移动web CMS入门——简单介绍

    看到项目上的移动框架,网上寻找了一下,发现原来这些一開始都有. 于是,找了个演示样例開始构建一个移动平台的CMS--墨颀 CMS,方便项目深入理解的同一时候.也能够自己维护一个CMS系统. 构建框架 ...

  3. 构建基于Javascript的移动web CMS——加入jQuery插件

    当看到墨颀 CMS的菜单,变成一个工具栏的时候.变认为这一切有了意义.于是就继续看看这样一个CMS的边栏是怎么组成的. RequireJS与jQuery 插件演示样例 一个简单的组合示比例如以下所看到 ...

  4. 构建基于Javascript的移动CMS——生成博客(二).路由

    在有了上部分的基础之后.我们就能够生成一个博客的内容--BlogPosts Detail.这样就完毕了我们这个移动CMS的差点儿基本的功能了,有了上节想必对于我们来说要获取一个文章已经不是一件难的事情 ...

  5. 构建基于Javascript的移动CMS——加入滑动

    在和几个有兴趣做移动CMS的小伙伴讨论了一番之后,我们认为当前比較重要的便是统一一下RESTful API.然而近期持续断网中,又遭遇了一次停电,暂停了对API的思考.在周末无聊的时光了看了<人 ...

  6. 基于MVC4+EasyUI的Web开发框架经验总结(3)- 使用Json实体类构建菜单数据

    最近花了不少时间在重构和进一步提炼我的Web开发框架上,力求在用户体验和界面设计方面,和Winform开发框架保持一致,而在Web上,我主要采用EasyUI的前端界面处理技术,走MVC的技术路线,在重 ...

  7. 基于MVC4+EasyUI的Web开发框架经验总结(2)- 使用EasyUI的树控件构建Web界面

    最近花了不少时间在重构和进一步提炼我的Web开发框架上,力求在用户体验和界面设计方面,和Winform开发框架保持一致,而在Web上,我主要采用EasyUI的前端界面处理技术,走MVC的技术路线,在重 ...

  8. HTML5 Geolocation 构建基于地理位置的 Web 应用

    HTML5 中的新功能 HTML5 是最新一代的 HTML 规范,是 W3C 与 WHATWG 合作的结果,目前仍外于开发中.自从上一代 HTML4,Web 世界已经发生了巨大的变化,HTML5 的到 ...

  9. 9 个基于JavaScript 和 CSS 的 Web 图表框架

    COMSHARP CMS 写道:jQuery, MooTools, Prototype 等优秀的 JavaScript 框架拥有各种强大的功能,包括绘制 Web图表,使用这些框架以及相应插件,我们可以 ...

随机推荐

  1. nyoj 题目2 括号配对问题

    描述 今天发现了nyoj,如获至宝.准备开刷. 括号配对问题 现在,有一行括号序列,请你检查这行括号是否配对.   输入 第一行输入一个数N(0<N<=100),表示有N组测试数据.后面的 ...

  2. iOS----闪退,无报错原因,经典解决方案

    在iOS开发时,有时候遇到libc++abi.dylib handler threw exception这样的异常,  虽然在断点出加上了All Exceptions,也断到相应的代码了,但是没打印对 ...

  3. ubuntu安装jdk<服务器>

    服务器 阿里云服务器Ubuntu安装jdk7 2014-08-25 16:44 |  coding云 |  5825次阅读 | 6条评论   一.下载jdk 可以先下载到本地,然后ftp到服务器 官方 ...

  4. HUST-1407 郁闷的小J

    离线做法:分别处理每个编号上的各种询问和操作,接着就能用树状数组维护. #include <cstdlib> #include <cstdio> #include <cs ...

  5. 洛谷P3327 [SDOI2015]约数个数和 【莫比乌斯反演】

    题目 设d(x)为x的约数个数,给定N.M,求\(\sum_{i = 1}^{N} \sum_{j = 1}^{M} d(ij)\) 输入格式 输入文件包含多组测试数据.第一行,一个整数T,表示测试数 ...

  6. windows10下安装ubuntu16.04 双系统

    软件和材料:   UltraISO .ubuntu16.04镜像.U盘 步骤: 1.先在windows10 上下载UltraISO并安装 2.打开UltraISO,插入优盘,制作ubuntu160.4 ...

  7. zoj 1425 最大交叉匹配

    Crossed Matchings Time Limit: 2 Seconds      Memory Limit: 65536 KB There are two rows of positive i ...

  8. vuejs入门备忘&&用vuecli构建应用

    vuejs框架入门 mvvm图例 这张图足以说明MVVM的核心功能,在这三者里面,ViewModel无疑起着重要的桥梁作用. 一方面,通过ViewModel将Model的数据绑定到View的Dom元素 ...

  9. 转 如何在C++中调用C程序

    如何在C++中调用C程序?   C++和C是两种完全不同的编译链接处理方式,如果直接在C++里面调用C函数,会找不到函数体,报链接错误.要解决这个问题,就要在 C++文件里面显示声明一下哪些函数是C写 ...

  10. select函数与stdio混用的不良后果 (转)

    出自:http://www.cppblog.com/mysileng/archive/2013/01/15/197284.html 今天在看UNP6.5节,学习到了select与stdio混用的后果. ...