Proses presensi mahasiswa magang MSIB di Dinas Koperasi Usaha Kecil dan Menengah serta Perdagangan Kota Surabaya masih mengandalkan aplikasi AppSheet yang memiliki keterbatasan kapasitas data dan rentan terhadap kesalahan karena pengolahan rekapitulasi laporan presensi secara manual. Selain itu, sistem yang ada belum memiliki validasi lokasi, sehingga memungkinkan mahasiswa melakukan presensi di luar area penempatan. Penelitian ini bertujuan untuk merancang dan membangun aplikasi presensi berbasis website yang dapat mempermudah pencatatan dan monitoring kehadiran mahasiswa magang. Pengembangan dilakukan menggunakan metode Extreme Programming (XP) yang terdiri dari tahapan iteratif seperti planning, simple design, coding, dan continuous testing. Kebutuhan sistem diperoleh melalui observasi dan wawancara dengan pihak dinas, kemudian diturunkan ke dalam user story untuk setiap aktor. Pengujian dilakukan menggunakan metode black box dan Laravel Dusk untuk memastikan fungsionalitas dan kestabilan sistem. Hasil dari penelitian ini adalah sebuah aplikasi presensi berbasis web yang dilengkapi fitur GPS, foto selfie, monitoring kehadiran, serta otomatisasi laporan yang mendukung transparansi dan lebih baik. Sistem ini diharapkan mampu menangani jumlah data yang besar, mengurangi kesalahan pencatatan, dan meningkatkan pengelolaan presensi mahasiswa magang.