Extraits Sublime (et Atom)

Les extraits sont des fragments réutilisables code qui que vous pouvez déposer facilement et rapidement dans votre éditeur de texte.

Pour cela, vous commencez à saisir un code, une fenêtre pop-up s'affiche et il vous suffit d'appuyer sur Entrée pour obtenir l'extrait de code bloc de code.

Le seul inconvénient à garder à l'esprit est que les extraits ne fonctionnent que lorsque le fichier que vous l'éditeur possède une extension spécifique (les extraits de code JavaScript ne fonctionneraient lorsque vous modifiez un fichier se terminant par .js).

Extraits JS et NodeJS

Sublime | Atom

Les extraits de code JavaScript et NodeJS package par Zeno Rocha est un excellent ensemble d'extraits simples qui vous permettent d'écrire rapidement du code JavaScript courant.

Vous trouverez ci-dessous quelques exemples de codes courts et le code qu'ils génèrent:

ae (ajouter un écouteur d'événements)

document.addEventListener('event', function(e) {  
 // body...  
});

cel (Créer un élément)

document.createElement(elem);

cdf (Créer un fragment de document)

document.createDocumentFragment(elem);

pr (prototype)

ClassName.prototype.methodName = function(arguments) {  
 // body...  
}

iife (expression de fonction invoquée immédiatement)

(function(window, document, undefined) {  
 // body...  
})(window, document);

Voici le post de Ben Alman sur iifes, rien que pour Matt.

Zeno propose une liste complète des commandes que vous pouvez utiliser sur le GitHub repo (et les packages pages).

Kit ES2015

Sublime

ES2015 (aussi appelé ES6) est une version géniale, pour l'accompagner.

Pour utiliser ce package et ses extraits, assurez-vous d'installer Babel via la gestion des partenaires du réseau.

npm install -g babel

Notez également la majuscule au début de certains codes abrégés.

Promesse

Promise((resolve, reject) => {

});

classe

class Classname extends AnotherClass {
  constructor(args) {
    // code
  }

  // methods
}

objet

var obj = {
  __proto__: theProtoObj,
  handler,
  toString() {
    return "object";
  }
}

Pour obtenir la liste complète des extraits pris en charge, consultez le package Sublime la page de contrôle.

Malheureusement, ce package n'est pas disponible pour Atom. Équivalent le plus proche semble être ce package intitulé 'es6-javascript'.

Polymer et le package de composants Web

Sublime | Atom

Écrivez plus facilement que du code récurrent pour Polymer avec Mr Dodsons : des extraits de code formidables Polymer et Web Component.

hi (importation HTML)

<link rel="import" href="bower_components//.html">

pe (élément polymère)

<dom-module id="">
  <style>
    :host {
      display: block;
    }
  </style>
  <template>

  </template>
  <script>
    Polymer({
      is: ''
    });
  </script>
</dom-module>

Extraits React

Sublime | Atom

Enfin, pour les fans de React, ils ont aussi un package pour vous. Échafaudage les composants et le code communément écrit avec ces extraits.

rcc (squelette du composant de classe)

var React = require('react');
var PropTypes = React.PropTypes;

var  = React.createClass({

  render: function() {
    return (
      <div />
    );
  }

});

module.exports = ;

scu (shouldComponentUpdate)

shouldComponentUpdate: function(nextProps, nextState) {

},

objets

this.props.

state

this.state.

Packs MOAR

De nombreux autres packages proposent des extraits pour différents et les frameworks Google Cloud. Si vous vous retrouvez à écrire les mêmes éléments de code il y a des chances que quelqu'un ait écrit un package faites une recherche dans le gestionnaire de packages de votre éditeur (Sublime | Atom).