Use Sublime Text Snippets to Avoid Repetitive Typing

Yoni Weisbrod
InstructorYoni Weisbrod
Share this video with your friends

Social Share Links

Send Tweet
Published 7 years ago
Updated 5 years ago

Speed up your Sublime Text workflow by creating snippets out of boilerplate code. Sublime Text snippets are smart, configurable, and prevent repetitive typing.

When I type two brackets and press tab, this snippet that I've already defined creates a fat arrow function and allows me to quickly supply the function argument and then the body. I've also defined a snippet to generative React native components that I can quickly name and populate.

To create a new snippet, create an XML skeleton with the snippet tag. You can also use the built-in skeleton by going to tools, developer, new snippet. Then this shows you some of the properties that you can define. To find the directory to save it in, browser packages, click user, and use the Sublime snippet extension.

Our snippet is triggered by typing two brackets and then pressing tab, so that'll be our tab trigger. Next, we'll add our content denoted by the seed data syntax. Our snippet now works, but it doesn't allow us to pre-fill the argument or the body.

Let's add that functionality by putting in a placeholder, a dollar sign and a number. First, the user will fill out the function argument, and then we'll add another placeholder for the function body. Now, let's make it even easier for the user by adding a default argument X and a default body so that the function isn't empty.

When we test it out, we can see that we can automatically pre-fill the first argument and then cycle right to the body using the tab key.

The last thing for us to do is to prevent our snippet from running on non-JavaScript files by scoping it to source JS. You can find the scope in any file by running ctrl+shift+P on Mac or ctrl+shift+alt+P on Windows.

egghead
egghead
~ 7 minutes ago

Member comments are a way for members to communicate, interact, and ask questions about a lesson.

The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io

Be on-Topic

Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.

Avoid meta-discussion

  • This was great!
  • This was horrible!
  • I didn't like this because it didn't match my skill level.
  • +1 It will likely be deleted as spam.

Code Problems?

Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context

Details and Context

Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!

Markdown supported.
Become a member to join the discussionEnroll Today