How I Built a Baby Name Generator With 1,200+ Names Using Next.js and Zero APIs

Most baby name sites are slow, bloated with ads, and built on decade-old WordPress templates. I wanted to build something better — fast, beautiful, and genuinely useful. Here's how I built BabyName...

By · · 1 min read
How I Built a Baby Name Generator With 1,200+ Names Using Next.js and Zero APIs

Source: DEV Community

Most baby name sites are slow, bloated with ads, and built on decade-old WordPress templates. I wanted to build something better — fast, beautiful, and genuinely useful. Here's how I built BabyNamePick with Next.js, static generation, and a hand-curated database of 1,200+ names. The Architecture: Stupidly Simple No database. No API. No CMS. Just: A single names.json file (1,200+ entries) Next.js App Router with generateStaticParams Vercel for hosting Every name gets its own statically generated page at build time. Every category page, every letter page, every blog post — all pre-rendered HTML. Why this works: Google loves fast, static HTML. Our pages load in under 1 second, and Core Web Vitals are green across the board. The Data Model Each name entry looks like this: { "name": "Elara", "meaning": "Shining light", "gender": "girl", "origin": "greek", "style": ["mythological", "celestial"], "popularity": "rising", "startLetter": "E" } Simple, flat, and fast to filter. No relational comp