README.md

JS ES6 code completion live templates for Webstorm

First - A word about contribution & Extending.

• Purpose of this Repo. is to be created as a Webstorm live templates plugin.
• If you add more snippets/better parctice existing snippets, please create a pull request for this repo., Thanks for users will be added ofc.
• If you customize this XML for your own needs, keep it and have fun =].

Thanks

Getting started

• Download the live templates.xml file.
• Place it in the template folder:
  • Cross platform guide.
  • OSX: path is ~/Library/Preferences/WebStorm{Version}/templates.
• Restart Webstorm.

Snippets

Misc

t ⇥ this.

this.$END$

clog ⇥ colored console log

console.log('%c This is ----> $VAR1$','background: $VAR2$', $VAR1$)

log ⇥ console log

console.log('$VAR1$', $VAR2$);

Declarations

v ⇥ var statement

var $VAR1$;
$END$

va ⇥ var assignment

var $VAR1$ = $VAR2$;
$END$

l ⇥ let statement

let $VAR1$;
$END$

le ⇥ let assignment

let $VAR1$ = $VAR2$;
$END$

co ⇥ const assignment

const $VAR1$ = $VAR2$;
$END$

Flow Control

if ⇥ if statement

if ($CONDITION$){
    $BODY$
} $END$

el ⇥ else statement

else {
    $BODY$
}
$END$

ei ⇥ else if statement

else if ($CONDITION$){
    $ACTION$
} $END$

for ⇥ for loop

for (let $INDEX$ = 0; $INDEX$ < $VAR1$; $INDEX$++) {
    $BODY$
}
$END$

fi ⇥ for in loop

for (let $VAR1$ in $VAR2$) {
    $BODY$
}
$END$

Functions

fn ⇥ named function

function $NAME$ ($ARGUMENTS$) {
    $BODY$
}
$END$

afn ⇥ anonymous function

function ($ARGUMENTS$) {
    $BODY$
}
$END$

iife ⇥ immediately-invoked function expression (IIFE)

(($ARGUMENTS$) => {
    $BODY$
})($ARGUMENT2$);
$END$

af ⇥ arrow function

($ARGS$) => $RETURNS$

afb ⇥ arrow function with body

($ARGS$) => {
    $BODY$
}
$END$

Return values

r ⇥ return

return $PROPERTY$;

rf ⇥ return false

return false;

rt ⇥ return true

return true;

rn ⇥ return null

return null;

Iterables

map ⇥ map function (chainable)

.map(($ITEM$, $INDEX$)=>{
    $BODY$
})$END$

filter ⇥ filter function (chainable)

.filter(($ITEM$)=>{
    $BODY$
})$END$

Classes & Objects

cx ⇥ export class

export class $NAME$ {
    $BODY$
}

cf ⇥ class function

$NAME$() {
    $BODY$
}

get ⇥ getter

get $NAME$() {
    $BODY$
}

set ⇥ setter

set $PROPERTY$($VALUE$) {
    $BODY$
}