文档章节

Web项目,工程目录应该怎样规划?

哈库纳
 哈库纳
发布于 2015/12/23 22:18
字数 818
阅读 1066
收藏 13
点赞 1
评论 5

一、工程目录如何规划?

    通常我们会给自己的Web项目做一些目录上的规划,一般来说,我们会在webapp目录下创建很多文件夹。用来存放不同业务的文件,当遇到通用文件时我们会专门新建一个common文件夹来保存它们。此外还有js、img、css等等各类文件。最后我们的目录有可能是这个样子的(如下图:左边)

    左边这种方式,显然没有对工程结构进行预先的合理规划。属于典型的打一枪换一个地方做派。路子很野!效率很高!但是不成体系,一旦项目做大了,或者参与人员多了就会暴露各种问题。

    那么我们在看一看右边这种方式,它比左边的好了一些,专门为资源文件和公共文件做了规划。我相信一般情况下项目的目录结构都趋向于这种结构。在不同的项目会有相似但是各自不同的结构。

二、以框架的眼光规划工程目录

区块

    通常一个页面可以被切分为多个不同的小区块,每个小区块会按照业务进行划分。相同功能的部分我们也会使用相同的区块。例如:

    这样一来不同的页面都是通过组合区块的方式得以呈现,这样做的好处是页面中相同的部分可以抽象出来成为区块。为了后面理解更加方便,简单模拟一个电商网站的三个主要页面:

    这三个不同的页面根据各自的功能都进行了区块的划分,那么把眼光从区块上在放大到页面上。

布局

    可以看出,不同的页面都有“Head”和“Foot”区块,而且都是在相同的地方。通常实现这种逻辑的方式是我们在每个页面中都添加相应的代码,但是这也实在是太low了。现在我们把这个共性也抽象出来。

有了这个“layout”就可以解决我们页面之间共性的问题了,下面在举一个复杂点的例子。layout可以轻松解决。

    在这个复杂的布局例子中,首先定义了一个全网通用布局。然后根据市场不同定义了两类模版,第一类layout 1,用来做市场频道页。而第二类layout 2,用来做垂直市场List搜索页。

这两个布局例子可以在:淘宝网上见到。

页面

    经过上面“区块”“布局”的抽象,似乎已经可以表述整个网站的面貌。接下来就是用户真正可以看到的页面了。为了避免页面的路径和前面我们定义的两个元素混淆,再把所有页面单独放到一个目录中。最后的布局结构就变成了这个样子的:

三、结束语

    这样一来感觉上,这套目录就很清晰明了。

© 著作权归作者所有

共有 人打赏支持
哈库纳

哈库纳

粉丝 953
博文 81
码字总数 149803
作品 4
杭州
后端工程师
加载中

评论(5)

王爵nice
王爵nice
42 我也附带个小尾巴 https://github.com/biezhi/jb/blob/master/mvc/index.md
青木河
青木河

引用来自“断崖逐梦”的评论

来我们公司做架构师吗
哈哈哈,大哥太逗了
Smile月光
Smile月光
断崖逐梦
断崖逐梦
来我们公司做架构师吗
Cobbage
Cobbage
啊啊啊啊啊啊啊啊啊啊?
使用你喜欢的模版引擎渲染页面

目前 Web 网站的开发 基本都用到了模版引擎,使用 Hasor 开发 web 可以使用你喜欢的任何模版解析引擎。在开始本文之前,先推荐您三篇相关文章: https://my.oschina.net/u/1166271/blog/7530...

哈库纳 ⋅ 2016/10/06 ⋅ 0

使用maven管理 项目,多模块怎么结合?

假如说我有一个系统,现在分成了几个项目(maven里面的意思是模块),两个web工程,一个java工程 。 我应该怎么新建这些maven工程,他们的结构是怎样的? maven新手,望解答。。...

ccjiang ⋅ 2014/05/08 ⋅ 3

写书计划《让我们一起开源吧》目录大纲

目标读者: 写框架的人或者正在计划写框架的人,个人开源项目爱好者,有想法参与开源项目的读者。读者范围还可以扩大到Java初学者。 本书特色: 本书的视角是通过个人作者发起开源项目为切入...

哈库纳 ⋅ 2016/11/24 ⋅ 26

Maven 是怎样创建War 包?

最近在网上看到一篇介绍maven基础知识的文章,觉得对初学Maven的朋友一定有帮助。水平有限,翻译的不好,请大家见谅。 介绍 在处理WEB应用的时候,最终使用的工程文件是以War包的形式交付。M...

Matt_MYB ⋅ 2013/11/04 ⋅ 0

以Jar形式为Web项目提供资源文件(JS、CSS与图片)

一、背景 最近正在编写TagLib,在开发的过程中遇到一个资源文件引用问题。因为我开发的TagLib最终是以Jar包的形式提供给项目来用的,所以Jar包中必须包含我开发TagLib所需的JS、CSS与图片等资...

NoahX ⋅ 2013/06/27 ⋅ 10

在 Eclipse 下利用 gradle 构建系统

在 eclipse 下利用 gradle 构建系统 基本开发环境 操作系统:本教程使用的为 Windows Vista Enterprise, 如果您的系统是 Linux 的,请选择下载对应版本的其他工具,包括开发工具、Java EE 服...

红薯 ⋅ 2010/08/16 ⋅ 2

eclipse调试进入到class文件中的解决方法

eclipse打断点调试进入到class文件中,是由于对应的java类跟编译后的class文件,没有关联上, 解决办法: 在打断点调试的时候,如果发现进入到了class文件,先别着急关闭class文件,在该cla...

silencewen ⋅ 2014/06/18 ⋅ 0

ASP.Net应用程序的目录结构

每个Web应用程序都要规划自己的目录结构,除了自己设计的目录结构意外,ASP.Net也定义一些有特殊意义的目录。 1.Bin:这个目录包含了所有的预编译的ASP.NET的Web应用程序使用的.Net程序集(通...

长平狐 ⋅ 2012/10/16 ⋅ 0

Maven构建SpringMVC项目

一.背景介绍   对于初学者,用maven构建项目并不是一件容易的事,springmvc并不是MVC中的主流,但是本人觉得springmvc比struts要好用,真正做到了零配置。一次使用,就放不下了。 二.准备工...

underA ⋅ 2014/09/24 ⋅ 0

【项目启动】 tomcat启动,项目无法启动,无法正常访问/项目可以启动,报错:java.lang.ClassNotFoundException: ContextLoaderListener

使用maven搭建项目(这个错误和是不是使用maven搭建项目没有关系),然后部署到tomcat中运行。 出现问题1: tomcat跑起来了,但是启动时间很短,没有报错,项目不能正常访问 项目启动时间很短...

angel挤一挤 ⋅ 2016/06/23 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

MySQL主从复制原理、半同步操作步骤及原理

1.1 企业Linux运维场景数据同步方案 1.1.1 文件级别的异机同步方案 1、scp/sftp/nc 命令可以实现远程数据同步。 2、搭建ftp/http/svn/nfs 服务器,然后在客户端上也可以把数据同步到服务器。...

xiaomin0322 ⋅ 15分钟前 ⋅ 0

Oracle10g 数据及文件迁移过程[原]

QL*Plus: Release 10.2.0.1.0 - Production on 星期三 5月 11 10:22:35 2011 Copyright (c) 1982, 2005, Oracle. All rights reserved. 连接到: Oracle Database 10g Enterprise Edition Re......

harrypotter ⋅ 20分钟前 ⋅ 0

nginx安装

1:安装工具包 wget、vim和gcc yum install -y wget yum install -y vim-enhanced yum install -y make cmake gcc gcc-c++ 2:下载nginx安装包 wget http://nginx.org/download/nginx-1......

壹丶贰 ⋅ 23分钟前 ⋅ 0

ideaVim安装及配置

1.安装插件 File-Settings-Plugins,Browse Repositories,输入ideavim,安装。 重启后,在Tools-Vim Emulator启用。 2.快捷键设置 ideaViim键与idea快捷键有冲突,可以在Settings-Other Se...

Funcy1122 ⋅ 27分钟前 ⋅ 0

MySQL中B+Tree索引原理

B+树索引是B+树在数据库中的一种实现,是最常见也是数据库中使用最为频繁的一种索引。B+树中的B代表平衡(balance),而不是二叉(binary),因为B+树是从最早的平衡二叉树演化而来的。在讲B...

浮躁的码农 ⋅ 42分钟前 ⋅ 0

两道面试题,带你解析Java类加载机制

在许多Java面试中,我们经常会看到关于Java类加载机制的考察,例如下面这道题: class Grandpa{ static { System.out.println("爷爷在静态代码块"); }} cl...

1527 ⋅ 46分钟前 ⋅ 0

SpringCloud(Data Flow)

dataflow-server

赵-猛 ⋅ 56分钟前 ⋅ 0

深入理解Java虚拟机

这本书我读到第8章,之后就是在读不下去了。 读到后面是一种痛苦的体验,太多的东西是不全面的,大量的专有名词是没有解释的,读到最后很多东西仅仅是一个侧面,所以我觉得,这本书不适合初学...

颖伙虫 ⋅ 今天 ⋅ 0

NanoPi NEO core/ Ubuntu16.04单网卡配置3个IP地址(2个静态,1个动态)

配置 root@NanoPi-NEO-Core:/etc/network# cat interfacesauto loiface lo inet loopbackallow-hotplug eth0iface eth0 inet static address 172.31.188.249 netmask 255.......

SamXIAO ⋅ 今天 ⋅ 0

三步为你的App集成LivePhoto功能

摘要:LivePhoto是iOS9新推出的一种拍照方式,类似于拍摄Gif图或录制视频片段生成图片。如果没有画面感,可以联想《哈利波特》霍格沃茨城堡的壁画,哈哈,很炫酷有木有,但坑爹的是只有iphone6S以...

壹峰 ⋅ 今天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部