Laporkan Masalah

Pengembangan Front-End Aplikasi Berbasis Web untuk Keselamatan Anak Berbasis Geofencing dengan Peningkatan Fleksibilitas, Informasi, dan Keamanan

RAISA SALSABIL YUSRIYYA, Warsun Najib, S.T., M.Sc.; Ir. Azkario Rizky Pratama, S.T., M.Eng., Ph.D.

2024 | Skripsi | TEKNOLOGI INFORMASI

Keselamatan dan keberadaan anak adalah kekhawatiran bagi orang tua dan keluarganya. Survei menunjukkan 66,67?ri mereka merasa khawatir terhadap keberadaan anak. Hal ini disebabkan oleh maraknya kejahatan terhadap anak, pembolosan, dan dinamika pergaulan. Munculnya tantangan tersebut disertai dengan maraknya penggunaan PC, ponsel pintar, dan internet di Indonesia yang mendukung GPS. Dengan GPS, pemanfaatan konsep context-aware computing, dan teknik geofencing, orang tua dapat dengan lebih mudah mengawasi lokasi anak dari perangkatnya. Dengan geofencing, dibentuk batas virtual di suatu area geografis untuk mengawasi lokasi anak yang dapat diimplementasikan dalam aplikasi berbasis web. Apabila anak keluar dari batas tersebut, maka orang tua akan mendapatkan notifikasi. Aplikasi web dapat diakses di berbagai jenis perangkat, hemat penyimpanan, serta memudahkan input data melalui layar ukuran besar. Terdapat beberapa aplikasi sejenis yang dikembangkan pada penelitian terdahulu. Salah satunya ialah aplikasi web Andal dengan fitur-fitur yang masih terbatas sehingga memerlukan pengembangan lanjutan.


Penelitian diperlukan untuk menambah dan meningkatkan fitur aplikasi Andal, terutama fitur multijadwal dan kustomisasi area geofencing agar pengawasan anak lebih fleksibel, fitur yang informatif mengenai status anak terkini, dan perbaikan metode penghubungan akun agar lebih aman. Pengembangan dilakukan untuk membuat bagian front-end aplikasi web dengan metodologi Agile, dimulai dari pengumpulan, analisis, dan pendefinisian kebutuhan, perancangan sistem, pengembangan kode dengan React.js dan Tailwind CSS, pengujian, serta deployment. Protokol HTTP digunakan untuk berkomunikasi dengan API dari back-end Andal v2 dan WebSocket untuk berkomunikasi dengan Realm. Lalu, digunakan API Google Maps untuk fitur-fitur terkait lokasi.


Dihasilkan bagian front-end aplikasi berbasis web Andal v2 yang dapat melakukan pengawasan terhadap lebih dari satu anak. Tiap anak dapat memiliki lebih dari satu jadwal dengan bentuk area geofence berupa lingkaran dengan radius kustom atau poligon. Orang tua dapat mengetahui status anak terhadap geofence, status GPS, sisa baterai, dan posisi terkini anak serta akan mendapatkan push notification ketika anak keluar dari area geofence. Penghubungan akun orang tua dan anak diperbarui dengan metode kode QR dan OTP yang lebih aman. Ada pula pencegahan anak untuk masuk ke akunnya melalui browser yang belum diizinkan. Tujuan untuk peningkatan fleksibilitas, informasi, dan keamanan penghubungan akun serta pengelolaan akun anak telah berhasil. Selain itu, dari pengujian black-box yang dilakukan, dihasilkan bahwa fitur-fitur utama pada aplikasi telah berfungsi dengan baik. Ada pula hasil pengujian push notification yang menunjukkan bahwa notifikasi berhasil dikirimkan ke orang tua dengan durasi rerata 12,626 detik. Audit dengan Lighthouse menunjukkan nilai berkategori "baik" dan memenuhi standar untuk aksesibilitas, best practices, dan SEO pada versi mobile dan desktop serta performa versi desktop. Namun, masih perlu dilakukan perbaikan untuk performa pada versi mobile.

The safety and whereabouts of children are a concern for parents and their families.  The survey that was conducted showed that 66.67% of them felt worried about their children's whereabouts. This concern is driven by the rise in crimes against children, truancy, and social dynamics. The emergence of these challenges is accompanied with the widespread use of smartphones, PCs, and the internet in Indonesia, which support GPS. With GPS, the utilization of context-aware computing, and geofencing techniques, parents can more easily monitor their children's location from their devices.  With geofencing, a virtual boundary is established in a geographic area to monitor the child's location which can be implemented in a web-based application. If the child leaves the area, the parent will get a notification. Web applications can be accessed on various types of devices, save storage, and make data input easier via large screens. There are several similar applications developed in previous research. One of them is the "Andal" web application whose features are still limited and therefore require further development.


Research is needed to add and improve the features of the Andal application, especially the multi-schedule feature and geofencing area customization, to make child monitoring more flexible, more informative regarding the child's status, and to provide safer account linking methods. Development was carried out to create the front-end part of the web application using the Agile methodology, starting from requirements gathering, analysis, and definition, system design, code development with React.js and Tailwind CSS, testing, and deployment. HTTP protocol is used to communicate with the API of the Andal v2 back-end and WebSocket to communicate with Realm. Then, the Google Maps API is used for location-related features.


The front-end part of the Andal v2 web-based application was produced which can monitor more than one child. Each child can have more than one schedule with a geofence area in the form of a circle with customized radius or a polygon. Parents can monitor the child's status against the geofence, GPS status, remaining battery, and the child's current position. A push notification will be sent when the child leaves the geofence area. Parent and child accounts linking is updated with a more secure QR code and OTP method. There is also prevention for children from logging into their accounts via unpermitted browsers. The goal of improving the flexibility, information, and security of account linking and child account management has been successful. From the black-box testing, it was found that the main features of the application were functioning well. There is also the push notification test result which show that the notification was successfully sent to parents with an average duration of 12.626 seconds. An audit with Lighthouse showed a grade of "good" and met standards for accessibility, best practices, and SEO on mobile and desktop versions as well as desktop version performance. However, improvements still need to be done to performance on the mobile version.

Kata Kunci : keselamatan anak, aplikasi berbasis web, geofencing, context-aware computing, global positioning system

  1. S1-2024-456376-abstract.pdf  
  2. S1-2024-456376-bibliography.pdf  
  3. S1-2024-456376-tableofcontent.pdf  
  4. S1-2024-456376-title.pdf