𝗠𝗲𝗺𝗯𝗮𝗻𝗴𝘂𝗻 𝗪𝗶𝗱𝗴𝗲𝘁 𝗥𝗦𝗦 𝗦𝗲𝗱𝗲𝗿𝗵𝗮𝗻𝗮 𝗱𝗲𝗻𝗴𝗮𝗻 𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁
RSS sudah berusia lebih dari 20 tahun. Ini tetap menjadi cara utama untuk membagikan berita, blog, dan podcast.
Banyak pengembang menggunakan framework berat untuk menampilkan feed RSS. Anda tidak membutuhkannya. RSS hanyalah XML. Browser Anda dapat membaca XML secara native.
Anda dapat membangun widget RSS yang bersih dan responsif hanya dengan menggunakan vanilla JavaScript dan CSS.
Cara kerjanya:
- Gunakan Fetch API untuk mendapatkan data XML.
- Gunakan DOMParser untuk mengubah XML tersebut menjadi dokumen yang dapat dibaca.
- Iterasi melalui item untuk mengekstrak judul, tautan, dan deskripsi.
- Render data ke dalam grid kartu.
Masalah umum yang sering terjadi adalah CORS. Jika server memblokir permintaan Anda, browser akan menghentikannya. Anda dapat mengatasi hal ini dengan menggunakan proxy seperti allorigins.win. Untuk proyek profesional, gunakan Cloudflare Worker untuk menangani permintaan.
Fitur utama dari pendekatan ini:
- Tanpa instalasi npm atau library eksternal.
- Ukuran file kecil dan pemuatan cepat.
- Berjalan dengan feed RSS 2.0 standar apa pun.
- Mudah untuk menambahkan filter kategori.
Anda dapat memperluas widget ini dengan menambahkan:
- Auto-refresh agar konten tetap mutakhir.
- Bilah pencarian untuk menemukan postingan tertentu.
- Local storage untuk menyimpan cache data.
- Dukungan dark mode menggunakan variabel CSS.
Berhentilah menggunakan alat yang berat ketika API native sudah bekerja dengan sempurna.
Sumber: https://dev.to/debate_me_af4b65ae011518f/build-a-simple-rss-feed-widget-in-vanilla-javascript-1803