u/Brief-Industry-7012

Got tired of not having a decent place to look up stats and info for PvZ Battle for Neighborville, every wiki out there felt outdated or scattered, so I just built my own: pvzbfn.com

The interesting part for me was doing it with zero backend and no database. All the content lives in JSON files that get consumed on the client side, so it's basically a static SPA built with Angular 18. Turns out that's more than enough for a content-heavy site like this if you structure the data right, and it's free to host and stupidly fast.

Also spent a good chunk of time making the stats not look like garbage spreadsheet tables, ended up using SweetAlert2 to turn them into modals instead, which honestly made a bigger difference to the UX than I expected.

It's live and usable now, still adding content little by little. If anyone here has done a similar no-backend approach for a data-heavy site I'd like to hear how you structured it, curious if I'm missing a better pattern than what I'm doing.

Link: pvzbfn.com

Got tired of not having a decent place to look up stats and info for PvZ Battle for Neighborville, every wiki out there felt outdated or scattered, so I just built my own: pvzbfn.com

The interesting part for me was doing it with zero backend and no database. All the content lives in JSON files that get consumed on the client side, so it's basically a static SPA built with Angular 18. Turns out that's more than enough for a content-heavy site like this if you structure the data right, and it's free to host and stupidly fast.

Also spent a good chunk of time making the stats not look like garbage spreadsheet tables, ended up using SweetAlert2 to turn them into modals instead, which honestly made a bigger difference to the UX than I expected.

It's live and usable now, still adding content little by little. If anyone here has done a similar no-backend approach for a data-heavy site I'd like to hear how you structured it, curious if I'm missing a better pattern than what I'm doing.

Link: pvzbfn.com

https://codepen.io/programoreno/pen/dPNVwJe

I kept forgetting the exact syntax for conic-gradient and repeating-radial-gradient so I ended up building a little reference page with actual rendered examples instead of just reading MDN for the tenth time.

It covers linear, radial, conic, and the repeating versions of each, plus a section on layering multiple gradients together (like the dark overlay trick for background images) and a pie chart made purely with conic-gradient stops. Every card has the rendered result next to the exact CSS, and I added a copy button so you don't have to select text manually.

Also threw in a color palette section at the bottom with all the hex values used, in case anyone wants to steal a combo.

Curious if anyone has gradient tricks I'm missing, especially around performance with multiple layered radial-gradients, I haven't stress tested that yet.