FloGuard: How We Built a Port Orange Drainage Contractor's Site, Then Made Every Page Readable to Crawlers

Web Development · 5 min read ·

By Heath Daniel, Founder & AI Platform Architect, HD Connex · Published:

Direct answer: FloGuard is a Port Orange, Florida drainage contractor that designs and installs French drains and sump pump systems for Central Florida homeowners. HD Connex built floguardfl.com: a React frontend and FastAPI lead backend on Cloudflare Pages and Render, a twelve-step assessment that captures leads, a site assistant, and build-time prerendering, shipped between July 7 and September 17, 2026.

FloGuard is a Port Orange, Florida drainage contractor that designs and installs French drains and sump pump systems for Central Florida homeowners. HD Connex built floguardfl.com: a React frontend and FastAPI lead backend on Cloudflare Pages and Render, a twelve-step assessment that captures leads, a site assistant, and build-time prerendering, shipped between July 7 and September 17, 2026.

floguardfl.com - FloGuard home page
floguardfl.com - FloGuard home page

What FloGuard gets from the site

  • A qualifying path, not a plain contact form: the Contact page runs a twelve-step assessment whose steps run from the problem and where the water sits, through damage, property type, location and photos, to contact details, and posts each lead to the FastAPI backend, which sends a notification email.
  • Pages a crawler can read: every route is prerendered to HTML at build time, so every page carries its full text without JavaScript.
  • A site assistant that answers from the site's own content and hands off to the assessment the moment someone asks about price or scheduling.

What the site covers

The public site at floguardfl.com covers exterior French drains, interior drains with sump pumps, yard drainage and grading, and pump maintenance and monitoring, with city pages for its service areas, from Port Orange and Daytona Beach to Sanford and Orlando, and guides on drainage costs, Volusia County permits and why French drains fail in Florida. At our July 14, 2026 baseline the sitemap held four service pages, eight city pages and eight guides.

The one hard problem: a site crawlers could not read

The site launched as a Create React App single-page application. That works in a browser, but a crawler that does not execute JavaScript gets an almost empty page. Our own July 14 SEO execution plan put it plainly: the stack was React client-side rendering, and the action needed was to prerender or server-render the money pages, which the plan defined as the home page, the four service pages, the Port Orange, Daytona Beach and Orlando pages and the cost guide. Our acceptance test was blunt: fetching a page with no JavaScript had to return the main heading and at least 300 words of real body text, not a noscript stub.

There was a second, quieter blocker. The repository's robots.txt allowed GPTBot, ClaudeBot and Google-Extended, but the live file began with a Cloudflare managed block that disallowed them, and no commit could change that; the fix was a Cloudflare dashboard change, which we wrote up as a week-one task. The live robots.txt now carries no Cloudflare block and allows those agents.

The prerender fix shipped on August 25, 2026: a Puppeteer step runs after the production build and renders every route to HTML, so Cloudflare Pages serves complete pages. Follow-ups on September 9 fixed trailing-slash 308 redirects, removed duplicate tags from the page head and made missing pages return a real 404, and on September 12 and 16 the llms.txt file was rewritten to the llmstxt.org spec and joined by an llms-full.txt.

What we built, and what it runs on

The frontend is React 19 on Create React App with craco, react-router 7 and Tailwind 3. The backend is FastAPI on Python 3.11 with Motor for MongoDB, PyJWT and bcrypt for authentication, Resend for email and ReportLab for generating PDFs. The frontend deploys to Cloudflare Pages and the API to Render. Both decisions came in the first week, when we also swapped the file storage code from a planned R2 bucket to MongoDB GridFS, because R2 was not set up yet and GridFS needed no extra service.

The assistant we added on July 10 is deliberately not an AI chatbot. The design spec locked that decision: no language model and no external AI API, just a knowledge pack compiled from the site's own services, process, city and FAQ data, and a keyword matcher that scores each entry and returns the best answer or a fallback. It never collects a name, phone or email, never states a dollar figure, and as soon as a message looks like a price, quote or scheduling request it hands off to the Contact assessment, carrying the topics discussed into the form. It cannot invent a price.

Performance and polish

The hero is a video with a scrub interaction, which the SEO strategy doc lists as off limits for the SEO work, so the performance pass on July 22 shrank the video file rather than replacing it and shipped a cache-busted 2.2 MB version, alongside WebP images, a leaner home bundle and deferred main-thread work. On July 8 a mobile audit fixed a ticker that ran too fast on phones and a photo pass removed duplicate images.

Beyond the marketing site

On July 20 we added an internal sales app for FloGuard's team, hosted on Vercel and routed from the marketing site the next day: a lead command center with a flood-risk map scored at the parcel level from Volusia County parcel data, live rainfall and USGS 3DEP terrain, refreshed by a daily rainfall job that runs as a Vercel cron and a Supabase pg_cron.

What shipped, and when

Eighty-four commits between July 7 and September 17, 2026: the site and its deploy setup in the first week (July 7 to 10), the assistant and SEO pass on July 10 and 11, the sales app and the performance work on July 20 to 22, prerendering and the first content batch on August 25, crawl fixes and the llms files in September, and the flood-map terrain work on September 16 and 17.

What we would do differently

  • Prerender from day one. Our own plan flagged the client-rendered stack on July 14 and the fix landed on August 25. Google can render JavaScript, but the plan's point was to be fetched and cited by answer engines, and our own no-script test went unmet that long.
  • Check the CDN's managed robots rules before calling AI crawl access done; an allow list in the repository cannot be trusted if the edge prepends a disallow.
  • Do not wire code to services that are not set up yet; the R2 storage code was swapped for GridFS on July 8.
  • In the flood-map work, the first terrain proxies turned out to be noise, per the build log, so we replaced them with real USGS elevation data; measure a proxy against ground truth before building on it.

Need a site that search engines and answer engines can read?

HD Connex builds websites like this one from Daytona Beach for businesses across Volusia County and Florida, Port Orange included. Every engagement starts with a free consult and a fixed quote before any build.

Sources and further reading

See it live: FloGuard

FloGuard home page

Residential flood mitigation for Central Florida homeowners.

Visit floguardfl.com · See it in the portfolio

Frequently Asked Questions

What did HD Connex build for FloGuard?

The marketing site at floguardfl.com, with a React 19 frontend on Cloudflare Pages and a FastAPI backend on Render; a twelve-step assessment that captures leads and sends a notification email; a retrieval-based site assistant; build-time prerendering so crawlers get full pages; and an internal sales app with a parcel-level flood-risk map.

Why did a React site need prerendering?

Create React App renders pages in the browser, so a crawler that does not execute JavaScript sees an almost empty page. Since August 25, 2026 a Puppeteer-based step renders every route to HTML after each production build, so the service, city and guide pages ship with their full text.

Is the FloGuard site assistant an AI chatbot?

No. By design it uses no language model and no external AI API. It matches questions against a knowledge pack built from the site's own content, never collects contact details and never quotes a price. When someone asks about cost or scheduling it hands them to the Contact assessment, which remains the Contact page's lead form.

Topics: Project Story, Contractor Websites, React, FastAPI, Cloudflare Pages, Port Orange

Written by Heath Daniel

Founder & AI Platform Architect, HD Connex. Heath builds the websites, AI agents and lead systems HD Connex ships for Daytona Beach and Volusia County businesses, and writes up what works from real client builds. About Heath

Keep reading

Related: Web design for Port Orange businesses · Website design services · Book a free consult · Industry solutions (Daytona Beach) · Website design packages

← Back to blog · Industry solutions

Contact Us View Case Studies

HD Connex
Daytona Beach, FL 32118
Phone: +1 (386) 318-2214
Email: heath@hdconnex.com