First off: HAPPY DOCTOR WHO DAY! The show is celebrating it's 61st anniversary today. The first episode aired November 23, 1963, just a day after JFK was assassinated, and C.S. Lewis died of kidney failure. Neither of them had the chance to enjoy the thrills of Doctor Who.

Haven't posted for a bit partly because I've been agonizing over whether I could convert this blog and another website over to using React JS. It's been a few years since I learned the basics of React, and to say I'm rusty is an understatement. Javascript causes me anxiety, as does any and all associated frameworks and libraries. From what I remember, React wasn't so terribly difficult, but it did involve several intermediary steps such as installing a few different dependencies, and spinning up a local server to actually see the fruits of your labor properly.

I was reading up on React in a physical book and watching some YouTube videos, getting closer and closer to the point at which I might have made a test site. But then...

Quick aside: I recently jumped on the BlueSky bandwagon and have been enjoying it more than Threads. Getting frustrated with the idea of relearning React, I posted the following:

Beginning to think maybe I understand enough web dev stuff/javascript so that I could start a React JS website, but also wondering why there isn't any kind of component system already in place with HTML and CSS? I don't need React for much, really; I just don't wanna copy/paste HTML on every page.

Followed by:

Like, there's already the CSS thing for ::before and ::after elements, but you can only add plain text. WHY ISN'T THERE AN ADJACENT THING TO ADD HTML IN THERE? Why is that so hard?! Basically, is there an alternative to an iframe?

which got me thinking. Maybe there darn well is such a thing. And, through the process of simply thinking out loud online, I led myself to WEB COMPONENTS. They utilize JavaScript, sure, but not in a way where I really have to understand each bit. Basically I can copy/paste and not have to change anything in the JS.

Game changer. No installing weird dependencies, no spinning up local servers. I don't need any of my elements to be reactive to user input or any such malarkey, I just need some reusable blocks of HTML code, such as the unchanging footer, and header, and suchlike. There's not even so much that needs it on this blog, but it's wonderful to only have to update ONE file, rather than the ever-increasing number of posts I create. Heck, it's simpler than CSS when it comes down to it.

I completely bypassed creating a shadow DOM, as most tutorials encouraged. My understanding is it's useful for more complex websites. The benefit is that your component becomes entirely contained, with its needed CSS and everything. Well, for me that's just a pain because it seems to add an unnecessary step. I'll just not use the shadow DOM, keep everything pointed towards the one CSS file, and we're golden.

React, I think, would still be the better way to go. I've noticed the browser can take a split second to activate the related JS component files, and as such the website appears broken for the briefest of moments. React wouldn't do that, so far as I remember. React is meant for creating one page apps and websites. One website file, with some elements never having to reload at all, only your component elements as needed. React is pretty slick. But it does have more steps involved on the backend and web components are doing the job as intended for me so far. Happy day.

I feel just that little bit more comfortable now writing a bunch more posts and knowing I won't have to maintain consistency of certain blocks of HTML anymore. Add something to the footer? Update one file, not every file. Sweet relief.

But also this is just a reminder to myself that thinking out loud, to the internet or to somebody willing to listen in your life, can pay dividends. This is why Sherlock kept Watson around; didn't matter what crackpot theory Watson might dream up, Sherlock just needed someone to bounce ideas off of.