From Rough to Ready

#devchallenge #githubchallenge #webdev #react

GitHub “Finish-Up-A-Thon” Challenge Submission

What I Built

I built a responsive hospital website using React, Tailwind CSS and Vite.

The app features:

a complete appointment booking flow with department selection and filtered doctor choices
a doctor directory and department overview
a services section with a featured telemedicine call-to-action
polished UI improvements for consistent cards, form placeholders and accessible controls

This project started as a basic healthcare interface and I finished it by strengthening the interaction design, improving layout consistency and tailoring the content for a more realistic hospital experience.

Demo

Repository: https://github.com/james-works/q9-multispecialty-hospital
Demo: https://q9-multispecialty-hospital.vercel.app/

The Comeback Story

This project was already close to being finished, but it still had a lot of rough edges. The UI felt inconsistent, some interactions didn't behave correctly and parts of the code were repetitive and hard to maintain.

So I treated this as a full "finish-up" phase - not just fixing small issues, but improving the overall quality of the app.

Before finishing, the project had several issues:

inconsistent card heights across feature sections
dropdown arrows too close to the select border missing placeholders on forms
basic filtering logic that didn't always behave correctly
generic content that made the app feel like a template

I improved the project by:

refactoring repeated UI parts into cleaner, reusable components
simplifying Tailwind styles and fixing inconsistent spacing
fixing card layouts so all sections align properly
improving select inputs (spacing, alignment, usability)
updating form UX with placeholders and better structure
fixing doctor filtering so it responds correctly to department selection
handling small edge cases in forms and dropdowns
replacing generic data with more realistic Indonesian-style names
improving the telemedicine CTA and making it work as a proper link

I also cleaned up unused code, improved responsiveness and made small UI adjustments that make the whole app feel smoother.

Overall, I focused on making the project feel complete - not just working, but consistent and reliable.

My Experience with GitHub Copilot

GitHub Copilot was extremely helpful during this finish-up phase. It helped me refactor components, suggest better structure and speed up repetitive UI fixes.

It was especially useful when: