ISAAD

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.

   [image: Side-by-side screenshots of the old ISAAD WordPress site — left: homepage with top nav (HOME ABOUT US SCHOOL SEARCH PRIVATE SCHOOL PREVIEW EVENTS FAQ RESOURCES TESTING CONTACT US), hero photo of children using tablets in a library, dark blue info box with the consortium description; right: School Search page with grey background and stacked dropdown menus for Student Body, School Type, Religious Affiliation, Special Focus, Grade]

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.

   [image: Vertical stack of the new ISAAD homepage sections — hero block reading 'Dallas Independent Schools' with a wide color photo, then a card grid titled 'Why Choose ISAAD Schools?', then a Testimonials section with quotes, then an Affiliations strip with partner organization logos]

6. School Search — dropdowns become filters

   Rebuilt the search around dark-blue dropdowns and a column of tag-style filter buttons (Any, Co-ed, Non-Sectarian) instead of the old grey form. Results rendered as a logo grid. Same five filter axes — Student Body, School Type, Religious Affiliation, Special Focus, Grade — but now a parent could actually see what they were narrowing.

   [image: New ISAAD School Search page — left: dark-blue styled dropdowns labeled STUDENT BODY, SCHOOL TYPE, RELIGIOUS AFFILIATION, SPECIAL FOCUS, GRADE; middle: column of tag-style filter buttons (Any, Co-ed, Non-Sectarian); right: results grid showing logos and names of member schools]

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.

   [image: Mapbox-powered 'School Locations' map embedded in the ISAAD School Search page — interactive view centered on Dallas with sixteen blue pins dropped on member school addresses (Alcuin, Cistercian, Dallas International, ESD, Good Shepherd, Greenhill, Hockaday, Lakehill, Lamplighter, Parish, Shelton, St. John's, St. Mark's, St. Philip's, Ursuline, Winston)]

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.

$1,500 contract, 16 schools mapped

isaadallas.org

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.