Service number 1: Auth

I wanted to add comments to this blog, which would require writing comments "as a service" in some respect which would allow me to embed the commenting and comments in the static pages provided by omg.lol. I started sketching that out, and realizes almost instantly, that means we need authentication.

To start things off I started researching passkeys (aka webauthn). This new technology has been getting more and more airtime in the blogs I read, also @rmondello has been getting me really excited about it in their toots over the last year or so, so I wanted to see if I could use that as my primary authentication mechanism.

After reading a bit about how passkeys are created and validated, and getting thoroughly confused, I decided to checkout the implementation that omg.lol uses. The auth system there uses passkeys as well, another reason I felt so at home when I signed up and started using the service.

omg.lol uses passkeys as an alternative to passwords, but still creates user accounts with emails and "link via email" authentication (passwords are optional). I decided to try and mimic this system, you can "login" by putting in your email and then clicking the link that was sent to you. Since I was following the lead of omg.lol, I decided passkeys would be something you could associate with your account after logging in (probably via a profile page of some sort).

I forgot to mention, I'm on a week long vacation between jobs. This time crunch is pretty real and the ultimate goal was to get something online before the end of the week.

Ultimately I didn't make it to my goal, but I got a basic system up that allows entering an email and will send you an email which you can use to prove to the system that you own that email address. After getting that implemented I realized... I should have stuck with Next.js. Having the login workflow require several page reloads and several different tabs, without any real JS, wasn't really helping me, it was just making the ux worse.

That's when I started moving the whole thing back to Next.js so that I can have a more single page interaction.

I decided to use Xata as my data store. I know the founders and they have a generous free tier, so I wanted to give it a shot. It worked really well, definitely saved me time and it was really nice to have the code generation and types that validated my ever shifting code.

Ultimately, the vercel serverless implementation is incomplete and the Next.js version is even more incomplete. Additionally, I really don't like the UX considering that I'm trying to get a little "engagement" from strangers who stumble across my blog. Entering your email, going to your email, clicking the link, then returning to the website is a pretty complicated workflow that people will likely need to execute several times if I'm able to get any sort of followers.

I'm hoping that instead I can try and avoid the whole oauth style flow, and instead embed the authentication in the page similar to how a stripe checkout embed works. I still think that email validation is a much more reasonable mechanism for validating users aren't just spam bots, and it gives me the opportunity to send users stuff via email down the road. Having this type of capability also allows users to recover passwords down the road if I wanted to add support for them.

I'm worried that I won't be able to use passkeys in an embedded style thing, I really don't want to figure out how to handle redirecting users correctly if I stick with this whole oauth style authentication. Not to mention that this is a pretty complicated thing to build for just my blog, and even more complicated to build in a way that other people could use it as well.

Stuff to think about. New job starts Tuesday! 🎉