设计理论:制作网页前端开发的文档

前端开发的文档相信大多数情况下都没有后端的服务描述详细,而大多数测试也仅仅在黑盒测试,所以很多情况下对这片文档的描述都廖廖无几。

前端文档缺失的原因

前端开发的文档相信大多数情况下都没有后端的服务描述详细,而大多数测试也仅仅在黑盒测试,所以很多情况下对这片文档的描述都廖廖无几。

* 前端开发的代码分散——没有规范化,没有很好的设计,大多数人仍以业务为主的开发方式。
* 测试人员对前端仍然处于黑盒测试,有没有文档都不影响到他们的测试进程。
* 一旦业务定型,用传统方式的文档模式,很难复制到前端开发来。——改变了开发方式(从作坊式到规范化)让人难以适应。

尝试对症下药

对于代码分散的问题需要从源头解决。从规范化开始,试点从头到尾惯穿规范化,强制的约定,使代码质量提高。
这一块需要下大力气,中间加入设计 review、代码review等环节。需要注意的是粒度把控,即什么是必须的,什么是可选的,什么是约定的等有共识。

* 功能描述——开发前的工作,对编码者来说必须收集需求。对于使用者来说,能够知道写这个代码的目的是什么,解决了什么问题,还有什么问题没有解决,或需要改进。
* 设计描述——分享你的思想,这很重要,一个成熟的开发人员看开码的时候很多时候不是看你实现如何如何,而是看你的设计。
* API描述——使用者快速上手。接口是代码的眼睛。命名要严谨,不能说也可这样,也可那样。经验告诉我们,接口做得不好,历史原因就会多。
* demo/snippets——给使用的人copy/paste没什么不好。
* 使用指南——例如库的使用指南等手册。或者说一个简单的上手教程

文档该由谁来写?

从理论上看,文档都应该由编码者来写,其实不然。一个软件的周期,可以分为:开发前,开发时,使用时,测试时,维护时。
那么各时间段上应该有不同的人来参与。缩小些范围来看的话,应该将

* 开发前收集需求由大家参与。实现者收集后存档到文档里。此为开发目的与预期。
* 开发时的API描述,设计描述主要由编码者来实现。
* 开发后/维护时的demo及snippets可以由使用者来完善。

设计文档是否能自动化生成

代码注释(现在一般都用java doc)可以生成接口文档。
以往都必须自己画设计图,配上描述。那么理论上这块也应该可以通过注释加入设计的描述,通过文档生成的工具自动生成设计图。这样应该方便多了。

时间: 2024-08-31 20:18:44

设计理论:制作网页前端开发的文档的相关文章

网页前端开发工具推荐

  当启动一个新的项目,使用 CSS 框架或样板,可以帮助您节省大量的时间.在这篇文章中,我编译整理了我最喜欢的 CSS样板,框架和库,帮助你在建立网站或应用程序时更加高效. Bootstrap 开发工具推荐-网页前端开发工具"> 如果你想给你的新项目的专业的外观和感觉,Boostrap 可能是你需要的工具.它拥有一个非常干净的排版,表格元素,以及设计一个现代化的网站你需要的所有东西.更多信息: twitter.github.io Foundation Foundation 来自 Zurb

网页开发-初学网页前端开发有很多困惑ヾ(@⌒ー⌒@)ノ

问题描述 初学网页前端开发有很多困惑ヾ(@⌒ー⌒@)ノ 网页前端开发适合用什么工具?本来打算用Dreamweaver CS6的,现在是Dreamweaver 8,可是上网一看都不支持这个,求大神支招^_^ 解决方案 初学这个,建议参考另外的开发神器,最近自己在用sublime,很不错,支持代码很强大,功能很多.自定义插件,更是了不得,多看看这个. 解决方案二: sublime,几乎专业的前端人员都用这个,主要是便捷,功能强大,你可以试试 解决方案三: hBuilder也不错

前段开发-请问如何在有iframe框架的网页里实现父子文档互相访问,分别用javascript和jquery实现

问题描述 请问如何在有iframe框架的网页里实现父子文档互相访问,分别用javascript和jquery实现 请问如何在有iframe框架的网页里实现父子文档互相访问,分别用javascript和jquery实现 解决方案 搞懂关系就很简单了iframe和父页,window.open打开页面之间的引用 解决方案二: window.parent.find('iframe'). 解决方案三: 能再详细点吗,各位大牛哥哥 解决方案四: http://www.cnblogs.com/luluping

WPF界面设计技巧(11)-认知流文档 & 小议WPF的野心

原文:WPF界面设计技巧(11)-认知流文档 & 小议WPF的野心     流文档是WPF中的一种独特的文档承载格式,它的书写和呈现方式都很像HTML,它也几乎具备了HTML的绝大多数优势,并提供了更强的编程支持及对WPF其他元素的兼容.   直接来看代码吧,需要讲解的地方比较多,我就直接注释在代码里了,看起来更方便些:     Code<Window x:Class="流文档.Window1"     xmlns="http://schemas.microso

app开发需求文档怎么写

我们在开发app前都会做需求分析,这个app开发需求文档怎么写呢?一般可以从这几点入手:确定APP方案的目标,APP方案的受众分析,APP开发方案功能设计,APP的操作系统说明方案,APP是是否是原生APP,APP方案的视觉设计,APP开发方案中的其他细节.以下是一个app开发需求文档模板,里面写清了app开发需求说明,可以参考 1.引言 1.1目的: · 阐明开发本app的目的:  1.2 项目背景 · 标识待开发app产品的名称.代码:  · 列出本项目的任务提出者.项目负责人.系统分析员.

Office开发: 使用文档信息面板管理元数据

本文讨论: 文档信息面板 维护元数据 使用 InfoPath 窗体 本文使用了以 下技术: 2007Office 系统,.NET Framework 3.5 现在,每个组织都面临着严峻的信息管理 挑战.由于重要的信息以多种不同的格式存储在分散的位置,因此人们很难轻松地找出和使用这些数据. 除了能够简单地查找和使用数据外,公司还必须就数据保留和政府循规性制定相应的策略. 为满足这些新兴的需求并实现由信息驱动的应用程序,必须为文档赋予适当的元数据属性,并且元数 据应该在企业的所有系统中都可以使用.在

新版edge网页浏览器编辑office文档技巧

  新版edge网页浏览器编辑office文档技巧.Windows 10 Insider迎来了Build 14366版本更新,这次最大的变化要数edge网页浏览器的功能,edge浏览器新增在线office文档编辑功能,一起来参考win10edge浏览器怎么编辑office教程. 新版edge网页浏览器编辑office文档技巧 Windows 10 Insider升级到了Build 14366. 这个版本中,Microsoft Edge浏览器迎来一个重要更新,可以Office在线编辑功能,用户可通

api文档-有关NAVISWORKS二次开发API文档的问题

问题描述 有关NAVISWORKS二次开发API文档的问题 我按照您所说的路径在navisworks2014的安装目录下并没有找到相应的api.pdf文件,我想咨询一下是否版本的问题? 解决方案 2013版本以后NV就没有自带的api文档了,在autodesk官网上下个SDK文件,安装过后什么都有了.

api-如何将开发API文档整合到一起?如下图所示?

问题描述 如何将开发API文档整合到一起?如下图所示? 在开发中经常要查用户手册,如何将开发文档整合到一起?有什么工具吗,求指导. 解决方案 下载QuickCHM ,自己整合一下就好 解决方案二: 下载QuickCHM ,自己整合一下就好