Build a JavaScript-based mobile Web cms--load JSON file

In the previous article on how to create a Django Tastypie API for Mobile CMS, then we also seem to have a local configuration file for some simple configuration, such as "get the URL of the API", "Product List", "SEO" (in the beginning to find that this is not good, Later found that Google's crawler can run JavaScript, but it is not recommended. These things do not need to be modified, directly written in the code seems to be bad, and then put in a file called configure.json .

Requirejs Plugins

Online search for a repo called Requirejs plugins.

There are several plugins in it:

2. Async : Useful for JSONP and asynchronous dependencies (e.g. Google Maps).
4. font : Load Web Fonts using the Webfont Loader API (requires propertyParser )
5. Goog: Load Google APIs asynchronously (requiresasync!Plugin andpropertyParser).
7. image  : Load image files as dependencies. Option to "cache bust".
9. JSON  : Load JSON files and parses the result. (Requires text! Plugin).
11. Mdown  : Load Markdown files and parses into HTML. (Requirestext!  plugin and a markdown converter).
13. noext : Load scripts without appending ". js" extension, useful for dynamic scripts.

So, we can use the JSON here to load the JSON file, although we can also use the Requirejs text plugin, but here JSON has a slight optimization.

In the later sections we also use Mdown, which is used to display a MD file that is roughly the same as the usage.

Requirejs JSON file loading

Put the Json.js plugin in the directory, and then configure the main.js.

Require.config ({    paths: {        ' text ': ' Text ',        jquery: ' jquery ',        json: ' Require/json '    },    shim: {        Underscore: {            exports: ' _ '}}}    ); require ([' app '], function (APP) {    app.initialize ();});

We then changed the data in homeview.js to configure, so that we could use the JSON file directly.

define ([    ' jquery ',    ' underscore ', '    mustache ',    ' text!/index.html ',    ' Json!/configure.json '), Function ($, _, mustache, Indextemplate, configure) {    var Homeview = Backbone.View.extend ({        el: $ (' #aboutArea '),        render:function () {this            . $el. HTML (mustache.to_html (indextemplate, configure));        }    );    return homeview;});

The code for Configure.json is as follows:

{    "project": "My Sample Project"}

The final effect is the same as the end of the template, and will only be displayed on the page

My Sample Project

End FETCH Code

First, using Git

git clone https://github.com/gmszone/moqi.mobigit Checkout b03f54c

Second, direct download

Other

CMS effect: Ink qi cms

QQ Discussion Group: 344271543

project:  https://github.com/gmszone/moqi.mobi