Cuplikan Sublime (dan Atom)

Cuplikan adalah potongan kode yang dapat digunakan kembali kode yang Anda dapat dengan mudah dan cepat masuk ke editor teks Anda.

Caranya adalah dengan mulai mengetik kode pendek, sebuah {i>pop-up<i} akan muncul dan Anda cukup menekan enter untuk cuplikan yang Anda inginkan dan Anda akan mendapatkan potongan kode.

Satu-satunya hal yang perlu diingat adalah bahwa cuplikan hanya dapat berfungsi ketika file yang Anda edit memiliki ekstensi khusus (yakni snipet JavaScript hanya akan berfungsi saat mengedit file yang diakhiri dengan .js).

Cuplikan JS dan NodeJS

Sublim | Atom

Paket JavaScript dan NodeJS Snippets oleh Zeno Rocha adalah paket yang bagus dari cuplikan sederhana yang memungkinkan Anda menulis JavaScript umum dengan cepat.

Berikut adalah beberapa contoh kode singkat dan kode yang dihasilkannya:

ae (Menambahkan Pemroses Peristiwa)

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

cel (Buat Elemen)

document.createElement(elem);

cdf (Membuat Fragmen Dokumen)

document.createDocumentFragment(elem);

pr (Prototipe)

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

iife (Ekspresi fungsi yang dipanggil langsung)

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

Berikut postingan Ben Alman di iife's, khusus untuk Matt.

Zeno memiliki daftar lengkap perintah yang dapat Anda gunakan di repo GitHub (dan halaman paket).

Toolkit ES2015

Sublime

ES2015 (alias ES6) luar biasa dan dengan hal-hal yang paling menakjubkan, ada cuplikan paket untuk digunakan.

Untuk menggunakan paket ini dan cuplikannya, pastikan untuk menginstal Babel melalui NPM.

npm install -g babel

Perhatikan juga huruf besar di awal beberapa kode singkatan.

Promise

Promise((resolve, reject) => {

});

class

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

  // methods
}

objek

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

Untuk daftar lengkap cuplikan yang didukung, lihat paket Sublime halaman kontrol.

Sayangnya, paket ini tidak tersedia untuk Atom. Setara terdekat sepertinya adalah paket ini berjudul 'es6-javascript'.

Paket Komponen Web dan Polymer

Sublim | Atom

Kurangi upaya Anda dalam menulis boilerplate untuk Polymer dengan Mr Dodsons cuplikan Polimer dan Komponen Web yang mengagumkan.

hi (Impor HTML)

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

pe (Elemen Polimer)

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

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

Cuplikan React

Sublime | Atom

Terakhir untuk penggemar React di luar sana, ada paket untuk Anda juga. Buat susunan komponen dan kode yang biasa ditulis dengan cuplikan ini.

rcc (Kerangka Komponen Class)

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

var  = React.createClass({

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

});

module.exports = ;

scu (shouldComponentUpdate)

shouldComponentUpdate: function(nextProps, nextState) {

},

ekstra

this.props.

dengan status tersembunyi akhir

this.state.

Paket MOAR

Ada banyak paket lain yang menawarkan cuplikan untuk berbagai framework, jadi jika Anda terus-menerus menulis potongan kode yang sama, kemungkinan seseorang telah menulis paket untuk membantu mengatasi masalah tersebut. Cukup lakukan penelusuran di pengelola paket untuk editor Anda (Sublime | Atom).