Perkembangan dunia pemrograman semakin hari semakin menjadi-jadi. Banyak Bahasa pemrograman maupun framework baru bermunculan akhir-akhir ini. Terutama framework JavaScript yang yang banyak bermunculan. Dan semuanya sangat menarik untuk dicoba.
Framework
JavaScript yang terkenal saat ini contohnya Angular JS, Vue JS, React JS dan
lain sebagainya dan mungkin banyak orang sudah tahu tentang framework- framework
ini.
Namun,
akhir-akhir ini, ada framework yang baru terkenal yaitu Svelte JS (Website : https://svelte.dev/). Framework ini Admin tahu
dari seorang JavaScript Developer terkenal di Indonesia yaitu Mas Riza Fahmi (Curriculum Director di Hacktiv8 Indonesia).
Svelte Js merupakan sebuah framework JavaScript untuk menulis komponen antarmuka (user interface) yang dibuat oleh Rich Harris. Namun menurut penulisnya, Svelte Js ini bukan sekedar framework JavaScript seperti framework lainnya.
Tapi lebih dari
itu Svelte JS ini seperti compiler, maksudnya kode
yang kita tulis di Svelte dikonversi menjadi JavaScript yang sudah dioptimasi.
Salah satu fitur kuncinya Svelte Js ini adalah ukuran filenya
kecil karena sudah dikompilasi dan dioptimasi oleh Engine Framework itu
sendiri. Dan hebatnya lagi, prosesnya ini tidak menggunakan Virtual Dom.
Berikut Ini Kelebihan Framework Svelte JS :
- Menulis
Lebih Sedikit Code
- Tidak
Menggunakan Virtual DOM
- Sangat
Reactive
Berikut
ini merupakan Langkah-langkah menginstal Svelte JS :
(Note : Untuk proses penginstalannya, disarankan menggunakan
alat bantu degit untuk
membangun kerangka aplikasi. Node dan npm juga merupakan keharusan untuk
menggunakan framework ini.)
- #1 Install Node, NPM dan NPX bagi yang belum install. Karena saya belum install NPX maka saya install dengan cara membuka command prompt (CMD) atau untuk mac dan Linux bisa gunakan terminal.
Ketik : npm install -g npx
#2 Install Degit, Ketik : npm install -g degit Di CMD-nya.
#3 Kemudian install Svelte JS, ketik npx degit sveltejs/template my-svelte-project atau bisa download langsung filenya.
Kalau
tampilannya begini, silahkan buka browser dan jalankan di http://localhost:5000. Maka akan muncul tampilan
seperti dibawah ini.
Untuk mengubah tulisannya, teman-teman bisa modifikasi file App.svelte dan Main.js didalam folder src
# File App.svelte
#File Main.js
Jika
dijalankan, tampilannya seperti dibawah ini :
Sahabat Coders juga bisa memodifikasi sesuai dengan kemaunnya masing-masing, yang terpenting adalah kita memahami struktur folder dan filenya, kemudian apa yang harus di import, variable apa yang diambil, variable ini diambil dari mana.
Itu
semua harus dipelajari sebelum membuat project dengan Svelte ini, biar tidak
kebingungan saat menggunakannya.
Sekian
dulu artikel kali ini, semoga apa yang kami bagikan bermanfaat.
#StayCodingSmileAndHappy
0 comments:
Post a Comment