welcome to nezu.world v2~
hello~ hello~ welcome to nezu.world… version 2~! :3 a lot has changed… mostly under the hood tho~ let’s take a look~
how i overengineered my site~
i’ve completely rebuilt the site’s backend and frontend~ nezu.world v1 was a statically-generated HTML site built with jekyll… in order to add/edit content, i had to fire up the dev server and write code—mostly markdown, but very messy markdown with HTML sprinkled in everywhere… it was pretty annoying to manage, and i constantly ran into issues with ruby/rubygems/bundler—dependencies randomly breaking and preventing me from even building the site, etc.—so i didn’t update the site as often as i wanted…
the new site is a sveltekit app that fetches data from a sanity CMS~ meaning, the content is completely separate from the frontend code…~ all portfolio entries, artworks, blog posts, etc., are stored in the “sanity content lake” (silly name…) as JSON data—and the sveltekit frontend fetches this data as-needed using GROQ queries in its load functions. (statements dreamed up by the utterly deranged…)
what all this crap^ means is i can now update the site’s content (add/edit/remove posts etc.) anytime, anywhere~ i just log in to my sanity studio admin dashboard and edit everything with a GUI~
it took a ton of work to get this all working properly, and there’s still some work to do, but as a result i can now update this site way more often~ i’ve already uploaded wayyy more art here than v1 ever had~ including a lot of NSFW art i don’t feel like sharing elsewhere~ lol~
“the stack”
after searching for ages and trying different options, i settled on svelte and sveltekit (component framework and app framework, respectively). i was frustrated with jekyll’s lack of flexibility as my site grew—e.g., the “posts” category acting differently to other generic categories, making tagging super annoying to implement, etc… initially, i tried other static site generators like astro and 11ty, but quickly ran into the same frustrations… i wanted room for more flexibility and composability… i then tried to learn react and next.js, since they’re both widely used and i liked the idea of building the site from reusable modular components… the sheer amount of boilerplate broke my mind though, so i quickly gave up… (the conceptual leap from parsing YAML frontmatter with liquid templates to data fetching using server-side javascript was… uhh) additionally, react is super bloated and slow—react apps have to load the entire react runtime itself, bloating bundle sizes like crazy… i went for svelte, which feels much closer to writing vanilla HTML/CSS/JS, and is much lighter than react—since svelte compiles your components to plain JS and doesn’t bundle a runtime… also it has a great tutorial which helped me get started~ i strongly recommend svelte~ as i developed a better understanding of these tools, i realized they’re mainly designed for dynamically fetching external data from a CMS or database, rather than just displaying static HTML pages… i started looking into different CMSes and settled on sanity for its ease of implementation~
tl;dr what’s changed
- art gallery completely revamped—now filterable by year, characters, media type, and content warnings
- portfolio entries can now have subpages (and it actually works properly this time)
- navigation should be snappier (client-side routing and data prefetching)
- dark mode (follows system theme)
- the cute flowers on the side are also visible in narrow viewports now, and they no longer get fucked up by non-overlay scrollbars
- added the blog (hi)
- the top navigation bar now has breadcrumb links, making it easy to navigate back up to a page’s parent route (also the font is a more readable size… and it has a cute bottom border that appears when you scroll~ lol)