Nova PhoneGap框架 第五章 文件结构
一个好的项目架构必然有着合理的文件结构,如果一个项目的文件组织混乱,那么可以断言一定是项目架构有问题。
合理的文件结构能够帮你更清晰的管理你的文件,并且当需要添加新的文件的时候,你的程序员很清楚应该加到哪里。总的来讲,我认为好的文件结构应该满足以下3条标准:
- 每一个文件夹下面不应该有太多的文件,通常不超过30个;
- 每一个文件里面的代码不应该超过300行,不管是HTML、CSS还是JS文件;
- 所有的文件应该有层次感,属于同一层的文件应该放到一起。
前面2条标准看上去非常简单,实际情况呢?确实很简单,并且做起来也不难。但事实是很少有人这样去要求他们的程序员,因为他们觉得这算不得什么标准,只是个人喜好而已。然而从我带的多个项目经验来看,这2个简简单单的标准起到了非常大的作用,也正是这2个简单的标准多年来一直鞭策着我,不敢越雷池一步,从而想方设法不断去完善架构,不断去让代码变得易读。如果你已经花了不少时间读到了这里,那我真心希望你可以将这2条标准纳入囊中。顺便,我再赠送你2条关于编码的标准吧,希望能对你有用:
- 每一个方法不超过30行;
- 尽量一行注释都不要写。
回到前面提到的文件结构的3条标准,我已经说了2条简单而重要的,下面我将针对PhoneGap项目如何组织合理的文件结构进行详细的阐述,也就是第3条标准:分层。
5.1 分层
我们都知道PhoneGap程序使用HTML、CSS和JS来编程,那么文件首先按照这么3层来分的话就会很清晰了。每一层下面都可以用子文件夹来划分模块或者子模块,这样就可以保证每个文件夹下面不会有太多的文件。
通常情况下,一个项目的HTML和CSS文件相对较少,因此文件组织很容易。这里我只重点介绍JS部分的分层。
这里我也是参考我们的ASP.NET MVC项目架构对JS代码进行分层。我在CodePlex上面放了一个ASP.NET MVC全方位的架构解决方案,你有兴趣的话可以去看看,地址:http://mvcsolution.codeplex.com.
我先贴一个我们项目的文件分层情况:

跟这个项目业务相关的JS都放在了/js/at文件夹下面,我所说的分层也主要是这部分代码的分层。
1. Infrastructure
这一层主要放对系统或者第三方库的扩展,以及一些通用的方法,如对Array、Date的扩展,如对jquery ajax的再一次封装。所有层都可以访问。
2. Database
定义本地数据库以及表。通常下面有一个DbContext文件和多个实体类的定义。
3. Services
这一层的代码主要是访问本地数据库,供pages层调用。因此,pages层对数据库的访问都要经过service层,pages层不能直接操作数据库。
4. Apis
很多PhoneGap程序都需要跟远程服务器进行数据交换,这一层的代码就是做这件事的。通常,这一层的代码有大量的ajax调用。
5. Pages
操作HTML呈现给最终用户。
5.2 文件合并
还记得我们在第二章中阐述的index.html吗? 我们在第二章中说了,index.html相当于应用程序的壳, 在应用程序启动的时候,完成了应用程序的初始化,其中就包含了javascript的初始化。
在index.html中,项目业务相关的JS被合并到了一个文件里面,这里就用到了一个文件合并工具grunt。grunt的安装和使用我会在第九章开发工具中详细阐述。当所有的JS都已经初始化完成,那么我们的程序员在使用每一个JS类的时候,就不需要等待JS文件的加载了。
对JS文件的合并和初始化,其实可以理解成C#程序的编译。当我们编译C#程序时,我们写的所有的代码都被编译到了DLL中。这样一来,调用者就可以很方便的使用我们的代码了。因此对于PhoneGap程序来讲,JS文件的合并非常重要,能够极大的让代码变得更干净。
Nova PhoneGap框架 第五章 文件结构的更多相关文章
- Nova PhoneGap框架 第四章 本地数据库
我一直想把EntityFramework(简称EF)的那一套搬过来,应用于HTML5 SQLite. 幸运的是,我几乎做到了,有些功能无法完成的那是因为SQLite本身不支持.至少从现在已经完成的功能 ...
- Nova PhoneGap框架 第七章 设备事件处理
我们的框架包含了几种设备事件的处理,目的是为了让我们的程序员更容易的完成代码.这些事件包括:回退键(Android)和横竖屏切换事件. 7.1 Android回退键 首先来说说回退键的事件处理.当用户 ...
- Nova PhoneGap框架 第三章 页面
页面在项目架构中是一个很重要的概念,它让我们能够将一个功能复杂的项目拆分成一个一个功能比较独立的小区域,这极大的提高了代码的可读性和可维护性. 在我们这个框架中,一个页面由JS和HTML两部分组成,首 ...
- Nova PhoneGap框架 第六章 使用Mock
在我们的框架中引入了一个很重要的设计,那就是使用Mock. 这里的mock是指cordova.mock.js文件,它模拟了PhoneGap(Cordova)的API,从而可以在浏览器中运行测试我们的程 ...
- Nova PhoneGap框架 第一章 前言
Nova PhoneGap Framework诞生于2012年11月,从第一个版本的发布到现在,这个框架经历了多个项目的考验.一直以来我们也持续更新这个框架,使其不断完善.到现在,这个框架已比较稳定了 ...
- Nova PhoneGap框架 第二章 理解index.html
跟绝大多数PhoneGap程序一样,Index.html是程序的入口.这个页面应该完成应用程序的初始化工作. 首先,让我们来看看这个页面通常都长什么样子: 下面我将一一解释这个页面都做了哪些初始化工作 ...
- Nova PhoneGap框架 总结
Nova PhoneGap Framework 是完全针对PhoneGap应用程序量身定做的,在这个框架下开发的应用程序很容易实现高质量的代码,很容易让程序拥有很好的性能和用户体验. 在经历了多个项目 ...
- Nova PhoneGap框架 第八章 滚动条
你可能会疑惑为什么滚动条这么常见的功能会在这里单独列出,但如果你有过PhoneGap开发经验的话,你就会发现要在Android 2.3 里面实现滚动条那真不是一件容易的事. 8.1 概述 目前主流的P ...
- Nova PhoneGap框架 第九章 控件
我们的框架中也提供了一些常用的控件,这些控件大多都依赖于我们的框架,也正是在我们的框架下才使得实现这些控件的变得更简单.但是我们的框架是不依赖与这些控件的,如果你用不上这些控件,你完全可以把相关的代码 ...
随机推荐
- Range Sum Query - Mutable
https://leetcode.com/problems/range-sum-query-mutable/ 因为数组会变动,所以缓存机制受到了挑战...每次更新数组意味着缓存失效,这样一更新一查找的 ...
- UWP 应用获取 Localhosts 访问权限
这是一篇教程,写在 win10 版<量子破碎>发售近期. 主要原因:windows 商城的应用下载实在难以忍受...... so 尝试换一个下载环境(f&q)~ 然而使用 ss 并 ...
- nodejs持续学习--必须关注4网站
1.官网:https://nodejs.org/en/ 2.模块社区:www.npmjs.com(FQ) 3.github.com 4.全球技术问题讨论社区 http://stackoverflow. ...
- 限制input只能输入金额(类似:100.00|100.9|100)
$(".inputmoney").keyup(function () { var reg = $(this).val().match(/\d+\.?\d{0,2}/); ...
- while 循环 。。
这是一个可以循环到天荒地老的循环: 如果while 为真就一直循环下去: count=0 while True: count+=1 if count>50 and count<60: co ...
- C#改善程序的50种方法
作者: suyan010203 来源: 博客园 发布时间: 2011-07-09 14:47 阅读: 11976 次 推荐: 8 原文链接 [收藏] 从去年找工作以来,都没什么时间写博 ...
- 从vue1.0到vue2.0遇到的一些问题的记录
1.取消v-el的使用方式,改为refs使用 获取指定的dom元素 html:<div ref="div"></div> js: $refs.div 问题: ...
- Git 简介
版本控制 什么是版本控制? 我需要版本控制吗? - 如果你还没使用过版本控制系统,或许你会有以上疑问,甚至更多疑问.希望后面的回答能让你喜欢上版本控制系统,喜欢上Git. 什么是版本控制:顾名思义,版 ...
- wpf 仿QQ图片查看器
参考博客 WPF下的仿QQ图片查看器 wpf图片查看器,支持鼠标滚动缩放拖拽 实现效果 主要参考的WPF下的仿QQ图片查看器,原博主只给出了部分代码. 没有完成的部分 1.右下角缩略图是原图不是缩略图 ...
- The innocence is brilliant.
[11.20~12.20] 2016年的最后一个月在听Avril的歌,感觉她发音状态好好(对此建议去听<Wish You Were Here>!!!) 到此12月份的活都干完了吧~还剩最后 ...