Lembaga BINA ESSA merupakan institusi Pendidikan non-formal yang bergerak di bidang tata busana dan garmen, menawarkan program pelatihan di bawah pengawasan Kementerian Tenaga Kerja (Kemnaker). Untuk meningkatkan efisiensi proses pendaftaran manual, penelitian ini mengembangkan sistem aplikasi berbasis web bernama EduSkill. Sistem ini bertujuan memfasilitasi proses pendaftaran peserta didik baru pada Lembaga Kursus dan Pelatihan (LKP) serta Lembaga Pelatihan Kerja (LPK) BINA ESSA dengan fokus pada implementasi antarmuka pengguna (UI) yang user-friendly menggunakan framework React.js dan pendekatan Atomic Design. Pendekatan Atomic Design yang memecah elemen UI menjadi atoms, molecules, organism, templates dan pages membantu menciptakan sistem yang modular, terorganisir, dan konsisten. Desain yang diimplementasikan diuji menggunakan metode uji validitas dan maintainability terhadap source code react yang ada menggunakan sonarqube. Pengujian ini dilakukan untuk meminimalisir kekurangan yang tidak diperlukan terhadap source code implementasi frontend react yang dibangun. Alur data antara frontend dan backend dirancang sedemikian rupa sehingga proses validasi data di sisi frontend, pengolahan data di backend (menggunakan framework Laravel), serta penyajian informasi status pendaftaran di frontend dapat berjalan efisien dan terintegrasi.
Kata Kunci: Frontend, Atomic Design, Maintainability, React, SonarQube