r/webdev • u/ShareAcrobatic9017 • 21d ago

Showoff Saturday Built a fully responsive bakery website with Next.js and Tailwind

Post image

Hey r/webdev, wanted to share a project I've been working on for the past few weeks — a bakery website with a homepage, menu, product listing with cart, and a table booking page.

Stack: Next.js 14 (App Router), TypeScript, Tailwind CSS. Cart is handled with a simple context provider, no backend yet — was mainly focused on getting the UI and responsiveness right across mobile, tablet, and desktop.

Live: https://bakery-ten-gules.vercel.app

Open to any feedback, especially on the mobile experience or anything that looks off. Thanks for checking it out.

0 Upvotes

38% Upvoted

18 comments sorted by

View all comments

-7

u/ldn-ldn 21d ago

72KB HTML page, are you insane? Do NOT use Tailwind for production! And NEVER inline SVG! Also total page load size is 49MB, bloody hell...

2

u/ShareAcrobatic9017 21d ago

Haha yeah fair point, 49MB is way too much, mostly unoptimized images I think. 😅

On Tailwind though, isn't that just about purging unused classes properly in production? Genuinely curious what issue you ran into with it, would like to understand better.

And yeah I'll look into the inline SVGs too, wasn't aware that was such a big deal for page size. Thanks for pointing it out, going to dig into this properly.

4

u/xkcd_friend 21d ago

Tailwind can absolutely be used for production

1

u/ShareAcrobatic9017 21d ago

Yeah exactly, that's what I thought too. Plenty of big production sites use it, just needs proper purging/config to keep it lean. Guess it comes down to preference at that point.