Faith Dev Lab is a personal web agency brand offering web development, UI/UX design, and SEO services under one identity, built around the tagline "We feel, we form, we fulfill, so you flourish" to sum up the promise of pairing strong design with real, working performance. With no past client work to point to yet, the site itself was built to double as proof of what the agency can deliver.
A scrollable look at the finished site, exactly as a visitor would browse it.
Desktop
Mobile
Work like this is usually split between a developer, a UI/UX designer, a graphic designer, and a marketer. On this project, one person holds all four of those skill sets, so every decision came from someone who understood the whole project, not just their own part of it.
16
standards met, from code to marketing.
Business impact here is measured across 4 areas: Presence, Quality, Trust and Conversion. Together they cover how the business is found, perceived, and acted on.
One identity, positioned as an agency
Before
The same real capability and project work already existed, but with no dedicated destination of its own, it only ever read as one person’s personal portfolio, not an agency a business could formally engage.
After
A dedicated site presents that same capability under one focused identity, positioned specifically for a business looking to hire an agency, not just browse a personal portfolio.
Each project draws on a mix of disciplines: here’s how they came together on this one.
The tools and technologies that came together to bring this project to life.
The problems that came up while building this project, and what came out of solving them.
Building on a Stack That Had Just Shipped
Next.js 16, React 19, and Tailwind CSS v4 had all just been released, with far fewer examples and community solutions to lean on than more established versions, worked through directly via official docs and AI coding assistants.
Hitting a Perfect Google PageSpeed Score
Getting a green score across all four PageSpeed categories required careful optimization of image, JS, and CSS delivery across many device breakpoints.
The technical problems fixed while building this project.
Zero styling regressions from the v4 migration
PageSpeed green across all 4 categories
Images under 200KB
Bleeding-edge stack, zero client-facing risk
Before
Tailwind CSS v4 introduced breaking changes from v3 in how utility classes and configuration work, and with the framework having just shipped days earlier, any overlooked change could silently break styling across the entire single-page site.
After
Every breaking change was worked through directly against the official v4 migration docs before launch, so the site shipped on the new major version with its styling fully intact.
Before
Early performance was inconsistent across the four Google PageSpeed categories.
After
Continuous optimization of images, JS, and CSS delivery brought all four categories into the green.
Before
High-resolution images across the site, not just one section, risked slowing down every page.
After
Every image across the site is compressed to WebP and kept under 200KB, keeping pages fast without a visible drop in quality.
Before
Next.js 16 and React 19 had both just been released, with far fewer community solutions and examples to lean on than more established versions.
After
Working directly from official documentation and AI coding assistants closed that gap, and the experience made adopting the same major-version upgrades on client work later significantly safer.
