Digital Gardening, “Abramov-Acolytes”, React+CSS Animations Fail, Timebox Side-Quests, AWS EB+SSL, Thailand, Rich Harris: A God Among Men

---

Hello! Welcome! 🙋‍♂️

Quick Note for Newcomers 👋

This is Week #4 in my "52 Weeks of Open-Source Adventures". Starting on March 6, 2021, I decided to start randomly roaming the internet and contributing one pull request to a different open-source project each week from all around the world. (I wrote a bit on why here.) So far, my travels have taken me to distant and exotic locales like The Philippines! And Singapore! And I've learned a ton at each stop (NextJS! Python linting!) but the true joy has been --of course-- all the newfound friends I've made along the way 😄. Anyway, if you're curious, tag along! I usually publish new posts each Tuesday; and with today's post, we're four weeks through with 48 left to go! Enjoy! 🤗

Also, quick note: No pull request this week but I thought it'd be useful to share this experience I had setting up SSL a few weeks ago. Don't worry if you see the word aws and it terrifies you. The description I provide is high-level and good to know for all newbies, IMHO. It's short and worth reading! In this post I don't dive into the nitty-gritty of configuring aws at all. (Though if you are curious, you can click into the repo for more details.)

---

April 9, 2021

---

Contents

• Three Thoughts This Week
  • CSS Animations in React (or not)
• This Week’s Contribution (AWS Elastic Beanstalk/SSL)

---

One

Moving forward, all of my future posts will be shorter and sweeter. Generally speaking, while I personally prefer reading, video and audio have long been ascendant and readers are, sadly, a dying breed. Thus, since it’s already a small miracle that people read at all in 2021, it’d behoove me to not finish off the survivors. Future posts will all be 1,000 words or fewer.

Two

I stumbled across Joel’s blog post this week on “Digital Gardening” (by way of Ben Congdon — they’re getting younger and younger! 😮). Both excellent bloggers. And both of whom make the same point: Even if no one else ever reads your blog/writing, I really suggest that you still blog publicly. While privately journaling is fine, writing publicly really forces you to crystalize your thoughts because you know they’re publicly out there. Don’t publicly blog for the audience. Publicly blog for yourself.

(By the way — reading Joel’s post reminded me of Paul Graham’s classically great post on essaying.)

Three

Finally, in my continuing misadventures this past week of “An Ancient Dinosaur Leans Modern Webdev in 2021”, I tried adding CSS transitions in React. Omg. The pain. Up until now, I’ve been a pretty well-behaved “Abramov-Acolyte” and have been dutifully trying to doing things “The React Way” but after reading up on “React Transition Group” and looking at dozens of lines of boilerplate and the prospect of importing even more mysterious/auto-magikal npm packages, I just couldn’t do it. I wanted to “do it the right way”; I really did. But I just couldn’t. 🙅‍♂️ (Sorry, Dan!)

This random guy on the internet understands:

Libraries and frameworks exist to serve me, not the other way around. Thus, I finally just gave up and ended up writing this abomination of code which I simultaneously find both abhorrent and pleasing:

And while I do properly use Styled-Components everywhere else in my toy app, here I just went off the reservation and:

All to accomplish:

(Also, please don’t @ me with useRef or forwardRef. I know.) The point I wanted to make today is that often when you’re coding, especially when you’re learning something new, you‘ll encounter dozens of unexpected obstacles. For instance, this past Sunday morning I sat down and expected to spend my time integrating Firestore Cloud Messaging into my humble toy webapp. But instead: I ended up going way off the rails and working on this React GUI issue instead.

If you like coding, it can be immensely gratifying to follow your curiosities and go off deep into rabbit holes like this (constantly learning/acquiring all that new knowledge! Yeah! 🎉🥳), but it’s also valuable to timebox your side-quests to ensure you’re not just perpetually tilting at windmills. As your project grows over time, you’ll find yourself consistently refactoring anyway so don’t be afraid to knowingly write “bad code.” Sometimes, it’s worth writing atrocious code if it saves you from getting bogged down. After all, maintaining one’s enthusiasm/momentum (and not quitting!) is virtue in itself too!

---

Open-Source Stuff

This Week’s Contribution

No pull request this week, but I did set up a GitHub repo with all of the configuration you’ll need to set up SSL (for free!) on a single-instance AWS Elastic Beanstalk instance. All of the credit goes to Marcos Escandell (of Spain!) who wrote the original article. The issue was that in the original code snippets he’d shared in his article, Marcos’s indentations had accidentally all gotten lost. (Edit: Now fixed!) So my contribution three weeks ago:

---

Motivation/Background

I’m not going to write too much on this because I think it’s a topic (though, maybe not?) a little outside the purview of CodeNewbie, but the quick summary is that nowadays when you deploy on Firebase, GitHub pages, Vercel, or Netlify, it’s pretty standard to automatically get something called SSL (Secure Sockets Layer) which — in simple terms — ensures that there’s no undesirable third-party eavesdropping on the line between you and whoever’s serving you content. So, for example, when I navigate to my GitHub repo, I see the comforting padlock icon in my browser’s address bar. Clicking on it yields:

Wohoo! My “Connection is secure!” 🤗

In 2021, just about everywhere mainstream you visit, you’ll see SSL enabled. However, believe it or not, this is not the natural state of the universe! In fact, let’s visit the homepage of everyone’s favorite research director:

Sure enough, no green padlock here! In fact, Google Chrome even displays a very prominent “Not secure” notice informing you and reminding you to not enter any sensitive info (credit cards, passwords, etc) on Peter’s webpage.

Now, to be fair, if your site is entirely readonly and visitors don’t care that someone may be observing them on the site, than SSL is unnecessary. In fact, enabling it would just extraneously make the connection heavier (a handshake needs to happen, so forth) which does mean extra latency.

But in 2021, for most consumer use cases, I’d argue most people like seeing SSL enabled. Even if they have no idea what it is, we like seeing green padlocks and being told we’re secure! 😀

Well, when you deploy on AWS’s Elastic Beanstalk, unlike Heroku/Firebase/everyone else, AWS EB doesn’t automatically come with SSL enabled! Oh no, AWS is for the pros. The people who care about being “as close to the metal” as possible. You don’t run a third of the internet without offering everything under the sun at every single granularity imaginable.

Anyway, jumping to the end: While AWS does offer paid options, it’s 2021 and no one enjoys paying something that they can get for free! So I did some Googling/SOing, eventually found my way to Marcos’s post, and after some trial and error:

Tada! The SSL padlock on AWS Elastic Beanstalk!🎉🥳

(To be sure, I’m glossing over a few details here, but one day I’ll more likely than not write an entire post on AWS. After, if you’re a CodeNewbie just getting started in 2021, you’ll need to know it all! 😁 So stay tuned!)

---

Finally, as a new tradition starting with this post, I’ll leave you with two bits of inspiration for the upcoming week:

First

This 2017 interview with Sindre Sorhus — A Norwegian full-time open-sourcer who now lives in Thailand and solely lives off of GitHub donations.

Quoting from his interview:

Canceling an interview with Google and buying a one-way ticket to Thailand! What a boss! 😎👏

---

Second

Rich Harris, a New York Times graphics editor, makes a compiler! To quote a random YouTube stranger 😂:

Anyone can code! Anyone! 👍⚡🌟

---

Alrighty, and that’s a wrap! Be kind and good to each other; see you next week; same time, same channel! Open-Source Avenger out! 😄🚀✨