Tutorial Laravel 9 dan Svelte #2 : Membuat Project Baru di Svelte Kit


Fika Ridaul Maulayya
Full-Stack Web Developer, Content Creator and CO-Founder SantriKoding.com
Tutorial Laravel 9 dan Svelte #2 : Membuat Project Baru di Svelte Kit

Halo teman-teman semuanya, pada artikel sebelumnya kita telah belajar membuat RESTful API di dalam Laravel. Sekarang kita akan lanjutkan belajar membuat project baru di dalam Svelte.

Disini kita akan menggunakan Svelte KIT. Svelte KIT merupakan application framework dari Svelte yang digunakan untuk membangun aplikasi yang lebih besar dengan footprint yang lebih kecil.

Dengan Svelte KIT, kita tidak perlu susah payah melakukan konfigurasi routing secara manual, karena sudah menggunakan filesystem-based routing. Yang artinya file yang kita buat akan otomatis menjadi route di dalam Svelte KIT.

Dengan Svelte KIT, kita juga akan disediakan sebuah lifecycle yang digunakan untuk merender component / halaman secara server side / SSR. Jadi dengan adanya SSR aplikasi / website yang dibangun memiliki SEO yang bagus.

Svelte masuk dalam web framework yang paling disukai di seluruh dunia (menurut survey dari stackoverflow).

sumber informasi : https://insights.stackoverflow.com/survey/2021#section-most-loved-dreaded-and-wanted-web-frameworks

Langkah - Membuat Project Baru di Svelte KIT

INFORMASI ! : pastikan sudah menginstall Node.js di dalam komputer.

Silahkan masuk ke dalam folder dimana teman-teman akan menyimpan project-nya. Kemudian jalankan perintah berikut ini di dalam terminal/CMD :

npm init svelte@next svelte-crud-spa

Di atas, kita membuat project baru dengan nama svelte-crud-spa. Kemudian tunggu beberapa waktu, maka akan muncul beberapa pertanyaan dan silahkan ikuti sesuai dengan table dibawah ini.

Question Action
Which Svelte app template? pilih Skeleton project dan ENTER.
Add type checking? pilih none dan ENTER.
Add ESLint for code linting? pilih No dan ENTER.
Add Prettier for code formatting? pilih No dan ENTER.
Add Playwright for browser testing? pilih No dan ENTER.

Jika sudah, maka project berhasil dibuat oleh Svelte KIT.

Langkah 2 - Menjalankan Project Svelte KIT

Silahkan masuk ke dalam project kita dengan perintah berikut ini.

cd svelte-crud-spa

Setelah berhasil masuk, kemudian jalankan perintah berikut ini untuk melakukan installasi dependency yaang dibutuhkan.

npm install

Setelah proses installasi dependecy selesai, sekarang jalankan perintah berikut ini di dalam terminal/CMD untuk melakukan serve / menjalankan project Svelte KIT.

npm run dev

Jika berhasil, maka project kita akan dijalankan di dalam localhost dengan port 3000.

Sampai disini pembahasan bagaimana cara membuat project baru di Svelte KIT, di artikel selanjutnya kita akan belajar melakukan installasi Bootstrap di dalam project Svelte dan sekaligus membut layout template.

Terima Kasih



Fika Ridaul Maulayya
Full-Stack Web Developer, Content Creator and CO-Founder SantriKoding.com

Suka dengan tulisan di SantriKoding? Kamu bisa memberikan dukungan dengan berdonasi atau bagikan konten ini di sosial media. Terima kasih atas dukungan Anda!

KEBIJAKAN KOMENTAR

Saat memberikan komenatar silahkan memberikan informasi lengkap tentang error, seperti: screenshot, link kode, dll. Baca aturan komentar kami