Ever since the advent of minimalistic IDEs such as Atom, Sublime and Visual Studio Code, user snippets have gotten more and more popular due to their helpful productivity boost which makes some boilerplate code feel like simply filling in the blanks of an online form.
So then, what are your most useful snippets and why (for any language)? Let's help each other find some helpful snippets or ideas for new ones! Comment yours down below!
I'll start:
$0 is where the cursor will land once the snippet has been placed
-
thenandfail(orcatch) snippets for working with promises:
// prefix: '.th'
.then(function(res) {
$0
})
// prefix: '.fa'
.fail(function(err) {
$0
})
// prefix: '.ca'
.catch(function(err) {
$0
})
- Often used HTML inputs. Here is the one with the most boilerplate on it:
<!-- prefix: 'idate' -->
<div class="input-group">
<span class="input-group-addon">$1</span>
<input class="form-control" datetimepicker options="dateOptions" ng-model="$2">
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
Top comments (17)
I didn't know about this feature! 😲But now I'm trying to think how I would actually use it, haha.
Am I correct in assuming the $1 and $2 in the last example mean you can tab over to the next location? That would be super useful!
That is exactly it! And if you have $1 multiple times, you'd be editing them simultaneously! It's awesome
Now that right there is a game changer
You can even name each tag so you don't just work with numbers. It's a million times faster to be using them.
PhpStorm does this quite nicely too, but I just started to use it, so only one from my side (syntax out of config):
That looks good!
What I do is, whenever I code something that I know is very similar to a previous thing I make it a template. Surely, it takes more time to create one in the beginning but you regain that when when you use it a third and fourth time. The time efficiency can get ridiculous!
I'm in the "snippets are a symptom of poor organization" camp. If they're big, they should be dependencies; if they're small, it adds about as much cognitive load to remember that they exist and how to apply them as it does to type whatever it is out from scratch.
Do you work on backend or frontend?
Both, although my preference is very much for backend and infrastructure.
In my opinion snippets are very useful in frontend where you have a lot of HTML accompanied by some boilerplate JavaScript.
But for backend I find very rare occasions to use them. Only when I create new REST calls or implement some fairly boilerplate code that talks to the database we need such things... although that is a limitation of the technologies we use.
Maybe frontend will get there at one point in terms of redundant code but for now, snippets are a decent alternative.
Following are some Sublime snippets I use for my daily work
gist.github.com/bhaveshf-cuelogic/...
Hi there, from your html snippet I notice that you still use Angualar JS, try vue. I made the switch about a year ago and I am never going back.
The project currently has hundreds of controller/directives/service all made in AngularJS. It isn't very feasable as long as it is supported by the authors. Maybe in 10 years... who knows?
Thanks for the suggestion! I also think AngularJS is a bit rusty and the newer frameworks are better ;)
Sure, but do let us know if you decide to port it Vue, would love to know your experience in porting.
Our application was written in CoffeeScript (per my suggestion) and I was the one most involved in porting it to JavaScript. Maybe that would be an interesting story to tell. Who knows?
We are also porting old AngularJS code to the new standard (AngularJS 1.6/1.7) and that was also a point where you can notice how the framework evolved.
Interesting! I know the feature but never really used more complex snippets. But I use a text-expander to transform "colog" into "console.log('');" and the ALT-SPACE-space into a regular space.
That's a great use case. I might even borrow that idea!