Journal Search - webdev

This is just an update to see if I made my “poor man’s CD” script work properly. Carry on. :3

I am currently working on a new blog post that should go into more detail on most of this stuff, but I figured now would be a good time to break the news:

I’M BACK ON HETZNER, BITCH!!!!!!!!!!

…because I would much rather pay $7/mo to keep this site up than $14/mo, especially when I’m still looking for a tech job.

With the switch of VPS hosts (again), I figured now would be a good time to start working on Dockerizing Everything™, sooooo now all of my services run off of Docker Compose, including this website! I still haven’t figured out a good CI/CD solution yet, but it seems like moving from Docker Compose to something like Ansible opens in a new tab would be a good place to start.

Again, most of the discussion about this will come in a blog post that I am currently writing up and should be live shortly-ish-maybe-i-hope.

I am also in the process of finally moving my desktop over to Linux full-time. I’m split between just making it a home server with Proxmox VE opens in a new tab and trying out Omarchy. opens in a new tab Vote now on your phones (by shooting me a message yelling at me about how both of these options suck ass and your setup is the objectively superior one).

Finally, because I am eternally bored being at work and following the YouTube boycott, I decided to finally add tags to my journal entries. Now, each journal entry has one or more tags associated with it, and clicking on one will bring up all of the entries with that tag. For example, if you want to see all of the journal entries where I actually talk about myself for once, look up dox. Why is it called that? I wonder :3

Since I’m participating in the YouTube blackout (more for my own sanity than anything else), I have to use an even worse service for today’s song. Whoops! You ever imagine if Metallica was a prog rock band from Australia? No? Well, imagine this. opens in a new tab cyaaaaaa

Did y’all survive Independence Day weekend? I think I did. I hope.

I think it may be time in the next few days to perform my server move from Vultr to Hetzner… again. I switched back to Vultr because I was not very impressed with the performance I was getting from Hetzner. Notably, I would have to shut down my webserver in order to rebuild the site when I was still using Next.js. There is a trade-off for better performance, though… I am paying double what I paid Hetzner per month for the privilege. Ouch.

So, considering I still don’t have a job, I should have made this move before I moved (which is another thing to add to the “things I should have thought about before I graduated and moved multiple states away” list) — but now that I am actively coming up on a situation where I need multiple separate VPS’s in order to do what I want, it would be much more cost-effective to go back to Hetzner. So… that’s what I’m going to be doing soon.

If y’all have any tips on how to build a CI/CD system for sites like mine (Astro + NGINX reverse proxy) or how to Dockerize Astro sites, specifically as part of a Forgejo Action (i swear to god it has been a lot harder than it needs to be to make a containerized setup work), please reach out opens in a new tab . I am just a widdle gal and I don’t know what the fuck I’m doing and everything is just way too confusing.

Finally, right now I am writing this journal entry in iA Writer opens in a new tab , but I think for my next entry I should be crazy and write it using a Neovim Markdown extension… Technically, since they’re written in Lua, I could make my own extension to add basic MDX parsing for the components I use (for example, making MDXCallouts look a little more like they would in the browser)… which would also be a good excuse to start thinking about how I could represent these components in plaintext or Geminispace opens in a new tab (remind me to make a blog post about Geminispace one day like I’ve wanted to for a whole year now lmao).

oh and pick up the phone, show me it was real opens in a new tab for me okay? thanks

Good news: the sharefeed is now an Astro content collection! Thanks to the recent upgrade, it was a lot easier to turn it into a content collection.

Bad news: due to the re-formatting of sharefeed entries I had to do in order for this to work, I might have made your RSS readers see all the entries as new items. Whoops.

More good news: I’ve now got a basic Micropub implementation going that can create, update, and delete journal entries as well as create new sharefeed entries. Using Postman opens in a new tab to test the API, it just works!

More bad news: turns out if I want to make the Micropub implementation work the way I want it to, I need to make sure that both the journal and sharefeed pages server-rendered pages instead of prerendered static pages. I don’t think this will impact performance too much, but if I didn’t do this, just an endpoint on the webserver wouldn’t be enough to automatically update the site.

Eventually, I would want to make this stuff more “isolated”, possibly with a separate Express opens in a new tab worker… but the main concern I have right now is setting up proper OAuth2 Bearer Token authentication. Ideally, I would set up a completely different server for authentication… which costs money. Right now, I just want to get everything else working, then put the project on the back-burner until I get the auth system figured out (since I’ll also need that auth system for the comments section I plan on implementing).

Finally, fun fact: This post was actually written in iA Writer opens in a new tab , transferred to Postman, then sent to my dev server through the Micropub protocol. Yay!

Here’s the obligatory song link opens in a new tab . byyyyeeeeeeeee

A day later and I did the tedious part: converting the big journal page into a series of individual .mdx files in an Astro content collection. That was… fun.

It turns out that Astro slipped an overhaul of their content collection system right under my nose when I wasn’t looking. In their 5.0 update, opens in a new tab they upgraded the system into a full-fledged “content layer” ( heyyyyyy opens in a new tab ) that supports processing all sorts of #content and #data from literally anywhere you want. Part of this update was literally giving you the freedom to process the data however you want, replacing the weird type attribute with a new loader attribute that you can slot either the two built-in functions (representing the two old type’s) ooooooor your own bespoke function for whatever content you want to work with. It’s actually really cool… and slightly breaking compared to the old system. Whoops. So, just to be on the safe side for the future, I migrated from the old system to the new system.

After that, it was pretty simple to get the new journal set up… it was just really tedious to make all the new individual files and copy all of the content over. Honestly, it kinda made me wish I had a generative AI agent handy, but I would rather move slowly and ensure that everything works right than move fast and break everything with AI slop. I also decided to make the now and todo sections of the journal their own files for later use with Micropub opens in a new tab . This way, I can (eventually) not only make new journal entries outside a code editor, but I can also update those journal entries and the now & todo sections outside a code editor!!! How sick would that be???

Now that I’ve done all that, though… look!!! Pages!!!!! It isn’t just one giant page anymore!!!!!! Currently, I’ve got it set to display 10 entries on each page, but I might tweak that later. I’ve also got it set up to only display the now and todo sections on the first page, and only display the really old entries section on the last page. Pretty slick, huh?

My main worry when implementing this was that all of the async stuff I had to add to get this to work would mean excess loading, but I think I can solve that by making this page static instead of server-rendered (the pages are precompiled with all of their content, so when the browser requests the page, all the server needs to do is hand the browser that precompiled page instead of having to go and fetch all of the content it needs first). All of the blog posts are handled this way, so I figured it would be worth it to do it for the journal page as well.

Also, while I haven’t started implementing it yet (I’m waiting for the weekend to do that), I have started looking at the Micropub specification… opens in a new tab and it seems like a really good “baby’s first protocol implementation project”. Everything is very straightforward & well laid-out, and both the h-entry and h-cite microformats seem great for what I am personally looking for. The Micropub protocol itself seems pretty loose when it comes to what you can do through it: as long as the client and the server agree, you can exchange whatever data you want. So, for instance, I can staple a note field to my h-cite entry for use with the sharefeed and hope none of the IndieWeb opens in a new tab people get mad at me for sacrilege. Alternatively, I could make the in-reply-to field in my h-entry its own h-cite object so I use the same base microformat for both journal entires and sharefeed posts, but I think that might be a bit too tryhard… I’ll figure it out once I get a base implementation going for journal entries.

Finally, I made some other miscelaneous changes lately. For example, I got rid of that stupid external link icon and replaced it with a more subtle change: all links (within markdown, at least) now have underlines, and they are dashed if they are internal links and dotted if they are external. Will anyone notice this? Probably not. Do I need a better solution? Yes. But that’s for later me.

also here’s a cool raggae song opens in a new tab kbyyyyeeeeeeee

I think I’m finally starting to get to the point where editing a big long Markdown document for my journal is starting to make less sense. The way I’ve got things set up right now, it’s hard for me to publish my journal entries in my RSS feed, as I would need to scrape this document for date headings. However, if I use Astro’s built-in “content” system instead (like I already do with all of my blog posts), I will be able to parse those MDX files just like I do with my blog posts when it comes to RSS. It will also mean I will finally be able to build pagination into this page very easily: since each journal entry would be its own “object” instead of a part of one massive document, I can make the actual journal page whatever I want and process each entry however I want.

It would also mean I could technically build some sort of API to automatically submit journal entries to my site whenever I want, like through Micropub. opens in a new tab Since MDX is just plain text when you boil it down to its bare elements, it would be trivial to send that plain text through Micropub, save that text to a new .mdx file, then recompile the site to serve that new entry within a few minutes. It would also also mean that I can use Micropub to produce sharefeed entries as well, but that may require wrangling JSON file editing (unless I also times 3 migrate the sharefeed into its own content collection and unify every type of #content on this site under one spaceship roof).

I’ve added my plans to the todo list up top so we can all keep track of what I’m doing… which reminds me, I should probably finish that unlisted article I linked up there, huh? I’m also not sure exactly what I’m supposed to do with the now section… I mostly use it for shitposting or random status updates whenever I touch this page. I get the feeling that I’m supposed to do more with that section, like listing out the books I’m reading (none atm) or what projects I’m working on (this site, trying not to starve)… but I don’t really have much to put in there other than. whatever.

Anyways, I got this indie rock song opens in a new tab that I think I first heard in 2018-ish stuck in my head again so I wanted to share it.

Finally, if you have read this journal entry, you are legally required to email me opens in a new tab with the word “pookie” somewhere in the message. If you do not do so within 24 hours, I will be very cross with you. opens in a new tab Thanks! :3

I made a cool little thing. It’s called the Sharefeed Entry Tool opens in a new tab and it’s my way of decreasing the friction between me seeing something cool and logging it in the sharefeed . It auto-generates a JSON object with the url of the webpage, the current date and time, and if it detects metadata it can grab on the current page, all the other data I would need to make the sharefeed entry. It currently supports all Substack websites, Medium, YouTube, GitHub, and more… and I only made it in a day or two. Without AI.

I really want to make a blog post about it soon, so I’m going to hold off on rambling about it too much for now. Instead, I’m going to share this cool ambient piece with a real Rhodes opens in a new tab and try to calm down after a slightly stressful day. Mwwwah, love you, bye.

Welp, that didn’t work.

I tried creating a CI/CD system with Docker containers and Forgejo Actions… and it worked once. Now it doesn’t work.

I’m going to revert back to my old method, which involves a local node server managed with PM2, and figure out why Docker refused to cooperate later. I made this system so I didn’t have to think about pushing changes, but since I clearly have to think about this a lot more with this system, it just isn’t worth it.

In other news I just had to spend $600 to make my car usuable so if anyone wants to send me a few bucks on Ko-fi opens in a new tab I would appreciate that so much <3

This entry and the entry below it are both new now since the update that contained it never went live. Feel free to read that one too!

Finally, here’s a deep cut from a legendary rock band’s lesser-known albums. opens in a new tab ktnxbye

As I said in my now entry, my hyperfixation has returned to this website. I do not control the hyperfixation, and I wish it would hyperfixate on class instead, but since this is still somewhat productive, I’m okay with it being here for now.

The main thing that I did was add my first “interactive” element: the accordion.

It looks like this!

When you click or tap on the box, it unfurls into a section that can contain literally anything I want… like an image of another accordion!

A screenshot of the "todo" accordion I currently have at the top of this page. Unchecked tasks include "Potentially add an extra 'new-tab' flag to MDX links (a space & '+'' after the link in the parentheses? that might be too complicated to implement nicely tho)" and "Set up a dev version of this site & start implementing the account system!". Checked tasks include "Make external links open in a new tab. This should be pretty easy to implement." and "Automatically insert an 'external link; icon on links that open in a new tab."

However, there’s a problem with this: it requires Javascript to function. I want my site to be completely functional without Javascript. So, there is a fallback for if JS is disabled.

A screenshot of that same "todo" accordion but with Javascript disabled. It just looks like a regular section of the page, but with a special icon showing that it was meant to be an accordion.

Now that I know how to make stuff like this and give them noscript fallbacks, I feel much more confident about “Phase 2” of my site (implementing a comments section and account system).

The prototype version of my site with an accounts system should be coming out by mid-December. It will likely be hosted on a completely separate server (not on Hetzner lmao) and require manual approval to sign up. I’ll make sure to give you a little badge next to your name in the comments if you help me out with beta testing, though :3

Currently, my ideas for Phase 2 consist of the following:

• Accounts will not use passwords. There will be two authentication methods available: passkeys and single sign-on. SSO is the easier of the two, as it just refers to using another site to log onto this one (right now, Google, Microsoft, and Discord are the sites I’m thinking of using for SSO). Passkeys are more secure but not fully ready for prime-time and obscure in documentation. I’m implementing them partly as a challenge to myself and partly as a way to yell at everyone else “HEY!!! THESE ARE COOL!!! WE SHOULD USE THESE MORE!!!!” I’ll be sure to make a guide on how to sign up with passkeys and/or add passkeys to an existing account for those who are not in the know yet. Eventually, I will want to fully move my account system to only use passkeys, but I recognize that I can’t do that now with the current state passkeys are in.
• Even after the beta, I’ll likely have account signups operate under a manual approval / application system. Basically, you’ll have to prove to me that you aren’t a bot or a Nazi, and if I believe you, I’ll let you in. This is my way of preventing spam and exploitation of my site.
• I want the accounts system to be flexible enough to where they can be used for things other than just my comments section. If I ever make a forum on my site again, the forum will use these accounts. I also want accounts to have their own profile pages so if you see someone in the comments you think is cool, you can check out their profile and follow them on other places. I want the comments section to be its own sort of community, and stuff like profile pages helps reinforce that aspect of community imo.

Is this way too much effort for an obscure blog’s comments section? Yes. Is this just a way for me get more portfolio work done and justify it with a lofty humanitarian goal? Yes. But I think it will be worth it. It will be another thing to set my blog apart and hopefully encourage more people to check it out… and possibly give me money opens in a new tab .

Anyways HA IM NOT GOING TO GIVE YOU MUSIC TODAY, THE NUKETOWN EASTER EGG DROPPED AND IT’S GREAT opens in a new tab ok cya

I did it. This entire site is now running on the Astro web framework opens in a new tab instead of Next.js.

There were two main reasons why I chose Next.js for this site originally:

1. I already had some experience with it in an older iteration of my website refresh (which you can see in this blog post ), and
2. It is by far the most popular metaframework on the web opens in a new tab right now.

Both of these made it easier to get started with Next.js, and #2 made it more appealing as a learning / portfolio-enrichment experience.

However, along with these two upsides, two big problems conversely arose with Next.js:

1. Building a Next.js website (which I didn’t think I had to do when I chose Next.js!!!) takes a lot more resources than I thought it would. In order to rebuild my site and make my changes live, I need to take the website down first on my basic bitch $7 VPS from Hetzner (put a pin on this, I’m going to talk about it later).
2. Because Next.js is designed primarly for single-page applications (SPA’s), when you click on a link to another page on the site… nothing happens. No loading bar shows up in the browser. The site itself doesn’t even show its spinner for a bit. This garbage time can be a fraction of a second or multiple seconds depending on how shitty your internet is. And I hate it with a passion. And there’s no way to fix it without hacky workarounds. opens in a new tab Pain.

The second problem can absolutely be fixed with Astro since it primarily relies on either static page generation (SSG) or server-side rendering (SSR), both of which make the browser show a loading bar immediately upon requesting a new page like it should. The first problem is still TBD because I haven’t pushed this site to prod yet, but I have a feeling since Astro’s whole entire shtick is SSG, it should have better optimization on that front.

Since I deliberately made this site text-focused and light on visual complexity, making everything work on Astro was surprisingly easy. There was of course a learning curve with all the ways Astro does things differently, but most problems I ran into were able to be resolved in the same sitting I found them in. I was even able to reuse some of the libraries I was already using to make the porting process easier. All in all, this site should work pretty much the same as it did under Next.js… but better opens in a new tab . (I know, fuck this character and fuck this show but i think this meme fits here ironically lol)

The true test for Astro will come when I deploy it, though. I have never actually deployed Astro before, but since it uses (p)npm for running deployment commands, it should be easy to automate with PM2 opens in a new tab like I already do with Next.js. I hope it uses less resources than Next.js so I can actually leave my site running while it’s updating, but time will tell.

The simplest way to fix that problem, of course, is to throw more money at the problem by upgrading to a better VPS. However, due to issues with censorship of “pornographic content” opens in a new tab (parts of this article are a little sus but the big idea of “if you host a fediverse instance that doesn’t completely ban nsfw content, you could get rocked by Hetzner” is scary to me), I don’t really feel comfortable staying with Hetzner. I’ve used Vultr before but they’re pretty expensive, so I might just say fuck it and move back to Linode lmao.

Hopefully, all of this change will be for the better and not for the worse. I’m rapidly running out of energy and I’m suddenly feeling very weird for no reason so I think I need to stop writing lol. also SOMEONE’S USING BONE CONDUCTION HEADPHONES RIGHT NEXT OT ME AND THEY’RE ORANGE AND THEY’RE USING EAR PLUGS WHAT IS THIS ABSOLUTELY INSANE STRAT I NEED TO INVESTIGATE THIS (one day)

right music link uuhhhhh here’s something that was in my watch later feed for a billion years opens in a new tab ktnxbye