Learning in Public


My Coding Journey So Far

I’ve been dabbling in frontend design for a long time now. I taught myself HTML back in the days of frames, and picked up CSS over the years. I’ve coded a handful of websites using HTML and CSS.

I’ve used JavaScript a bit here and there. I did the 100 days of code challenge in 2020 and worked through the JavaScript lessons on FreeCodeCamp and some courses on SuperHi. But it never quite clicked for me. FreeCodeCamp was too theoretical. I understood how to use loops and arrays and different methods, but I couldn’t make the connection between what I was learning and actually using JavaScript to maipulate the DOM. SuperHi’s courses were a lot of fun and I did some really cool projects, but I was just coding along and never really felt like I got a solid understanding of the concepts.

A few months ago I started working my way through the Frontend Developer Career Path on Scrimba and this is where the pieces finally started to fit into place. They started with the very basics, so I finally understood things like query selectors and event listeners. And the projects are the kinds of things I might do in the real world. Plus, their interactive editor, challenges, and solo projects get you working through problems on your own, instead of just coding along with a tutorial. After all these years I finally feel like I’m in a place where I could open up a code editor and do a basic project using JavaScript.

Should This Designer Code?

In addition to dabbling in code, I’ve been working in tech as a product designer for the past 7 years. I love building things in Figma, but I often find that I get frustrated with features like autolayout that almost do what Flexbox could do, but not quite. Some of the interactive prototyping interactions are getting really complex, too. This is great for designers who don’t want to learn to code because they can make much more robust prototypes. However, I sometimes feel like the learning curve is steep enough that I might as well just double down and improve my coding skills and get a prototype that actually does what I want, rather than a close approximation.

I especially felt this when I decided to use Framer for my most recent portfolio. Like Figma, it’s close to coding, but it’s just not quite there. I ran into so may issues that I knew how to solve in CSS, but took me forever to troubleshoot in Framer. It was close to how things are done in Figma, but with enough differences that I had to learn yet another tool to poorly approximate Flexbox when I could have just been writing the Flexbox in the first place. The whole experience left me frustrated.

So Why Am I Writing About All This?

With my interest in both design and code, I’ve been finding myself drawn to roles for design engineers or design technologists that use both skills. These roles frequently, though not always, work with design systems, which is another area that interests me. I like building out reusable components in Figma and thinking about the various circumstances in which a component might be used. I recognize that I don’t currently have the coding chops or the design systmes experiences for this type of role, so I’ve decided I want to start working on some side projects to start developing those skills.

This blog will be a way to document that journey, to share my learnings and progress, and hopefully keep me accountable. I’m using a very basic blog template from Astro for now, with the intention that I will build this out into a much more robust site in the future. Stay tuned!