前端开发代码架构相关想法

1:封装、封装、封装

封装事件绑定

封装组件调用

Utils方法的封装

校验的封装

网络请求的封装(必须封装,一个入口)

总之:能封装的尽量封装,因为前端js调用本身就很随意,通过封装去规范所有人的代码、尽量减少错误的出现几率;开发人员都去调用封装好的代码,不要去自己写;

2:单入口

单入口是说针对项目、功能、封装的模块等等始终保持一个入口点或者一个变量,保持代码及功能的逻辑线始终是一棵树,只有一个主干。

3:代码书写的逻辑关系

这个可以通过写demo来控制,所有人都按照的demo的书写规范去写,不能随意书写。

4:代码文件的统一规划

这个主要是对文件及文件夹的规划,做到方便查找,不能随意新建文件和随意存放。

例如,可以将所有校验放一个文件,所有工具方法放一个文件,所有请求接口放一个文件等等

时间: 2024-12-07 11:43:24

前端开发代码架构相关想法的相关文章

前端开发代码书写规范

规范目的: 为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档. 本规范文档一经确认, 前端开发人员必须按本文档规范进行前台页面开发. 本文档如有不对或者不合适的地方请及时提出, 经讨论决定后方可更改. 基本准则: 符合web标准, 语义化html, 结构表现行为分离, 兼容性优良. 页面性能方面, 代码要求简洁明了有序, 尽可能的减小服务器负载, 保证最快的解析速度. 文件规范 1. html, css, js, images文件均归档至<系统开发

web前端开发代码规范

1. 引言 对于一个多人团队来说,制定一个统一的规范是必要的,因为个性化的东西无法产生良好的聚合效果,规范化可以提高编码工作效率,使代码保持统一的风格,以便于代码整合和后期维护.本文档主要描述web项目开发中所使用的html.css.JavaScript等规范,请参与开发相关人员遵循,同时也请各位日后进行补充完善. 2. HTML/CSS规范 2.1 浏览器兼容 根据业务要求而定: 主流程测试:Chrome 30+.IE9+: 完整测试: Chrome 21.IE8+.360浏览器.微信webv

移动webAPP前端开发代码演示和技巧汇总

1. viewport:webapp视图 也就是可视区域.对于桌面浏览器,我们都很清楚viewport是什么,就是除去了所有工具栏.状态栏.滚动条等等之后用于看网页的区域,这是真正有效的区域.由于移动设备屏幕宽度不同于传统web,因此我们需要改变viewport; 实际上我们可以操作的属性有4 个: width -             //  viewport 的宽度 (范围从200 到10,000,默认为980 像素) height -            //  viewport 的高

如何成为一个优秀的web前端开发工程师

一.技术的必须的 作为一名最基础的前端工程师你必须掌握HTML.CSS和 JavaScript.三者必须同时精通,类似我字样对前端知识一知半解的,一遇到问题就停下工作就四处搜索解决方案的,首先就算不上一个合格的前端人 员.像我这样的如果当了前端工程师那工期肯定是不能保证的.合格的前端工程师第一要学会的就是在没有任何外来帮助的情况下(包括搜索引擎),能够完成大多 数任务. 以下知识点是作为一个前端工程师必须了解和熟悉的: DOM结构——两个节点之间可能存在哪些关系以及如何在节点之间任意移动. DO

葡萄城首席架构师:前端开发与Web表格控件技术解读

讲师:Issam Elbaytam,葡萄城集团全球首席架构师(Chief Software Architect of GrapeCity Global).曾任 Data Dynamics.Inc 创始人兼资深产品经理,个人研究方向主要为 MS.NET语言及平台.动态化系统构建,以及高性能大型分布式Web系统架构,主导了葡萄城多款畅销控件产品的系统架构与性能优化.   “25年来每天只休息4小时,除了日常作息时间,Issam不是在研究技术和产品,就是在去研究技术发展趋势的路上”这就是葡萄城同事对他

Flux是一个Facebook团队的前端开发架构

Flux introduction 本文组成: React 官方文档翻译 相关实践心得. 内容上是Flux的介绍,例子将会在以后写出.一旦稍微多了解一点React,很难避免听到Flux这个名词.Flux是一个Facebook团队的前端开发架构.借助单向数据流等其它机制,使得React可以发挥了更加强大的功能.比起其它的框架,Flux更像是一种模式,我们可以投入较少的学习成本,快速上手Flux. Flux应用有三个主要的组成部分:调度者(dispatcher), 仓库(stores),视图(vie

大前端应用开发与架构设计-使用HTML构建Web站点

大前端应用开发与架构设计-使用HTML构建Web站点 大前端应用开发与架构设计 2.1 Web基础介绍 2.1.1 了解互联网应用程序的架构 什么叫做互联网? 互联网:通过网络(有线.无线,4G)将世界各地的计算机(手机.平板.PC.服务器)连接起来的结构. 随着互联网及其相关技术的不断发展,目前基于互联网的程序有B/S(Broswer/Server)架构和C/S(Client/Server)架构两种组成. B/S也就是浏览器/服务器,用户只需要在浏览器中进行相关操作(通常是输入访问地址,或者提

前端开发相关汇总

简介 前端发展迅速,开发者富有的创造力不断的给前端生态注入新生命,各种库/框架/工程化构建工具层出不穷,眼花缭乱,不盲目追求前沿技术,学习框架和库在满足自己开发需求的基础上,然后最好可以对源码进行调研,了解和深入实现原理,从中可以获得更多的收获 随着前端发展,前端的职责也跟着变化,不再仅仅是设计稿切图+JS实现交互,已经可以涉猎到后端,微信小程序,原生APP等领域,大前端,全栈开发,小程序开发,前端架构师,带来了更多岗位选择的同时,也是对自身技术一种挑战 [前端汇总]这里会对前端相关技术教程,开

编写高质量代码:Web前端开发修炼之道(一)

最近老大给我们买来一些技术方面的书籍,其实很少搬着一本书好好的完整的看完过,每每看电子档的,也是打游击式的看看这章,瞅瞅那章,在那5本书中挑了一本比较单薄的<编写高质量代码web前端开发修炼之道>,看完觉得不错,它从一个整体架构上来说明如何编写高质量代码,而细处也着重说明一些比较重要的技术点,给人一种从高处俯瞰web开发.很完整的感觉,在这感谢老大,谢谢他让我们不停的进步着.下面是我看书过程中的笔记. 第一章:从网站重构说起 没什么好说的,从一个糟糕的老网页实例说明需要将web的结构,样式和行