Vite Lit Example free download source code gratis

27 Mar 2022

#tutorial #example #lit #vite #source code #vite lit #learn #download #gratis #belajar #code #vite lit source code

Example learn vite lit html belajar plus source code gratis download

Yap pada kesempatan kali ini kita akan ngebangun nih sebuah web app menggunakan technology terbaru dan banyak diperbincangkan para developer, siapakah dia..... dan kita sambut inilah vite dikombonasikan dengan lit html akan makin keren untuk belajar yes... Sebelumnya apa itu vite ?? Mulai Server Instan : Penyajian file sesuai permintaan melalui ESM asli, tidak perlu bundling, HMR secepat kilat : Penggantian Modul Panas (HMR) yang tetap cepat terlepas dari ukuran aplikasi , Kaya Fitur : Dukungan siap pakai untuk TypeScript, JSX, CSS, dan lainnya , Build yang Dioptimalkan : Rollup build yang telah dikonfigurasi sebelumnya dengan dukungan mode multi-halaman dan perpustakaan. Plugin Universal : Antarmuka plugin rollup-superset yang dibagikan antara dev dan build. API yang Diketik Sepenuhnya : API terprogram yang fleksibel dengan pengetikan TypeScript penuh.

Selanjutnya apa itu LIT ?? Lewati boilerplate : Dibangun di atas standar Komponen Web, Lit menambahkan apa yang Anda butuhkan untuk bahagia dan produktif: reaktivitas, template deklaratif, dan beberapa fitur bijaksana untuk mengurangi boilerplate dan membuat pekerjaan Anda lebih mudah. Setiap fitur Lit dirancang dengan cermat dengan mempertimbangkan evolusi platform web. Jejak kecil, pembaruan instan : Dengan berat sekitar 5 KB (diperkecil dan dikompresi), Lit membantu menjaga ukuran bundel Anda tetap kecil dan waktu pemuatan Anda singkat. Dan rendering sangat cepat, karena Lit hanya menyentuh bagian dinamis dari UI Anda saat memperbarui — tidak perlu membangun kembali pohon virtual dan membedakannya dengan DOM. Dapat dioperasikan & siap untuk masa depan : Setiap komponen Lit adalah komponen web asli, dengan kemampuan interoperabilitas yang luar biasa. Komponen web berfungsi di mana pun Anda menggunakan HTML, dengan kerangka kerja apa pun atau tidak sama sekali. Hal ini membuat Lit ideal untuk membangun komponen yang dapat dibagikan, sistem desain, atau situs dan aplikasi yang dapat dipelihara di masa mendatang.
oke... kita liat apa aja sih yang di sediakan pada source code kali ini.
Vite Lit Example free download source code gratis

Vite Lit Example free download source code gratis

Tampilan webiste nya gaes... di halaman depan nya gak bisa kita screen shoot karna ada animation disana , jadi langsung aja kehalaman home ini , disini ya seperti biasa lah biar keren dikit kita kasih deh tema template website gratis untuk kamu, ada beberapa section disini yang bisa kamu customise juga, plus hadirnya video dan footer bagian bawah biar makin keren.
Vite Lit Example free download source code gratis

Sealnjutnya nih ada halaman blog yang tertata rapi yes.. simple aja deh tampilan nya gak perlu ribet lah ya.. jadi nantinya pas kita klik salah satu post akan nampil nih detail dari post itu dan menariknya gak pakek load yes,, jadi tinggal klik icon dan klik icon kecil lagi nantinya,berasa single page app gitu.
Vite Lit Example free download source code gratis

Nah kalau display ini adalah tampilan yang ada ketika klik pada salah satu blog post, nanti akan ditampilin detail seperti ini ya,, ada foto title, deskripsi ama kontent, kamu bisa ubah dan isi sesuai ama kebutuhan kamu nantinya ya...
Vite Lit Example free download source code gratis

Terkahir ada animasi gerak gerak disini, kamu juga bisa ubah nanti tinggal oprek aja sourcecode nya uda kita kasih gratis ya.. jadi kita bisa belajar vite lit nih, mantab gak tuh ngab,,,

INSTALLASI VITE LIT
Nah untuk awal ini ada beberapa persyaratan yang harus kamu install dulu di device kamu , jadi kita bekerja dengan node so kamu wajib download node dulu , download node →.
Uda downloadnya ?? kalau uda kamu bisa buka comand prompt kamu cara nya tekan logo windows di keyboard dan ketikan cmd, nah nanti akan muncul bash shell terminal , kamu bisa cek apa node sudah berhasil kamu install dengan cara ketikan node -v kalau uda muncul berarti node sudah sukses di install , sama hal nya juga untuk cek npm version tinggal masukan kode ini npm -v.
Setelah itu baru deh kamu download source code nya yang ada di repo kami, caranya cukup mudah tinggal unduh saja dan mulai bekerja.

Donwload vite lit source code via github
Github Download
Atau kamu bisa clone fork repo ini dengan cara
git clone https://github.com/mesinkasir/vitelit.git

Nah kalau uda tinggal buat folder baru dan namai dengan prject kamu, extract file source code download ini ke folder poject kamu. lalu kita jalankan lagi shell terminal, dan kita musti arahkan ke project folder kamu ya, sebagai contoh project folder dengan nama vitelit ini saya taruh ke desktop , jadi nantinya kita bisa buka comand prompt atau shell terminal dengan memasukan kode berikut ini cd C:\Users\namapc\Desktop\vitelit ganti nama pc dengan nama pc kamu ya. kalau uda akses ke flder project kita perlu melakukan installasi dahulu nih, maka jalankan npm install setelah installsi sukses kita bisa buka dan cek gimana source code ini bekerja dengan menjalankan nya memakai shell terminal tadi dan masukan kode npm run dev. Selesai sudah kamu bisa mengunjungi localhost:3000 dari web browser kamu , dan tralala trili... selamat kamu sudah sukses dan berhasil melakukan installasi vite lit ini. oprek deh sesuai ama kebutuhan mu. dan kamu mau cek source code live kamu bisa ubah deh live kodding dibawah ini.

Sekian dan terima kasih sampai jumpa di source code selanjutnya.

BONUS CONTENT WAJIB BACA
Inilah mesin kasir modern terbaru →
Kumpulan sourcecode gratis download →

« Previous