logo
Education & GovernmentWeb ApplicationCompletedFeatured

PPDB Surabaya

Building a reliable admission platform for over 20,000 elementary school applicants

PPDB Surabaya 2023 is the official online admission platform for elementary schools in Surabaya. I joined the project after being invited by a senior from my university and worked as a Frontend Engineer from March to June 2023. During the four-month development cycle, I collaborated with government stakeholders, university lecturers, and the engineering team to deliver a reliable admission system capable of supporting more than 20,000 applicants during the enrollment period.

My Role
Frontend Engineer
Year
2023
Duration
4 Months
PPDB Surabaya
20,000+
Applicants
4 Months
Project Duration
Frontend Engineer
Role
3x / Week
Team Meetings

The Journey

My First Large-Scale Government Project

Learning professional software engineering in production

I joined PPDB Surabaya after being invited by a senior from my university to participate in the development of the city's elementary school admission platform. This became my first professional project where I worked entirely as a Frontend Engineer alongside experienced engineers, university lecturers, and government stakeholders. As a newcomer to a production-scale project, I invested significant time understanding the existing codebase, project architecture, coding conventions, and engineering workflow before contributing features. Since AI-assisted development tools were not yet common, every implementation was written and reviewed manually, which greatly strengthened my understanding of React, TypeScript, and Redux. This project became one of the most valuable learning experiences early in my software engineering career.

Building Reliable Features for Thousands of Applicants

Development, maintenance, and operational support

My responsibilities extended beyond frontend development. Throughout the project, I participated in meetings with government stakeholders, university lecturers, and the internal engineering team three times each week to discuss development progress, review completed work, report bugs, and plan upcoming releases. On the engineering side, I was responsible for: • Maintaining and improving existing frontend modules • Developing new features and fixing production bugs • Integrating frontend applications with backend APIs • Revamping the landing page • Improving registration form reliability • Implementing geolocation-based zoning to automatically determine the applicant's district, subdistrict, and available schools based on their current location The zoning feature significantly simplified the registration process by automatically recommending schools within the applicant's eligible admission zone.

Supporting a Critical Public Service

Keeping enrollment running smoothly

During the official enrollment opening, the engineering team monitored the system overnight from 12:00 AM until 6:00 AM to ensure the registration platform remained stable while thousands of users submitted applications. My responsibility was to monitor the frontend application, verify that every registration flow worked correctly, respond quickly to issues reported by users or stakeholders, and deploy bug fixes whenever necessary to minimize service disruption. The platform successfully supported more than 20,000 elementary school applicants throughout the 2023 admission period. Beyond the technical experience, this project taught me how production systems are operated, how engineering teams collaborate with government stakeholders, and how software reliability becomes critical when building applications used directly by the public.

Technologies Used

React
TypeScript
Redux
Tailwind CSS
CSS
Node.js
Git
GitHub

Key Features

Revamped the landing page for improved usability and responsiveness.
Maintained and enhanced multiple registration modules.
Integrated frontend with backend APIs for the admission workflow.
Fixed registration form bugs and improved user experience.
Implemented geolocation-based school zoning to automatically determine eligible schools based on the applicant's location.
Used Redux.js to manage complex application state across the registration flow.

Key Learnings

1

Learned professional frontend engineering practices from experienced senior engineers.

2

Developed a deep understanding of Redux for managing complex application state.

3

Gained experience collaborating directly with government stakeholders and cross-functional teams.

4

Learned how to maintain production systems during high-traffic events.

5

Strengthened skills in API integration, debugging, and frontend architecture.

6

Experienced the operational side of software engineering, including real-time monitoring and hotfix deployment.

Interested in this project?

Feel free to explore the code or see it in action. I m always happy to discuss the technical details!