Ms. Newsom and Ms. Allen, admissions directors at The Lamplighter School, ran point on ISAAD — the Independent Schools Admission Association of Dallas, sixteen accredited private and independent schools whose only public face was a tired WordPress build at isaadallas.org. Homepage was a dark-blue info box stacked over a stock photo of kids leaning over tablets in a library; School Search was a grey form with raw dropdowns hiding sixteen schools behind selectors. The ask was a full rebuild aimed at parents shopping schools, with a real map and a search that felt like a search. First real paid web contract, $1,500, summer in Dallas.

• React
• React Router
• Tailwind
• Mapbox
• DreamHost

One aging WordPress site to outlive, sixteen member schools' worth of logos and admissions data to keep straight, and a single URL the consortium could hand to parents the next morning.

1. First — the Lamplighter pitch

   Sat down with Ms. Newsom and Ms. Allen at Lamplighter. Sixteen accredited schools, one consortium, parents bouncing off dropdowns. Mandate: make the admissions process more user-friendly. Handshake on $1,500 to redraw the whole thing.

2. Inventory — what was already up

   Walked the live site before touching anything. Top nav read HOME ABOUT US SCHOOL SEARCH PRIVATE SCHOOL PREVIEW EVENTS FAQ RESOURCES TESTING CONTACT US. Hero of children using tablets in a library, dark-blue box of body copy stacked underneath. School Search lived on a separate grey-background page with stacked dropdowns — Student Body, School Type, Religious Affiliation, Special Focus, Grade — and no map.

   

3. Tooling — React, then Tailwind

   Picked React because every tutorial pointed there and it all compiles down to HTML/CSS/JS in the end — a UI library that pretended to be a framework once react-router was bolted on. Tailwind for utility classes — every style inline instead of a separate sheet to chase. Cheap to learn, easy to ship.

4. Skeleton — react-router blockout

   Set up the React app, dropped react-router on top, blocked every route as a placeholder: Home, About Us, School Search, Private School Preview, Events, FAQ, Resources, Testing, Contact Us. Skeleton existed before any pixel did.

5. Page by page — homepage first

   Walked the old nav linearly, ported one page, pushed, ported the next. Homepage got a real hero of four kids and a 'Why Choose ISAAD Schools?' card grid; testimonials and an Affiliations partner-logo strip below. The old dark-blue info box rewritten as something a parent could actually read.

6. School Search — dropdowns become filters

   Rebuilt the search around a left filter panel: green chips for student body, religious affiliation, and special focus; a grade dropdown; and a ZIP-code radius search. Results rendered immediately as clean school cards, with the locations map queued underneath.

   

7. Mapbox — sixteen pins on Dallas

   Bolted a Mapbox canvas under the search results with a blue pin per member: Alcuin, Cistercian, Dallas International, ESD, Good Shepherd, Greenhill, Hockaday, Lakehill, Lamplighter, Parish, Shelton, St. John's, St. Mark's, St. Philip's, Ursuline, Winston. Sixteen pins on a Dallas map instead of sixteen values in a dropdown.

   

8. Ship — dev → production

   Pushed the build to DreamHost behind dev.dallasprivateschool.org for the directors to walk through, then cut DNS over to isaadallas.org once Lamplighter signed off. Got paid.

First check made the deadlines real in a way no personal project ever had — sixteen schools were waiting on the URL to flip, and there was no version of "I'll get to it next weekend" that survived contact with that. Learning React on a paying client means shipping the working version of what you barely understood last week, then cleaning it up after the check clears. The legacy WordPress wasn't bad code so much as a frozen aesthetic from a decade earlier; the rebuild's job was less to add features than to make sixteen schools feel like a current organization.