How To Become A Software Engineer: Doing To Learn (Intro pt. 2)

In general, I divide the journey of becoming a competent maker of software into the following steps:

1. Basic HTML + CSS: understand the language of the web

2. React, ES6 JS, npm: get comfortable with the tools of modern frontend development

3. MongoDB, Express: learn how to set up a backend to actually power an app

In terms of approach for tackling each of these steps, I'm a strong believer in doing to learn, i.e. project-based learning. Here's what I mean:

When you're at the very beginning of learning something, it can be helpful to use tutorials. If you've never seen HTML and CSS before, taking Codecademy's intro course is a pretty good primer. When I'm exploring a new framework or technology, the first thing I do is look up a rigid tutorial and at least watch through it.

However, the goal of this early stage learning is to move to a real project as soon as possible. A real project is something that actually matters to you, with actual stakes attached. For example, with HTML and CSS, focus your efforts on building a personal website for yourself as soon as you are able, and even projects for other individuals and organizations. This is exactly how I first got into web dev, and built my skills up: by making a personal website, and continuously iterating on it. My first React project was SZPT, an app I launched on ProductHunt and use almost daily still.

At a high level, the benefits of working on a real project as opposed to following a rigorous curriculum are threefold.

1. Exposure to real-world factors and tasks. For example, importing fonts; using the browser console and style debugger; dealing with browser caching; setting up a dev environment and running things through your terminal. You don't get this kind of exposure in a sandbox environment, or following rigid step-by-step tutorials.

2. Development of problem-solving intuition. In a course, you might learn what divs, flexbox, and fixed positioning are, but they are concepts to memorize at the same level as everything else. When you actually get to building a navbar or mobile responsive layout using CSS on your own, and you do it a few times, you'll start to recognize what rules actually matter, how they work together, etc. This intuition is what actually makes someone a competent dev, not how many tutorials they've run through.

3. Organic drive to learn and improve. Building your personal website is completely different from building a tutorial project that will sit in a private GitHub repo for eternity. Outside of any dev considerations, you'll constantly have ideas for how to improve your website: features to add, tweaks to make, etc. This organic drive is much more powerful than any tutorial series. I first learned jQuery (bit of a throwback 😆), for example, because I wanted to add an image slider to my website. It wasn't part of any tutorial sequence; it was something I wanted to do, and so found the appropriate resources to learn how to.

Thus, the first project I'm tasking Natalie with is to rebuild her personal website in raw HTML and CSS. Frontend and backend will be similarly project-based, building out something public and actually valuable to Natalie.

Back to the first part:

Go on to the third part: