如何实现项目上的快速开发-阿里云开发者社区

开发者社区> 阿里云GTS能力中心-浩鲸新智能> 正文
登录阅读全文

如何实现项目上的快速开发

简介: 如何实现项目上的快速开发(前端为主) 1.熟悉电脑的组合键操作和性能 2.熟悉编辑器的组合键操作 3.良好的项目结构和面向对象(数据抽象和数据封装)

如何实现项目上的快速开发

  本篇文章主要是展示一些提高开发效率的方法,以前端为主,对后端开发也有一定的参考价值。
  工欲善其事必先利其器,对于程序员的工作而言,电脑和编辑器就是工具,了解清楚其性能非常重要。下面就来介绍如何打造一件趁手的工具

熟悉电脑的组合键操作和性能

下面是几个常用且重要的快捷操作

1.alt+tab(mac系统下是❀+tab),连按tab用于快速切换当前窗口,在没有第二屏幕的时候非常实用。当然,如果有条件的话外接一个屏幕效果会更好
image.png
2.ctrl+c,ctrl+v(mac系统下是❀+c,❀+v),程序员必备SSS级技能,复制粘贴。可能是用的最多的快捷键。

3.ctrl+z,ctrl+y(mac系统下是❀+z,❀+y),系统的前进后退按钮,不仅写代码改代码的时候非常实用,而且误删文件的时候在文件资源管理器也可以使用。

4.window下的一键返回桌面按钮,在开了一堆窗口的时候一键最小化,还你清晰的思路。
image.png

5.rmdir /s/q [文件夹路径],在window下,删除大量的文件,系统还要做大量的校验工作,可能删一个node_modules文件夹需要几十分钟,非常缓慢。在CMD下直接运行次命令能快速删除文件,适合前端删除依赖,但要注意要用管理员身份运行,并且删除后无法回复。

image.png

熟悉编辑器的组合键操作

以vscode为例子
1.在设置里打开自动保存,省去ctrl+s的操作,防止电脑突然断电
image.png

2.shift+alt+f,快速格式化当前文件,对理清代码结构非常有帮助

image.png

3.ctrl+shift+d,行或者选中的内容直接向下复制,比ctrl+c,ctrl+v效率更高,继承自Sublime的快捷键,使用前需要去配置看看有没有冲突

image.png

4.使用Settings Sync插件,一键同步你的VSCODE配置到github帐户上,在切换个人电脑,公司电脑,阿里电脑的时候非常方便,同步一下就把编辑器配置配好了!

image.png

5.使用主题我推荐的是image.png怎么好像绝版了,One Dark Pro也是一个不错的选择,颜色非常的鲜艳,能清楚的区分JS的数据类型,同时也让使用者心情愉悦。
image.png

良好的项目结构和面向对象

良好的项目结构,合理的封装不仅仅是代码变得更加合理易懂,还能大大减小修改和维护的工作量

无论是函数的抽象还是类的封装,建议在有两个或以上的地方复用的时候进行,盲目的抽象和封装会造成阅读困难,缺少抽象和封装会造成代码冗余,两者都会造成代码维护困难

1.前端项目结构,以下是一个示例,展示在umi框架下复用的组件和工具函数是怎么跟页面抽离出来的。
image.png

2.减少或者不使用modal进行传参和状态管理,使用umi久了就会陷入一个误区,觉得使用modal传参很爽,很方便。但大量使用modal会造成代码盘根错节,耦合度降低。在做了一段时间原始的微应用框架的业务后,我觉得modal是完全没必要在单独页面使用的一个东西。在用户信息等全局的场景使用才是更合理的用法。
原生的fetch或者单独的servers文件能替代它的网络请求功能,state能替代其状态管理功能,props,createContext和url能代替他的传参功能,所以,为什么要用modal呢?

3.正确看待ESlint,在养成良好的写代码习惯之前,把ESlint校验打开是利大于弊的。但是同时也应该知道,它帮助你屏蔽掉了一些会造成变量提升之类的写法,如果失去了ESlint,应该特别注意JS代码结构不正确造成的报错。

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

分享:

阿里云GTS能力中心(浩鲸新智能),从交付的视角探讨数字化转型过程中大型软件开发实践、以及阿里云产品在各行业被集成的案例分享、技术沉淀等内容。敬请关注!

官方博客
官网链接