IMPLEMENTASI ANTARMUKA SINGLE PAGE APPLICATION PADA E-LEARNING UMI MENGGUNAKAN REACT.JS DAN REST API

Transformasi digital dalam pendidikan menuntut ketersediaan platform e-learning yang tidak hanya informatif, tetapi juga responsif dan mudah digunakan. Penelitian ini berfokus pada pengembangan antarmuka (frontend) platform e-learning "Usaha Mandiri Ibu" (UMI) menggunakan arsitektur Single Page Application (SPA) berbasis React.js yang terintegrasi dengan REST API yang dibangun menggunakan Express.js pada Node.js. Pendekatan ini dipilih untuk mengatasi keterbatasan Multi-Page Application (MPA) konvensional yang kurang efisien dalam memuat halaman, serta untuk memenuhi kebutuhan pengguna sasaran (ibu rumah tangga) akan antarmuka yang intuitif dan cepat. Pengembangan sistem dilakukan menggunakan metode Waterfall yang meliputi analisis, perancangan, implementasi, dan pengujian. Hasil penelitian menunjukkan bahwa implementasi React.js berhasil menciptakan antarmuka modular yang memisahkan logika tampilan dari logika bisnis di sisi server. Pengujian Black Box pada delapan skenario utama menunjukkan seluruh fungsi berjalan valid. Selain itu, pengujian performa jaringan melalui Chrome DevTools menunjukkan bahwa navigasi antar-halaman dilakukan tanpa full page reload, ditandai dengan hanya satu permintaan dokumen (Doc request) pada pemuatan awal. Temuan ini membuktikan bahwa arsitektur SPA meningkatkan efisiensi proses navigasi dan mempercepat waktu respon, sehingga mendukung pengalaman penggunaan yang lebih nyaman bagi pengguna.