woah so meta

WebDev is a weird one for me because it’s definitely something I’m passionate about, but it’s also my *job*. I’m pretty confident that aside from blog posts and random updates to this site, I won’t have any notable projects to talk about as I’ll shift back to my other hobbies (especially drawing).

Brief Glossary for Non-Developers

In lieu of a Marx and Engels-length footnotes section, I’m just going to frontload a few terms for anyone who isn’t in da biz.

My Specialties/Faves

If this were a resume I’d list off a whole bunch of things b/c as a “full-stack” developer, I’m at least *competant* at most every design language. But as a hobby (and when I have a choice professionally), these are my tools of the trade.

React & Angular

I started with Angular, learning at work, and then taught myself React doing some side projects. Nowadays I prefer React (partly because it’s the most popular professionally), but the design philosophies carry over pretty well. They’re both very opinionated, but I think I’m a better React developer because I started as an Angular developer.

Design Philosophy

Angular design encourages a stricter organization structure with a preference towards many small, simple components rather than larger, complex ones. Many React projects I’ve started on have been pretty bloated by comparison. Because components start as Javascript and then take in HTML for page rendering, devs tend to keep packing in HTML without considering separating things out.

Object-Oriented -> Components

Object-Oriented Programming is probably the coding concept that clicked with me the strongest. Treating things as Objects that can Do things and have things Done to them just makes a lot of sense.
Component-Driven Design takes that a step further and encourages compartmentalisation of functionality. It looks more organized, and means that to change the design or function of something on your project, you only have to change it in one spot.

Basically: “Will you use the same thing more than once? Make it a reusable component!”

HTML, CSS, and TailwindCSS

I really like classic HTML/CSS development. My previous “professional” site was made with 99% vanilla HTML and CSS just to see if I could. But I included Tailwind (new as of this website) because with component-driven development it just makes life so much easier.
I first learned HTML on tumblr by customizing my personal blog theme there. It’s a pretty intuitive and simple language. I feel pretty comfortable recommending it as a good starting point for someone interested in “learning to code”. Screenshot of my old professional website

AstroJS

This is new! It’s what this website is made with. I’m instantly a big fan–gives you all that freedom of ReactJS without the bloat of irresistable state logic silliness.

Is It Fun Though

Even though it’s what I do professionally, I’d still call webdev a hobby. Especially doing frontend design projects like this website. It’s a creative exercise with a logical underpinning, and that’s cool.
I’d say the biggest downside is that it’s hard to enjoy with friends. Aside from the finished product, there isn’t a lot here to share or *do* with friends.

The Appeal

The overall appeal of WebDev for me is the combination of Creative + Problem Solving aspects. It’s just super cool typing out logical things and having it output into something artistic or at least “cool looking”. That feels powerful.
I’m very pleased with this website, for example, for automating a lot of my text. This page is a Blog Post template file that translates Markdown into both nicely-formatted text and autogenerates a Table of Contents with links! That’s so cool.

As an example, this is the code that takes in headers from my blog post files, processes it, and formats it into the table of contents on the side:

---
import type { MarkdownHeading } from "astro";
import TextDeco from "./TextDeco.astro";
import ChiStar from "./ChiStar.astro";
interface Props {
  headings: MarkdownHeading[];
}
const { headings } = Astro.props;
const filteredHeadings = headings.filter((heading) => heading.text !== "Footnotes");
---
<nav class="sticky top-0 pt-4">
  <h3 class="text-3xl font-medium mb-2">Contents</h3>
  <ul>
    {
      filteredHeadings.map((heading, i) => {
        if (heading.depth > 1) {
          return (
            <li>
              <TextDeco url={`#${heading.slug}`}>
                <span class="text-sm">
                  {[...Array(heading.depth - 1)].map(() => (
                    <ChiStar />
                  ))}
                </span>
                <span class="text-wrap">{heading.text}</span>
              </TextDeco>
            </li>
          );
        }
        return (
            <div class:list={[" w-[75%]  bg-slate-200/30 p-0.5 mb-1.5", `${i===0 ? 'hidden' :'inline-block'}`]}></div>
            <li>
              <TextDeco url={`#${heading.slug}`}>{heading.text}</TextDeco>
            </li>
        );
      })
    }
  </ul>
</nav>

The Job

In my 7+ years of professional software dev work I’ve definitely had good days or even weeks where I’ve been excited about my work, but I’ve never been truly passionate about it. Maybe it’s just the communist in me but as a wage-worker I’ve never been fully compensated for the work I’ve done on products I’ve never cared for beyond the paycheque.

2017 Origins

Folks are often amused and confused when I tell them that my bachelors are in Biology and Religious Studies. Turns out there isn’t a lot of work for those!
While living in Seattle and working a very disappointing office job, I spent my freetime learning how to code.

Just like the tech bros said I should! 🙃

I tried to learn Python but hated it so much. Starting at 0, a loose scripting language where you need to read whitespace was just so unintuitive for me. I ended up starting with C# instead–s/o to university night class certificate programs!

Since earning that C# certificate I have never once coded in C# lmao. I got hired for it, then ended up doing Java instead (since they’re nearly the same) and just never went back. Oh well!

Backend to Frontend

The rest of my “story” isn’t all that interesting. I spent a few years doing Java¹ development for a company, and then had the opportunity to switch projects and do Angular². I really liked Angular, and enjoyed that project!
In my free time at home I taught myself React³ specifically because I kept hearing how “hot” it was as a job skill. Turned out I liked it a lot too.