Project Snapshot
Key takeaway
Diamond Ace is my strongest client project to date because it covers the full website lifecycle: planning, frontend development, form integration, testing, deployment, and ongoing production support. The project pushed me beyond building isolated interfaces and into maintaining a real website for an operating business.
A production website for a Central Florida painting and drywall repair company, built to clearly explain services, generate estimate requests, and remain maintainable after launch.
Client context
Diamond Ace Construction is a Central Florida painting company serving apartment turnovers, interior painting, drywall and texture repair, and exterior painting. The business already had steady work through its existing relationships, but it needed a professional website that could represent the company online and give potential customers a clear way to understand its services and request an estimate.
I began planning the website with the client in May 2026 and continued through development, testing, deployment, and final production work. The initial build was completed in October 2026, and I continue to maintain and improve the site as an independent contractor.
My role
I handled the frontend website lifecycle from planning through production, including:
• Translating the business's services into a clear website structure
• Building responsive pages and reusable React components
• Designing the estimate-request experience
• Connecting production lead capture with Netlify Forms
• Adding validation and spam protection
• Running automated end-to-end tests and manual QA
• Improving accessibility, performance, and technical SEO
• Managing GitHub-based deployment and ongoing website maintenance
The problem
The challenge was not simply to create a visually polished marketing site. The website also needed to organize several service categories without overwhelming visitors and provide a practical way for potential customers to send useful project details to the business.
Because the site would be used in production, it also needed dependable form behavior, responsive layouts, accessible interactions, and a deployment process that I could continue supporting after launch.
The solution
I built the site with Next.js, React, TypeScript, and Tailwind CSS using reusable components and centralized service data. The public experience is organized around the company's four main service areas and guides visitors toward a multi-step estimate-request flow.
The estimate form uses React Hook Form and Zod for client-side validation. In production, submissions are sent through Netlify Forms with honeypot spam protection and can trigger email notifications to the business. Local development uses safe submission behavior so testing does not create real business leads.
Key features
• Responsive multi-page Next.js website
• Dedicated service content for apartment turnovers, interior painting, drywall
and texture repair, and exterior painting
• Reusable React UI components and shared service data
• Guided multi-step estimate-request experience
• React Hook Form + Zod validation
• Netlify Forms production lead capture
• Honeypot spam protection and email notification workflow
• Responsive navigation and mobile-focused interaction polish
• Privacy page, metadata, sitemap, robots rules, and structured-data foundation
• Automated browser testing with WebdriverIO
Quality and production work
A large part of this project happened after the main pages were already built. I worked through production hardening that included automated E2E testing, TypeScript checks, lint cleanup, accessibility improvements, cross-browser QA, form verification, performance work, and final deployment checks.
The project uses WebdriverIO for end-to-end testing and includes dedicated npm scripts for linting, type checking, building, and E2E runs. I also verified the production estimate workflow rather than treating a successful local form state as proof that lead delivery worked.
Technical stack
• Next.js App Router
• React 19
• TypeScript
• Tailwind CSS
• React Hook Form
• Zod
• Netlify Forms
• WebdriverIO
• GitHub / GitHub Actions
• Netlify deployment
Ongoing support
The site remains an active client project rather than a finished tutorial or archived portfolio exercise. I continue to maintain the existing website and have client authorization to make design-level improvements such as typography, imagery, layout, responsiveness, and other visual refinements.
Larger additions such as new pages, new branding assets, booking functionality, or other expanded features are handled separately with client approval.
The business also plans to move from the current Netlify subdomain to a custom
.com domain in a future production update.
What I learned
The biggest lesson from Diamond Ace was that shipping a client website is only part of the job. Production work also means validating the actual lead flow, handling edge cases, checking accessibility and browser behavior, maintaining a clean deployment process, and staying responsible for the site after launch.
It also gave me experience balancing engineering decisions with the needs of a real small business. The goal was not to add complexity for its own sake; it was to create a website that is easy for customers to use and practical for the business to keep online.