web前端代码规范

web前端代码规范相关知识

• 高级攻城狮从代码规范开始——web前端代码规范

  命名规范 文件和文件夹命名 文件夹和文件名采用英文小写字母命名，多个英语单词用 “-” 分割，不使用驼峰命名，如：hello-world 编写组件使用 “c-” 打头，如：编写一个select组件，文件夹或者文件名定义[c-select] 样式表命名 样式表命名采用英文小写字母命名，多个英语单词用 “-” 分割，不使用驼峰命名，如：hello-world JS命名 js变量使用驼峰命名，不使用-号分割 // 不推荐 let foo_bar = 'hello eleme'; // 推荐 let fooBar = 'hello eleme'; 常量要大写
• Web前端开发规范

  规范概述目的为提高团队协作效率，便于后台人员添加功能及前端后期优化维护，输出高质量的文档，特制订此文档。本规范文档一经确认，前端开发人员必须按本文档规范进行前台页面开发。本文档如有不对或者不合适的地方请及时提出，经讨论决定后方可更改。准则符合web标准，语义化html，结构表现行为分离，兼容性优良。页面性能方面，代码要求简洁明了有序，尽可能的减小服务器负载，保证最快的解析速度。文件规范基本要求对页面中标签属性的值都需要用双引号包括起来所有页面编码均采用utf-8文件存放与命名规范html，css，js，images文件均归档至《系统开发规范》约定的目录中；html文件命名：英文命名，后缀.htm，同时将对应界面稿放于同目录中,并要求与html文件同名，以方便后端添加功能时查找对应页面；css文件命名：英文命名，后缀.css，共用base.css，首页index.css，其他页面依实际模块需求命名；js文件命名：英文命名，后缀.js，共用common.js，其他依实际模块需求命名。html书写规范文档类型声明
• WEB前端开发规范文档

  规范目的为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档.本规范文档一经确认, 前端开发人员必须按本文档规范进行前台页面开发.本文档如有不对或者不合适的地方请及时提出, 经讨论决定后方可更改.基本准则符合web标准, 语义化html, 结构表现行为分离, 兼容性优良. 页面性能方面, 代码要求简洁明了有序, 尽可能的减小服务器负载, 保证最快的解析速度.文件规范1. html, css, js, images文件均归档至约定的目录中;2. html文件命名: 英文命名, 后缀.html. 同时将对应界面稿放于同目录中, 若界面稿命名为中文, 请重命名与html文件同名, 以方便后端添加功能时查找对应页面;3. css文件命名: 英文命名, 后缀.css. 共用base.css, 首页index.css, 其他页面依实际模块需求命名.;4. Js文件命名: 英文命名, 后缀.js. 共用common.js, 其他依实际模块需求命名.html书写规范1. 文档类型
• 超详细的Web前端开发规范文档

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

web前端代码规范相关课程

• Spring Boot2.0深度实践 核心原理拆解+源码分析 课程系统性地深度探讨 Spring Boot 核心特性，引导小伙伴对 Java 规范的重视，启发对技术原理性的思考，掌握排查问题的技能，以及学习阅读源码的方法和技巧，全面提升研发能力，进军架构师队伍。

  讲师：小马哥 高级 2789人正在学习

• 5G时代必备音视频WebRTC实时互动直播技术入门与实战 5G时代下，音视频行业将会得到前所未有的蓬勃发展，音视频人才将成为新的宠儿。本课程将从入门到实战，系统讲解WebRTC实时互动直播技术【音视频领域核心技术】，让你低门槛进入音视频行业，快速成为企业急需的音视频工程师。让你对整个 WebRTC技术的使用有非常深入的掌握，并有能力实现一套1对1音视频实时互动直播系统，并可以与其它终端进行互联。而这些能力正是当下企业急需的能力。还在等什么，赶快学起来！

  讲师：李超 中级 2195人正在学习

• React 配置化+Serverless,落地低代码+云原生全栈开发 “低代码+云原生” ，已然成为大厂全栈解决方案新宠！本课程中，Dell老师将结合近期实践经验，以个人博客的开发为例，带领大家从解决问题角度出发，通过 “ 前端配置化+后端 Serverless” 全流程实践，助你先人一步把握技术新潮流，获取中大厂高薪人才必备的 “硬核” 技能！

  讲师：Dell 中级 261人正在学习

web前端代码规范相关教程

• 代码规范 每个团队、每个人都有自己的代码规范。规范的代码可以让整个项目的编码风格更统一。一个项目的代码规范涉及许多方面：是否该用分号结尾可否使用位运算符能不能写行 if 语句是否必须要用函数声明的形式创建函数…在没有工具检测的情况下，统一多人项目的编码风格是一件比较困难的事情，每次提交代码都需要详细的 review 每一行代码，因为这些规范点都非常细。好在目前的前端生态有许多工具帮我们解决这个问题。代码是否符合规范，就是要对代码进行检查。对 JavaScript 代码的检查，目前使用最多最广的是 ESLint。
• 4. Django 代码规范 最后的是 Django 代码规范，也是 Python 代码的规范。总结个人在看源码以及在写代码之间尽量避免的一些问题：不要重复代码！不要重复代码！不要重复代码！重要的事情说三遍。在 Python 开发中，我们尽量不要写重复代码，将同一个功能的代码尽可能封装成函数以供调用；python 代码中变量、函数、类的命名，尽量有含义，比如下面定义的 Connection 类：class Connection(BaseConnection): def __init__(self, host, port, user, passwd): ... # 远程执行shell命令 def run_command(cmd): ... # 上传文件到远端服务器 def upload_file(source_src, dest_src, mode): ... # 从远端服务器上下载文件 def download_file(remote_src, dest_src, mode): ... ...可以看到，这里 从 类名到参数，到函数名都能从名称上推测出其作用。不要盲目在一个函数中堆砌代码。一个函数内的代码尽量控制在如 50 行内，每行的代码的长度也不要过长，容易引起视觉反感；如果有能力，需要多学习一些设计模式相关知识，还有 Python 的各种高级用法。有时候不是为了酷炫，而是这样使用能做到非常好的简化代码和封装代码；此外，尽量使用一些做的比较好的第三方插件，比如 DRF 帮助我们快速实现 Web API 接口，同时还提供了认证相关功能，可以让我们简化开发难度，而且提供良好的代码风格。在一些情况下，尽量避免自己重复造轮子，而且造的是差轮子；编写函数测试用例。这个是很多开发工程师不愿意做的但是又十分重要的一点。对于一些重要函数，我们一定要记得给这个函数设计一个测试用例，避免后续有人接收是改动该函数能及时发现异常以上是我在工作中的一些体会，主要是在开发中碰到的一些常见的规范问题。有些公司的代码规范会详细到如何定义好的变量名、对注释的限制等等。养成良好的 Python 代码规范是项目中的一个重要环节。一个非常好的途径就是去学习 Python 项目的相关源码，这里推荐的有： Flask、Django、Ansible 等流行的开源项目，从中可以学到不少设计模式以及 Python 中的高级用法。
• 2. 用 ESLint 规范 Typescript 代码 安装 ESLint 规范 Typescript 代码所需依赖包：npm install -d eslint @typescript-eslint/parser @typescript-eslint/eslint-plugin@typescript-eslint/parser 库是 ESLint 的 TypeScript 解析器，用来检查和规范 TypeScript 代码。在项目根目录下创建 .eslintrc.js 文件进行配置：module.exports = { root: true, env:{ browser: true, node: true, } parser: '@typescript-eslint/parser', extends: [ 'plugin:@typescript-eslint/recommended' ], plugins: [ '@typescript-eslint' ], rules: { } }其中属性 rules 是对象类型，每个团队都有自己的一套标准规范，按照要求在此配置对应的 ESLint 检测规则即可。
• 1. Django 开发规范 对于 Django 的开发规范，我个人的总结如下：正式开始基于 Django 的 Web 服务项目之前，需要完成相应的需求和接口设计， 而不要冒冒然直接开写；工程需要有完整的文档介绍 、服务部署脚本（start、stop） 等等，让这个项目至少看起来高大上和完整；完善的版本迭代机制，每个版本的需求说明、bug 更新文档以及相应的版本号。这些初始的规范在其他 Web 项目开发中也是合适的，最重要也是最难的一件事情就是坚持做好上面这些，同时坚持良好的代码规范。
• 4.前后端分离模式开发规范 前后端分离模式逐渐成为主流，随之而来的问题也很突出。通常，后端服务开发完成，开发人员会写一份后端接口调用的说明文档。不同公司、不同项目甚至不同开发人员都有各自的喜好，因而开发好的后端服务，也是千奇百怪，前端开发人员为了使用使用后端服务，必须逐个对照说明文档才能知道调用方式。小型项目还好说，大型项目接口繁杂，如果仍然采用千奇百怪的接口调用方式，就会无形中增加开发难度。那么是否有一套接口开发规范，是否有一个见名知意的接口调用方式呢？答案是有的，这就是 RESTful 规范。后续内容，我们将正式开始学习 RESTful。
• 2. CommonJS 规范 在维基百科中是这样定义 CommonJS 的：CommonJS 是一个项目，其目标是为 JavaScript 在网页浏览器之外创建模块约定。创建这个项目的主要原因是当时缺乏普遍可接受形式的 JavaScript 脚本模块单元，模块在与运行 JavaScript 脚本的常规网页浏览器所提供的不同的环境下可以重复使用JavaScript 语言在很长一段时间是没有模块化的概念的，直到 Node.js 的诞生后，让 JavaScript 有能力编写服务端语言，对操作系统、网络、文件系统等等的复杂业务场景，使用模块化就是不可或缺。这样也把模块化的概念带到了前端，而这时的客户端的功能也很复杂，急需一种可以拆分代码模块方便管理代码的一种模式。最终在社区的推动下 ES6 给出了 JavaScript 模块化的规范。在 Node 模块中，CommonJS 规定每个文件就是一个模块，有它自己的作用域。在一个文件里面定义的变量、函数、类，都是私有的，对其他文件不可见。CommonJS 规定每个模块内部，module 变量代表当前模块。这个变量是一个对象，它的 exports 属性（即 module.exports）是对外的接口。加载某个模块，其实是加载该模块的 module.exports 属性。

web前端代码规范相关搜索

w3cshool w3c标准 w3c菜鸟 w3c验证 walk wall warn web web py web service web services webbrowser webgl webmaster webservices webservice教程 webservice接口 webservice调用 websocket webview

查看更多慕课网实用课程