Berikut adalah cara penggunaan program dalam repo ini
Clone atau download repo ini dan pastikan pnpm (nodejs package manager) telah terinstall. Cara instalasi pnpm dapat Anda lihat pada laman resmi pnpm.
- Masuk ke dalam root directory lalu jalankan
pnpm ipada terminal untuk menginstall seluruh dependency. - Jalankan development server dengan
pnpm devdan testing mode menggunakan cypress melalui perintahpnpm test. - Setelah layanan yang Anda kembangkan telah siap jalankan
pnpm builduntuk mengkompilasi widget ini, widget siap terdistribusi akan muncul di folder dist. - Simpan dan sajikan 2 file dalam folder dist (tepatnya pada subfolder assets) ke dalam layanan CDN.
Gunakan dockerfile pada root folder atau deploy folder dist hasil build ke static file server manapun (misal github pages atau AWS S3).
- Pastikan 2 file asset widget telah Anda load, dengan rincian 1 file js dan 1 file css, baik melalui CDN ataupun self-hosted. Contoh :
<script type="module" crossorigin src="https://widget.mikoding.com/assets/index.js" ></script> <link rel="stylesheet" href="https://widget.mikoding.com/assets/index.css" />- Buat sebuah elemen html dengan id copy-widget. Contoh :
<div id="copy-widget" data-key="example-key" style="padding: 2rem;"></div>- Widget akan mendeteksi elemen secara otomatis dan menampilkan form.