正文 

当前位置： 首页 > java > java语法

构建基于javascript的移动webcms入门——简单介绍

yutingliuyl      2022-02-12     196

关键词：

看到项目上的移动框架，网上寻找了一下，发现原来这些一開始都有。

于是，找了个演示样例開始构建一个移动平台的CMS——墨颀 CMS，方便项目深入理解的同一时候。也能够自己维护一个CMS系统。

构建框架

尝试过用AngularJS和EmberJS。发现对于使用AngluarJS以及EmberJS来说，基本的问题是要使用自己熟悉的东西没那么easy引入。并且考虑到谷歌向来对自己的项目的支持不是非常好~~，所以便放弃了AngluarJS的想法。

于是開始寻找一些方案，可是最后还是选择了一个比較通用的方案。

  1. RequireJS
  2. jQuery
  3. Underscore
  4. Backbone

相对于AngularJS来说，Backbone是一个轻量级的方案，从大小上来说。对于自己来说。灵活性算是当中好的一点，也就是自己能够任意的增加非常多东西。

关于Backbone

Backbone.js是一套JavaScript框架与RESTful JSON的应用程式接口。也是一套大致上符合MVC架构的编程范型。Backbone.js以轻量为特色。仅仅需依赖一套Javascript 函式库就可以执行。

详细功能上应该是

  1. Backbone 轻量级，支持jquery，自带路由。对象化视图，强大的sync机制降低页面大小从而加快页面显示。
  2. jQuery jQuery使用户能更方便地处理HTML（标准通用标记语言下的一个应用）、events、实现动画效果，并且方便地为站点提供AJAX交互。只是主要是jQuery能够使用户的html页面保持代码和html内容分离，仅仅需定义id就可以。
  3. Underscore是Backbone的依赖库 Underscore 是一个JavaScript有用库,提供了相似Prototype.js的一些功能,可是没有继承不论什么JavaScript内置对象。

  4. RequireJS 你能够顺序读取仅须要相关依赖模块。

前台UI，使用的是Pure CSS，一个轻量级的CSS框架，可是最后感觉，整体用到一起。大小还是相当的。仅仅是能够有一个更好的移动体验。

其它可替换的框架

  1. AngularJS。考虑到某些因素，可能会替换掉Backbone，可是还不是当前可行的方案。

    为了学习是一方案，也为了更好的普及某些东西。

  2. handlebars Handlebars 是Mustache的改进。显示与逻辑分离，语法兼容Mustache。能够编译成代码，改进Mustache对路径的支持，可是若须要在服务端执行须要使用服务端Javascript引擎如Node.js。

项目

前后端分离设计，后台对前台仅仅提供JSON数据。所以在某种意义上来说可能会仅仅适合浏览，和这个要配合后台的框架。总的来说，适合于阅读类的站点。

源代码

代码依旧是放在Github上。基本功能已经能够Works了。

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

进展及目的

最后目标:构建一个移动平台的CMS系统。

当前:对于这样一个项目来说，眼下会考虑优先支持以下的两个框架，

  1. Django+Tastypie API
  2. Wordpress

如今：能够从后台读取到数据。

其它

一些比較好的资料有

相关资源

QQ讨论群: 344271543

源代码 Github: https://github.com/gmszone/moqi.mobi

构建基于javascript的移动webcms——加入jquery插件

当看到墨颀CMS的菜单，变成一个工具栏的时候。变认为这一切有了意义。于是就继续看看这样一个CMS的边栏是怎么组成的。RequireJS与jQuery插件演示样例一个简单的组合示比例如以下所看到的，在main.js中加入以下的内容requirejs.conf... 查看详情

构建基于javascript的移动cms——生成博客.路由

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

javascript入门

...弱类型，基于原型的语言，主要用于网页编程一、什么是JavaScript：　　JavaScript是一种属于网络的脚本语言，已经被广泛的用于Web应用开发，常用来为网页添加各式各样的动态功能，为用户提供更流畅美观的浏览效果。通常JavaScr... 查看详情

gulp入门教程

...ulp是基于Nodejs的自动任务运行器，它能自动化地完成 javascript/coff 查看详情

基于 JavaScript 的跨平台移动应用程序分析 [重复]

】基于JavaScript的跨平台移动应用程序分析[重复]【英文标题】：AnalyticsforcrossplatformJavaScriptbasedmobileapp[duplicate]【发布时间】：2012-10-1610:05:38【问题描述】：可能重复：HowtouseGoogleAnalyticswithPhonegapwithoutaplugin?我想使用Phonegap之类的... 查看详情

基于echarts在使用过程中的有关javascript的总结（入门级）

step1：页面上在一段区域上从左到右添加三个同一类型的"pie"饼图，但是数据不一样时，如何减少不必要的重复代码段呢？首先，html页面代码如下：<ulclass="order-infoList"><li><divid="order-category"style="width:100%;height:100%"><... 查看详情

基于 JavaScript 滚动的动画在移动设备上不稳定

】基于JavaScript滚动的动画在移动设备上不稳定【英文标题】：JavaScriptscrollbasedanimationischoppyonmobile【发布时间】：2017-02-2312:45:09【问题描述】：我有2个div（左右），我想根据右侧滚动左侧。https://jsfiddle.net/3jdsazhg/2/这在台式机上... 查看详情

gulp的入门级教程

...。gulp是基于Nodejs的自动任务运行器，她能自动化地完成javascript/coffee/sass/less/html/image/css等文件的的测试、检查、合并、压缩、 查看详情

正则表达式基于javascript的入门详解(代码片段)

tablewidth:96%;margin-left:0pxtdheight:32px;color:#D2691E;font-size:12px.tlTablewidth:50%;margin-left:10px.metNamewidth:20%.dywidth:20%.dyName1width:25%.dyName2width:25%.dyName3width:25 查看详情

gulp详细入门教程

...。gulp是基于Nodejs的自动任务运行器，她能自动化地完成javascript/coffee/sass/less/html/image/css等文件的的测试、检查、合并、 查看详情

gulp详细入门教程

...。gulp是基于Nodejs的自动任务运行器，她能自动化地完成javascript/coffee/sass/less/html/image/css等文件的的测试、检查、合并、 查看详情

gulp详细入门教程

...。gulp是基于Nodejs的自动任务运行器，她能自动化地完成javascript/coffee/sass/less/html/image/css等文件的的测试、检查、合并、 查看详情

web前端学习分哪些阶段？

...前端学习分为8个阶段：阶段1.前端核心基础HTML+_CSS核心、JavaScript基础语法、JavaScript面向对象、JavaScriptDOM和BOM编程、jQuery框架阶段2.HTML5+CSS3+移动端核心HTML5新特性、Canvas专列、CSS3新特性、CSS3进阶、CSS3实例演练阶段3.移动端移动... 查看详情

vue基础入门

...ps://cn.vuejs.org/Vue介绍Vue是一套用于构建用户界面的渐进式JavaScript框架。与其它大型框架不同的是，Vue被设计为可以自底向上逐层应用。Vue的核心库只关注视图层，方便与第三方库或既有项目整合。Vue优点1、体积小：压缩后的体... 查看详情

使用 cordova 进行基于 HTML 和 JavaScript 的混合移动应用程序开发的最佳框架

】使用cordova进行基于HTML和JavaScript的混合移动应用程序开发的最佳框架【英文标题】：BestframeworkforHTMLandJavaScriptbasedhybridmobileapplicationdevelopmentwithcordova【发布时间】：2016-06-0615:21:39【问题描述】：我是混合移动应用程序开发的新... 查看详情

推荐系统从入门到入门——基于mapreuduce与spark的分布式推荐系统构建

...Reduce的电影推荐系统3.1原理与系统设计3.2代码实现与系统构建3.3系统测试四、Spark1.前置知识1.1RDD1.1.1RDD简介与设计1.1.2RDD表示1.2ALS1.2.1LS1.2.1ALS简介2.Spark详解2.1Spark简介与生态2.2Spark全流程详解2.2.1Spark原理2.2.2Spark工作流程3.基于Spar... 查看详情

javascript--基于jquery的模仿移动端上拉加载更多控件

简单实现手机端上拉加载更多，通过触发trigger()事件，触发原先已经写好的请求css样式.more{padding:10px10px;height:50px;background:#fff;background-clip:content-box;text-align:center;line-height:50px;font-family:"MicrosoftYahei";display:non 查看详情

node.js入门：就是运行在服务端的javascript

简介Node.js是一个基于ChromeJavaScript运行时建立的一个平台。Node.js是一个事件驱动I/O服务端JavaScript环境，基于Google的V8引擎，V8引擎执行Javascript的速度非常快，性能非常好。简单的说Node.js就是运行在服务端的JavaScript。详细学习：... 查看详情