Using text expanders to code faster

Using text expanders to code faster

Subscribe to my newsletter and never miss my upcoming articles

Listen to this article

As developers, we're looking for ways in improving our project development. If we can write our code faster, then we can spend more time working on more complex tasks.

For most editors (such as VSCode), you can use the Emmet extension when writing out code using abbreviations. But what if you have larger pieces of code that you find yourself writing over and over again? A good example - you've developed a skeleton template for your landing page that includes your navigation bar, call to action button, and a list of links.

Instead of writing it from scratch for every project, it'll be helpful to use text expanders. For this article, I'm using aText which is available for both Windows and macOS platforms.

Using text expanders is straightforward - you simply place the code in the content area and provide your custom abbreviation. As an example, I'm using my custom HTML boilerplate where I include the links for my CSS and JS files.


To see this in action, I opened up a sample index.html file where I type my custom abbreviation and it'll expand to the full piece of code:

screencast 2020-12-23 20-21-08.gif

Not too shabby, eh?

So if you're looking to improve on your coding speed and are tired of writing out your custom code for the billionth time, I highly recommend checking out text expanders. Your fingers will thank you.

If you happen to like this article, feel free to drop a comment in the section below. You can also follow me on Twitter for more coding adventures.

Share this