Description
Berawal dari struggle saya yang selalu dapat artikel dengan iklan yang bejibun, padahal yang saya cari adalah informasi tepat tentang jam berapa KRL berangkat dan tiba. Nampaknya, Google masih memiliki masalah serius dalam hal SEO-nya. Nah, kebetulan baru-baru ini saya menemukan Commute API yang seperti boleh di-consume oleh publik.
Dokumentasi API Kereta Api Indonesia (KRL)
Endpoint
https://api-partner.krl.co.id/krlweb/v1/schedule
Request
-
Method
GET
-
Parameters
stationid
(string): ID dari stasiun. Nilai yang valid meliputi:- 'YK'
- 'LPN'
- 'MGW'
- 'BBN'
- 'SWT'
- 'KT'
- 'CE'
- 'DL'
- 'GW'
- 'PWS'
- 'SLO'
- 'PL'
timefrom
(string): Waktu mulai dalam format 24 jam ('HH:MM').timeto
(string): Waktu akhir dalam format 24 jam ('HH:MM').
Response
Response mengandung informasi berikut:
train_id
(string): ID kereta.ka_name
(string): Nama kereta.route_name
(string): Nama rute.dest
(string): Tujuan kereta.time_est
(string): Estimasi waktu kedatangan dalam format 'HH:MM:SS'.color
(string): Warna kereta dalam format kode warna hexadecimal.dest_time
(string): Waktu kedatangan di tujuan dalam format 'HH:MM:SS'.
Contoh Penggunaan
Untuk mendapatkan jadwal kereta dari stasiun 'PL' mulai dari pukul '01:00' hingga '24:00', Anda bisa melakukan request seperti berikut:
https://api-partner.krl.co.id/krlweb/v1/schedule?stationid=PL&timefrom=01:00&timeto=24:00
Approach
Bayangkan Anda adalah seorang pemrogram yang sedang membuat aplikasi jadwal kereta dengan JavaScript dan Svelte. Anda mulai dengan menciptakan beberapa variabel untuk menampung informasi penting, seperti 'departureStationId' dan 'arrivalStationId'. Mereka adalah tempat Anda menampung informasi tentang stasiun keberangkatan dan kedatangan.
Saat Anda melangkah lebih jauh ke dalam kode, Anda melihat URL API yang akan Anda gunakan untuk mengambil jadwal kereta api. URL ini adalah gerbang Anda ke dunia luar, tempat semua jadwal kereta tersimpan dan siap untuk diakses.
Berikutnya, Anda melihat fungsi 'toggleCurrentTime'. Fungsi ini adalah kunci untuk memperbarui waktu keberangkatan Anda. Apakah Anda ingin berangkat sekarang atau kemudian? Itulah keputusan yang harus dibuat oleh fungsi ini.
Anda terus berjalan dan menemukan fungsi 'fetchData'. Fungsi ini adalah jembatan Anda ke dunia luar, mengambil data dari API dan menyimpannya untuk digunakan nanti. Fungsi ini bertugas mengambil jadwal kereta api dan memastikan mereka siap untuk digunakan.
Akhirnya, Anda melihat fungsi 'updateSchedules'. Fungsi ini adalah jantung dari aplikasi Anda, mengambil data dari 'fetchData' dan menggunakannya untuk memperbarui jadwal kereta api. Tanpa fungsi ini, pengguna tidak akan dapat melihat jadwal kereta terbaru.
Dan itulah perjalanan Anda melalui kode JavaScript dan Svelte ini, berakhir dengan panggilan fungsi 'updateSchedules' yang menampilkan semua jadwal kereta terbaru bagi pengguna. Anda telah menciptakan aplikasi yang elegan dan fungsional, semua berkat kekuatan JavaScript dan Svelte.
Technology
- Svelte
- Uno Css
- Cache API
- Astro JS
- minimal A11Y