When you just start out your programming journey, there are so many shiny tools and technologies to explore, you almost don’t know where to start. Fortunately, there are numerous guides on how to get into different fields such as web development, computer systems, data science, and much more. This article is not one of these guides.

当您刚开始编程之旅时，有很多闪亮的工具和技术可供探索，您几乎不知道从哪里开始。 幸运的是，有许多关于如何进入不同领域的指南，例如Web开发，计算机系统，数据科学等等。 本文不是这些指南之一。

In my spare time, I tutor beginner programmers. When I’m working with them, I notice that even though their programming knowledge is solid, they still suffer from a low-efficiency workflow. I introduced the following tips to my students, and each one immediately benefited from knowing and using them. Often times there was even a reactive “Whoa!” upon learning these tips.

在业余时间，我指导初学者程序员。 当我与他们一起工作时，我注意到尽管他们的编程知识很扎实，但他们仍然遭受效率低下的工作流程的困扰。 我向学生介绍了以下技巧，每一个技巧都会立即从了解和使用它们中受益。 通常，甚至会有React性的“哇！” 在学习这些技巧后。

Regardless of your background, if you write code often, I urge you to please give these tips a try if you haven’t already. For the beginners I tutor, these were game-changers.

无论您的背景如何，如果您经常编写代码，我强烈建议您尝试一下这些技巧，如果您还没有的话。 对于我辅导的初学者来说，这些都是改变游戏规则的人。

重复行 (Duplicate Line)

We’ve all done this before: triple-click, copy, right arrow, enter, paste.

我们之前已经完成了所有操作：双击，复制，向右箭头，输入，粘贴。

Not only that, but we have probably done this a thousand times over. The seconds spent executing this string of operations adds up, not to mention the fact that you have to move your hand away from your keyboard and to your mouse.

不仅如此，而且我们可能已经完成了1000多次。 执行这一系列操作所花费的时间加在一起，更不用说必须将手从键盘移到鼠标上了。

You can shave off those precious seconds by using the Duplicate Line shortcut for your code editor. The added bonus: you don’t need to leave your keyboard.

您可以使用代码编辑器的“重复行”快捷方式来节省宝贵的时间。 额外的好处是：您无需离开键盘。

Here are the shortcuts for some commonly used code editors:

以下是一些常用代码编辑器的快捷方式：

• VSCode: Shift+Option+Down/Up (Mac), Shift+Alt+Down/Up (Windows/Linux)

  VSCode：Shift + Option +向下/向上(Mac)，Shift + Alt +向下/向上(Windows / Linux)

• Atom: Shift+Command+D (Mac), Shift+Ctrl+D (Windows/Linux)

  Atom：Shift + Command + D(Mac)，Shift + Ctrl + D(Windows / Linux)

• Sublime: Command+Shift+D (Mac), Ctrl+Shift+D (Windows/Linux)

  崇高：Command + Shift + D(Mac)，Ctrl + Shift + D(Windows / Linux)

• Vim: Y to yank line + p to paste after the current line.

  VIM： Y以复制行+ p到当前行后粘贴。

代码段 (Code Snippets)

Wouldn’t it be great if your computer just wrote your code for you? Well, using code snippets is the next best thing. Think of some common code patterns, expressions, or boilerplate that you write on a daily basis. A good snippet set will take care of all that extra typing, letting you skip straight to the meat of the task.

如果您的计算机只是为您编写了代码，那不是很好吗？ 好吧，使用代码片段是下一件好事。 考虑一下您每天编写的一些常见代码模式，表达式或样板。 好的摘要集将帮助您处理所有额外的键入操作，让您直接跳过任务的重点。

You can find snippets for pretty much any commonly used language or framework. Conduct a search in your editor’s package marketplace and you will probably find something. For instance, to find React JS snippets for VSCode, I would go to the Visual Studio Marketplace and search “React snippets.” The first result is below.

您可以找到几乎所有常用语言或框架的摘录。 在编辑器的打包市场中进行搜索，您可能会发现一些东西。 例如，要找到VSCode的React JS代码段，我将转到Visual Studio市场并搜索“ React代码段”。 第一个结果如下。

For React/Redux/GraphQL/React Native: https://marketplace.visualstudio.com/items?itemName=dsznajder.es7-react-js-snippets

对于React / Redux / GraphQL / React Native： https ://marketplace.visualstudio.com/items?itemName = dsznajder.es7-react-js-snippets

My most used snippet is rafce, which (I think) stands for “React Arrow Function Component, Exported.” If I create a file called MyComponent.jsx and run rafce, it generates the following boilerplate for me:

我最常用的代码段是rafce ，(我认为)代表“已导出的React箭头功能组件”。 如果创建一个名为MyComponent.jsx的文件并运行rafce ，它将为我生成以下样板：

import React from 'react'const MyComponent = () => {
       
       
    return (
        <div>
        </div>
    )
}export default MyComponent

This will save you a lot of time, especially when you don’t know the boilerplate by heart.

这将为您节省大量时间，尤其是当您完全不了解样板时。

The next level for web developers would be to learn how to use Emmet. There are many easy-to-follow guides regarding this toolkit.

Web开发人员的下一个层次将是学习如何使用Emmet 。 关于此工具包，有许多易于遵循的指南。

支架对着色器 (Bracket Pair Colorizer)

Perhaps the toughest thing to do as a beginner is learning to debug. I know that when I started learning to program, there were few things in life that gave me larger headaches than debugging my C programs.

作为初学者，最难的事情就是学习调试。 我知道，当我开始学习编程时，生活中很少有比调试C程序更让我头疼的事情。

Bracket Colorizer won’t debug for you, but it will save you some headaches. This is simply a tool that, as the name suggests, color coordinates matching pairs of brackets for you.

Bracket Colorizer不会为您调试，但可以为您省去一些麻烦。 顾名思义，这只是一个工具，它可以为您匹配颜色匹配的方括号对。

Now, if you forget to close that if statement or accidentally add too many brackets for your expression, you will see it clear as day. Unfortunately for web developers, this doesn’t yet work for chevrons (these: < >), but our fingers are crossed!

现在，如果您忘记关闭if语句，或者不小心在表达式中添加了太多括号，您会清楚地看到它。 不幸的是，对于Web开发人员来说，这还不适用于人字形(这些字符： < > )，但是我们的手指交叉了！

Here are some options for popular code editors:

以下是流行的代码编辑器的一些选项：

• VSCode: https://marketplace.visualstudio.com/items?itemName=CoenraadS.bracket-pair-colorizer-2

  VSCode： https ：//marketplace.visualstudio.com/items ？ itemName = CoenraadS.bracket-pair-colorizer-2

• Atom: https://atom.io/packages/bracket-colorizer

  原子： https ： //atom.io/packages/bracket-colorizer

• Sublime Text: https://packagecontrol.io/packages/RainbowBrackets

  崇高的文字： https : //packagecontrol.io/packages/RainbowBrackets

Bonus: Bracket Highlighters serve a similar purpose, but instead highlight the matching bracket pair your cursor is on. Here are some more links:

奖励：括号荧光笔的用途与此类似，但可以突出显示光标所在的匹配括号对。 这里有一些更多的链接：

• VSCode supports this by default.

  VSCode默认支持此功能。

• Atom: https://atom.io/packages/bracket-matcher

  原子： https ： //atom.io/packages/bracket-matcher

• Sublime Text: https://packagecontrol.io/packages/BracketHighlighter

  崇高的文字： https : //packagecontrol.io/packages/BracketHighlighter

更好的评论 (Better Comments)

Beginners will quickly find out that comments are invaluable. I can think of some project deadlines I would not have met had it not been for my comments. Comments can be used to structure your thoughts before you code. However, comments can be a double-edged sword, as we will discuss later.

初学者会很快发现评论是无价的。 我可以想到一些项目截止日期，如果没有我的评论，我将无法达到。 注释可用于在编码之前整理您的想法。 但是，评论可能是一把双刃剑，我们将在后面讨论。

Commenting diligently makes you a time traveler within your code. When you leave that expressive comment, you can forget the project for some time and when you come back and read the comment, it’s almost like you never left. The more accurately you can capture your train of thought, the smoother your experience of resuming work will be.

勤奋地注释使您成为代码中的旅行者。 当您留下表达力的评论时，您可能会忘记项目一段时间，而当您回来阅读评论时，几乎就像您从未离开过。 您越能准确地把握思路，恢复工作的经验就越流畅。

Here are some extensions to give more life to your comments:

以下是一些扩展，可以使您的评论更加生动：

• VSCode: https://marketplace.visualstudio.com/items?itemName=aaron-bond.better-comments

  VSCode： https ：//marketplace.visualstudio.com/items ？ itemName = aaron-bond.better-comments

• Atom: https://atom.io/packages/todo-show

  原子： https ： //atom.io/packages/todo-show

• Sublime: https://packagecontrol.io/packages/Colored%20Comments

  崇高： https : //packagecontrol.io/packages/Colored%20Comments

Unfortunately, misused comments can be disastrous. Imagine you write a comment describing a certain function, but then you must modify the function’s requirements. It is dangerously easy to forget to change your comment along with the function itself. What you are left with is a confusing comment trying to describe a completely different function. As such, many people will argue that writing clear, self-explanatory code is better than leaving comments.

不幸的是，滥用评论可能会造成灾难性的后果。 想象一下，您写了描述某个功能的注释，但是随后您必须修改该功能的要求。 忘记更改函数本身的注释是很危险的。 剩下的就是一个令人困惑的注释，试图描述一个完全不同的功能。 因此，许多人会认为编写清晰的，不言自明的代码比留下评论要好。

For those who choose to comment, the packages above will provide a more expressive commenting experience.

对于那些选择发表评论的人，以上软件包将提供更富有表现力的评论经验。

The duplicate line function, code snippets, Bracket Colorizer, and Better Comments are all tools that I personally use and benefit from. Its little things like these that help make coding an enjoyable, or at least tolerable, endeavor. Hopefully, you picked up a new trick to make your life easier! Happy hacking!

重复行功能，代码段，括号着色器和更好的注释都是我个人使用并受益的工具。 像这样的小事情有助于使编码成为一件令人愉快的事情，或者至少是可以忍受的事情。 希望您选择了一个新技巧，使您的生活更轻松！ 骇客骇客！