Snippets for efficient (lazy) programmer 🙂

Snippets itu apa ?

semacam shortcut untuk mempermudah programming, (maaf bukan maksud menggurui) ✌🤣

ituloh yg rekomendasi waktu kita ketik sesuatu, trus tinggal pilih rekomendasi, enter, voila! editor menyelamatkan waktu kita beberapa detik.. bahkan menit.

Emmet

nah, emmet ini paling seru untuk web dev, shortcut emmet sangat powerful, keterlaluan kalau web dev ga tau emmet.

table.table>(thead>(tr>th*3))+(tbody>(tr>td*3)*2)

menghasilkan :

<table class="table">
  <thead>
    <tr>
      <th></th>
      <th></th>
      <th></th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td></td>
      <td></td>
      <td></td>
    </tr>
    <tr>
      <td></td>
      <td></td>
      <td></td>
    </tr>
  </tbody>
</table>

Plugin untuk editor

• codeigniter sublime text github
• Boostrap 4, FA4/5 VSCode Marketplace
• atau cari di sini, sesuai kebutuhan VSCode Marketplace

Custom Snippets

dalam editor yang dipakai, pasti ada pengaturan snippets custom,

klik tombol ⚙ (kiri bawah), ada menu User Snippets, pilih bahasa atau global, silahkan masukkan snippets buatan kamu contoh :

"php": {
    "prefix": "php",
		"body": [
			"<?php",
			"${1:}",
			"?>"
		],
		"description": "php"
	}

menghasilkan :

<?php
(posisi cursor)
?>

honorable mention (thanks to Zefta!)

untuk print variabel php di html, sangat membantu! 💯

"print var": {
		"prefix": "pr",
		"body": [
			"<?php print('<pre>'.print_r($$1,true).'</pre>'); ?>"
		],
		"description": "print pre tag"
	}

menghasilkan

<?php print('<pre>'.print_r($(posisi cursor),true).'</pre>'); ?>

Extension

• Snippets View (1k install) Marketplace
  • nanti muncul menu tambahan di Activity Bar, menampilkan seluruh user snippets jadi, bisa lintas bahasa dan tidak perlu menghapal shortcut!
  • ada command (ctrl+shift+P) : create snippet from selection ! ✅
    • baru nemu waktu buat tulisan ini, mantaapp 🤤