了解我的12条技巧,如何提高前端编码效率

有很多关于如何成为一名更好的开发人员的文章。 我将尽量不触及这个主题,而是专注于开发周围的生产力领域。

我认为优秀的开发人员不仅是优秀的编码人员,架构师,程序员,更是其他任何人。 好的开发人员是一个多才多艺的人,具有软技能,管理技能,知道如何与企业交谈,而不是与技术人员交谈等。

好的开发人员需要了解业务领域,而业务在乎的也是金钱和时间

在本文中,我将尝试就与开发相关的挑战而不是与开发本身相关的问题开始一系列思考。

在这个故事中,我将介绍12个技巧,这些技巧可以帮助您在(主要是前端)开发工作中更快,更高效地工作。 我选择这个主题(并且以后会经常谈论这个主题),因为我在这个领域有点怪胎,有时候我看到人们在做什么时,我的心会痛😉

1:了解您的工具

无论您使用什么工具,都请学习。 如果您每天在Webstorm中花费8个小时,那么即使每天节省10%的工作量也会对您的效率产生巨大影响。 也许打印键盘图并将其放在小便池上方的墙上? 🙂你明白了。

  • 了解关键的快捷方式
  • 在IDE中自动执行流程(例如GIT或某些脚本)
  • 检查应用程序的首选项。 您可能会发现很多您不了解的功能。
  • 检查变更日志 。 如果应用程序更新-阅读发行说明。 也许他们只是发布了您多年来错过的东西。

您所使用的软件知识将直接提高您的速度。 请记住,操作系统也是软件。

2:使用正确的工具进行工作

有时,您只是习惯了一些已经使用多年的应用程序。 您确定此后没有更好的发布吗? 我并没有告诉您要进行任何宣传,但有时15分钟检查新工具会使您的世界旋转180度。

例? 许多Web设计师都在使用Photoshop,它是作为照片编辑工具而不是Web设计软件而制成的。 Sketch的发布改变了一切,使设计师可以超级快速,高效,更接近前端开发人员地工作。 Adobe发布的XD可能不如Sketch现在成熟,但是如果您想呆在Adobe生态系统(或没有Mac)中,也可以尝试一下。 它将改善您的世界。

另外,最好还是遵循Product Hunt并检查实用的应用程序。 我使用例如:

  • CloudApp的屏幕截图,注释,gif录制等
  • Alfred fo智能命令自动化
  • 窗户管理眼镜
  • 用于将iPad连接为外部显示器的二重奏

检查可用的工具和应用程序,因为您甚至可能不知道所缺少的内容。

3:尝试适应生态系统

我之前提到的Adobe已经创建了一个生态系统,其中包含20多种用于不同目的的应用程序。 如果您需要学习一个新的应用程序,那么很有可能由同一家公司来完成,这会容易得多。 Photoshop的界面与Illustrator几乎相同。

Webstorm,IntelliJ,PHPStorm和其他Jetbrains软件几乎相同(实际上基于某些层)。

使用相同的生态系统还将以较低的价格,共享的云存储,单个帐户或跨应用程序集成使您受益。 可能值得检查一下-但是,另一方面,不要使用您讨厌的应用程序(并且您有更好的替代品)只是为了保持相同的生态系统!

同样,Apple生态系统可以通过跨设备集成使您感到惊讶,但是您可能可以配置其他设备以使其正常工作。

保持一个生态系统可以通过保持相同的习惯来提高生产力

4:自动执行重复的代码任务

如果您在项目中定义了一些代码规则(例如缩进大小),是否会手动更改编写的每一行代码以添加缺少的空格?

如果您知道一半的开发时间可以自动进行,那么您是否可以在晚上入睡,因此您可以再执行两次功能,而不必执行重复的任务?

  • 设置您的ESLint / TSLint来检查您的代码质量(这也会影响时间)
  • 使用eslint — -fix自动为您解决许多问题!
  • 设置并使用Prettier.js并将其连接到两个IDE快捷方式(在Webstorm中,默认为CMD + OPTION + SHIFT + P )并进行预提交
  • 使用类似React组件生成器或Angular CLI的生成器来自动生成标准样板
  • 照顾好您的CI管道
  • 使用git hooks自动运行修复程序,测试等。

自动化将为您节省大量重复猴子工作的时间

5:将插件安装到您的应用

您正在使用的大多数应用程序可能都可以通过插件进行扩展。 有时它支持某些库/框架,有时还支持一些很酷的集成或主题。 如果您使用的是git和Jira,为什么不尝试连接您的IDE以查看故障单描述或自动生成git commit?

社区插件将添加缺少的功能。 社区最了解!

6:添加集成

集成对于自动化至关重要。 您可以使用Zapier或IFTTT来连接所使用服务的API,但是首先请看一下插件存储库。 例如,您可以将Jira连接到Github ,以便将票证连接到Pull Request或您的CI管道以运行测试,在PR检查中打印结果或自动构建功能分支。

另一个很好的例子是Slack集成-您可以将成千上万的应用程序和机器人与团队中最喜欢的沟通者联系起来。

集成将连接您使用的工具,使您的工作更有效

7:正确设置JIRA

我不想在这里与吉拉(Jira)或Scrum福音传教士展开战争。 我相信,此工具(也包括Scrum)旨在帮助人们, 而不是使您的生活更加艰难 。 但是,我经常发现Jira并没有真正的帮助……UX和UI并不是真正的用户友好型,而且很多事情并不一致。

您可以做的是至少尝试根据需要对其进行配置。 添加标签,类型,颜色-可以帮助您工作的任何东西。

然后,考虑如何组织任务。 国际海事组织的人员将任务做得太大,估计需要几天的时间,这会使它们变得过分繁杂且难以进行。 进行小任务并将它们链接在一起对我来说效果很好。 而且更容易估算。 分而治之。

适当的项目管理系统配置和工作流程将帮助您更快地了解需求。

8:与设计师(和其他部门)交谈

沟通是关键。 您可能在抱怨设计师及其设计,但是您是否试图找到解决方案?

您想将标准边距/填充混合作为10px的乘数吗? 设计师有时会为您提供8px,12px,10px? 也许如果您问他们, 他们会告诉您始终使用10px 是完美的

也许您在服务器的响应格式方面遇到问题,并浪费了很多时间来处理这种情况。 您为什么不尝试与他们交谈,也许对他们来说很容易改变

尝试找出最适合您的事物,不要害怕告诉别人。 他们将分享自己的观点,并且您将一起找到最佳的妥协方案。

讨论将帮助您解决无法独自解决的问题

9:标准化

采取这种情况。 几个开发人员正在同一个项目上,致力于同一个存储库。 他们每个人都有不同的习惯和代码风格。 他们甚至可以具有不同的编辑器默认配置(缩进,分号等)。

然后,您只需要进行几行新的实际更改来检查代码,但是有100行差异。 那个怎么样? 好吧,您没有共享正式的配置,例如editorconfig,.eslintrc,.tslintrc等。您的linter应该会失败,并迫使开发人员保持相同的样式。

标准化将使您更容易理解代码并加快开发速度

10:安装打字稿类型

如果您使用的是Typescript,这对您来说很明显。 但是您知道吗,您的IDE(至少是Jetbrains)可以解析已安装的类型定义(使用@types前缀安装它们,例如npm i -D @types/react )。

它们将在您的节点模块中可用,并且当您查找正在使用的类的定义时(通过fe CMD +单击某些函数/对象/类),您将被重定向到相应的type.d.ts文件。

你为什么需要那? 类型定义将为您的界面提供jsdoc注释中已记录的可能的属性,方法和事件文档。 现在,您无需在浏览器中保留开放的文档站点!

键入将减少在搜索文档上花费的时间

11:安装浏览器扩展

这个实际上与第5个数字相同-但您可能一直都在使用浏览器,因此值得拥有它。

有很多Chrome插件(对于其他浏览器来说也可能很多)可以提高您的性能。 我每天都会使用以下几种:

  • 雨滴用于快速拨号和书签
  • 口袋用来保存东西以备后用
  • Augury,React devtools,Redux devtools等用于框架调试
  • 拾色器,标尺
  • Insight.io,可在Github中获得类似IDE的体验
  • github的文件图标

还有很多。 我有一天会写一篇关于chrome扩展的文章。

Chrome不仅是浏览器,还是其他应用程序的生态系统。

良好的扩展选择可以改善您的前端工作和Internet浏览体验。

12:使用相同的硬件设置

几年来,我一直在使用完全相同的设置。 Macbook pro(我有很多,但基本相同),Magic Mouse和Magic Keyboard。
两个显示器,向左旋转,所以我不必转过头。 我仅将其用于4个应用程序-Slack,第一个桌面上的Mail,Spotify和第二个桌面上的Todoist。
中心4k显示屏供浏览器使用(两个已打开,因此我可以轻松切换台式机)。
右侧– Rainbook上的Macbook,Facebook Messenger,Webstorm和终端位于单独的桌面上。

我为什么在乎? 因为我已经习惯了,发现它是我的理想设置。 我在办公室和家里重新创建它。 我喜欢Apple的标准化功能(外部键盘与内置键盘几乎相同),我主要使用它。

如果您现在给我Windows计算机,我将花费数月的时间进行切换(但是无论如何我都不会切换),即使使用GUI时,Linux也很难。 如果您给我另一个IDE,我将花费数周的时间,直到我根据需要对其进行配置。 如果您什至给我另一把键盘,我在家里和办公室之间切换时都会遇到问题。

关键是要找到自己喜欢的设置,并不断对其进行改进并坚持下去。 当然,您将在所有系统上获得相同的代码质量,但是如果可以将其速度提高两倍,该怎么办?

保持相同的工作环境将使您能够控制习惯,最终可以更快地工作。