I'm not going to get into the details of my story - in short, I liked making websites as a kid, but I went to culinary school and worked in the restaurant industry for nearly a decade. Eventually I needed out, and I decided on making a career out of web development. Despite only knowing some basic outdated HTML and CSS, I wanted a new life and I wanted it without going back to school and getting a degree, or paying for a bootcamp.

I see people ask all the time what they need to know to become a web developer, how long it takes, what they'll make, and so on. It's hard to have all the answers to those questions, but I can share my own experience.

So I present to you a list of all the concepts, libraries, frameworks, and technology I've learned over the years, in the order I learned it, with links to the side quests and articles I've written about them. Although I'm trying to write it in order, there is some overlap.

I'll try not to make too many assumptions, but this list is not meant to be a deep dive on any topic - although many of the links are!

Note: Some of the earlier articles may be amateur and have information that I wouldn't necessarily put into an article on the subject if I wrote it today.

I made my first websites in the late nineties by viewing the source of sites I landed on in Netscape Navigator (a browser), copying the HTML into Notepad (a text editor), and uploading the pages to Geocities (a web host). HTML, text editors, and hosting most likely seem like second nature to many of us, but like everything else related to computers, it's not inherent knowledge, and it's a hurdle to get through as a beginner. I just happened to do it early enough that I wasn't even aware I was learning.

Here's what I learned in that period, although since I learned by doing, I didn't know the proper terms for many things:

An idea of what HTML (Hypertext Markup Language) is - the very first step to doing anything related to web development.

(Hypertext Markup Language) is - the very first step to doing anything related to web development. How to view the HTML source of a web browser (Netscape Navigator, and later Internet Explorer).

of a (Netscape Navigator, and later Internet Explorer). How to create and edit an HTML file with a text editor (Notepad) and save it locally on my file system (Windows as my OS).

(Notepad) and save it locally on my file system (Windows as my OS). Basic HTML tags/elements - text, headings, lists, tables, links, images, formatting (also blinking text).

- text, headings, lists, tables, links, images, formatting (also blinking text). How to make colors with hex codes .

. How to use FTP (File Transfer Protocol) to upload files from my computer to a web host on the internet to make my website publicly accessible.

A few years later, CSS became popular, and I spent the next several years copying the CSS of sites I liked to make designs. CSS was revolutionary because you could do things like change all the colors of your links in one spot instead of all over your pages, having different sets of link colors, and so on.

How to use CSS (Cascading Style Sheets) to design the layout, font, spacing, and colors of a website.

(Cascading Style Sheets) to design the layout, font, spacing, and colors of a website. How to bring CSS (Cascading Style Sheets) files into an HTML file.

How to create layouts with floats instead of tables.

Although I had been making websites for years, I'd never read a tutorial, article, or watched a video about web design/development. So although I was oddly competent at making a website intuitively from all the sites I downloaded and played around with, I didn't actually know many basic concepts like how CSS selector specificity worked, or ids vs. classes, how to use pseudo selectors, and I would often end up brute forcing solutions for things like positioning and the box model.

This is generally the extent of everything I knew about web development before I decided to make a career out of it: basic HTML, basic CSS, basic managed hosting, and transferring files via FTP - everything I knew was static development, and I had absolutely no concept of programming. For anything that might be more advanced or dynamic - counters, guestbooks, blogs, forums - I used a third-party resource.

Getting Started and Internship (2014-2015)

Somehow, it still didn't occur to me to really do much studying before diving into this new career. I bought HTML, XHTML & CSS for Dummies from a used book store - which was honestly only a few years out of date at this point - and looked over it all. I was pretty overjoyed to discover that I knew basically everything in the book from my heuristic approach, but now I knew more of the technical terms.

I was lucky enough that a bartender at the restaurant I was working at was starting his own business and offered me an unpaid internship for a few months. So by day I did the internship and by night I cooked at the Pac-Man restaurant. At the same time, I was scouring Craigslist for some small jobs, and I created a few static Bootstrap sites as a freelancer. A lot changed since my early days, and here's what I learned during this time.

I have to make a pause here, because the next thing I learned blew my mind and is what really enabled me to start moving to the next level beyond making simple brochure-type websites: the command line.

Job 1: Junior Web Developer - WordPress (2015-2017)

11% salary increase from experienced chef to entry level junior WordPress developer

It's great that I learned all that, because for my first real job in the industry, I was going to use practically none of it. No Git, no Node, no Sass, no Grunt nor Gulp, no command line, no Bootstrap. Just cold, hard WordPress. Nonetheless, this was going to present a whole new group of challenges to overcome and things to learn.

A few months into my internship, I applied for a job at a different company as a junior web developer/designer. I'd spend the next two years (exactly two years, to the day!) making websites with Teo.

How to set up a LAMP environment - I had hosting, but I never used PHP and it never occurred to me that a host was any different than my local HTML setup. I learned how to set up a local environment for Linux (or Mac, or Windows), Apache (the server), MySQL (the database), and PHP - a full "stack".

environment - I had hosting, but I never used PHP and it never occurred to me that a host was any different than my local HTML setup. I learned how to set up a local environment for Linux (or Mac, or Windows), Apache (the server), MySQL (the database), and PHP - a full "stack". How to set up Apache and virtual hosts - I learned how to configure the Apache server to be able to run many virtual hosts at the same time.

- I learned how to configure the Apache server to be able to run many virtual hosts at the same time. How to set up cron jobs in Linux.

in Linux. The basics of PHP and PHP tags - "PHP: HyperText Preprocessor", as is what PHP stands for, is the most popular programming language on the web and the language most web developers start off with. I learned that if I started some code with <?php and ended it with ?> , everything inside would be PHP, and everything outside of that would be rendered as regular HTML.

For the longest time, I wanted to know how to make my OWN blog - not rely on Blogger, or WordPress(.com) hosting, but something I hosted myself with my own design - not someone else's theme. But how? I didn't know how and it was immensely frustrating. I struggled a lot, and when I finally figured out how to use WordPress(.org)'s platform to create my own unique blog, I wrote an article to share with the world what I learned.

At some point, I was given the responsibility of learning how to use AWS (Amazon Web Services) to set up Linux servers and migrate our websites over.

Side project: Primitive CSS Framework

While working as a WordPress developer, I also made all my own custom designs for the sites I created. To speed up this process, I created Primitive (source), a minimal CSS framework and website boilerplate that made it quick and easy for me to make unique, custom designs. The framework is built in Sass. With Primitive, I could create the majority of a site's CSS in a few hours.

I built many sites with Primitive - Cafe Ba Ba Reeba, Shaw's Crabhouse, Tokio Pub, Krispy Kreme Pacific Northwest, this blog, and more.

Side project: New Moon

I created New Moon, the best code theme for web development, and distrubuted it to Visual Studio Code, Brackets, Sublime Text, Chrome DevTools, learning how to create extensions for each of those environments.

Side quest: Technical Writer for DigitalOcean

I took a few month long sabbatical and traveled around Europe for a while after I left the WordPress job, but during that time I wrote the How to Code in JavaScript and Understanding the DOM (Document Object Model) series, which gave me a much deeper understanding programming and JavaScript, concepts like prototypical inheritance and scope, and finally understanding how the DOM actually works and is different than a website's source, which was much less relevant to me when I was only working with PHP-based sites.

I learned about syntax and code structure, comments, strings, variables, scope, and hoisting, math, arrays, mutator, accessor, and iteration methods. I also learned about objects, object methods, conditionals, functions, prototypes and inheritance, and classes.

From the DOM side, I learned what the DOM is and how it's different than HTML source code, about nodes and node types, how to access, traverse, and change the DOM. I also learned how to modify styles, classes, and attributes, and gain a better understanding of events, event handlers, and event listeners.

Job 2: Back End PHP Developer (2018)

28% salary increase from previous starting salary

After I got back from traveling, I started looking for another job. I knew I never wanted to work in WordPress again, and I didn't necessarily want to learn another programming language and its environment to find a job right away. I also thought PHP was fun, so I wanted to find a job where I could use PHP, but not WordPress.

Side project: Laconia MVC Framework

During this time, I wrote Laconia (source), a modern MVC (Model View Controller) application written in plain PHP without libraries or frameworks. I wanted to learn how to create something with MVC architecture, and I didn't want to rely on a framework to do it. I wanted it to be secure, and I wanted it to have users. I aimed to and succeeded in learning the basics of:

Authentication - logging in, logging out, resetting a password, having private content/dashboard hidden from anonymous users

- logging in, logging out, resetting a password, having private content/dashboard hidden from anonymous users Security and validation - encrypted passwords and hashing, parameter binding with SQL, making sure users cannot be overridden, making sure no spam or empty content can go through, making sure passwords and usernames have the proper characters

- encrypted passwords and hashing, parameter binding with SQL, making sure users cannot be overridden, making sure no spam or empty content can go through, making sure passwords and usernames have the proper characters Routing - Redirecting to URLs based on incoming request method and URI path, creating public user profiles in the root directory, creating dynamic pages based on GET requests

- Redirecting to URLs based on incoming request method and URI path, creating public user profiles in the root directory, creating dynamic pages based on GET requests Object oriented programming - I had never used a class in a working application before writing this app, so I learned a lot about constructors, inheritance, and abstract classes

- I had never used a class in a working application before writing this app, so I learned a lot about constructors, inheritance, and abstract classes Composer - I had no prior experience using Composer, so I wanted to find out why it was the standard in modern PHP development. I used it for autoloading classes and configuration.

- I had no prior experience using Composer, so I wanted to find out why it was the standard in modern PHP development. I used it for autoloading classes and configuration. Database schema - how to structure a database to relate information easily between the tables, i.e. linking lists and list items, users and user comments, etc.

- how to structure a database to relate information easily between the tables, i.e. linking lists and list items, users and user comments, etc. Sessions and Users - how to easily deal with sessions, users, and authentication.

Job 3: Front End Software Engineer (2018-2019)

17% salary increase

Eventually, I wanted to do anything else besides PHP or jQuery. JavaScript seemed like a good choice due to all the JavaScript I had been teaching myself on my own, so I ended up getting a position as a front end software engineer writing applications in React. I also didn't know React when I got the position, but I learned quickly.

Side project: Chip-8 Emulator

My project of 2019 has been creating a Chip-8 emulator in Node.js from scratch, thanks to Vanya Sergeev. I've learned many lower-level programming concepts, such as:

The concept of binary, decimal, and hexadecimal base systems how they interact with each other and the concept of abstract numbers in programming.

Bits, nibbles, bytes, ASCII encoding , and big and little endian values.

, and big and little endian values. Bitwise operators - AND ( & ), OR ( | ), XOR ( ^ ), left shift ( << ), right shift ( >> ) and how to use them for masking, setting, and testing values.

- AND ( ), OR ( ), XOR ( ), left shift ( ), right shift ( ) and how to use them for masking, setting, and testing values. Using the Node built-in file system ( fs ).

( ). The concept of a raw data buffer and how to work with it, how to convert an 8-bit buffer to a 16-bit big endian array.

and how to work with it, how to convert an 8-bit buffer to a 16-bit big endian array. How to write and understand an 8-bit and 16-bit hex dump.

How to disassemble and decode an opcode into instructions a CPU can use.

an opcode into instructions a CPU can use. How a CPU can utilize memory, stack, program counters, stack pointers, memory addresses, and registers .

. How a CPU implements- fetch, decode, and execute*.

The importance of unit testing.

Things I Don't Know, Abridged

In true Dan Abramov fashion, I'm happy to admit the plethora of concepts, technologies, libraries, frameworks, etc. that I don't know. What I don't know I don't know is much more extensive, however. This is a list of things I don't know that I think I probably should.

GraphQL

Redux/MobX

Docker

Electron

React Native

Vim

Algorithms

Data structures

Calculating time complexity

Algebra, honestly

Sockets

Networking

CI/CD

Types

Jargon Glossary

A small subset of the jargon acronyms that are familiar to me now.

API - Application Program Interface

- Application Program Interface Back end/server-side - the data access layer

- the data access layer CMS - Content Management System

- Content Management System CRUD - Create, Read, Update, Delete

- Create, Read, Update, Delete CSS - Cascading Style Sheets

- Cascading Style Sheets DNS - Domain Name Service

- Domain Name Service DOM - Document Object Model

- Document Object Model ES(6) - ECMAScript

- ECMAScript (S)FTP - (Secure) File Transfer Protocol

- (Secure) File Transfer Protocol Front end/client-side - the presentation layer

- the presentation layer HTML - Hypertext Markup Language

- Hypertext Markup Language HTTP(S) - HyperText Transfer Protocol (Secure)

- HyperText Transfer Protocol (Secure) JSON - JavaScript Object Notation

- JavaScript Object Notation MVC - Model View Controller

- Model View Controller REST - Representational State Transfer

- Representational State Transfer SPA - Single Page Application

- Single Page Application SQL - Structured Query Language

- Structured Query Language SSG - Static Site Generator

- Static Site Generator SSH - Secure Shell

- Secure Shell SSL - Secure Sockets Layer

- Secure Sockets Layer TLS - Transport Layer Security

- Transport Layer Security VCS - Version Control Systems (Git)

- Version Control Systems (Git) VM - Virtual Machine

Conclusion

Carl Sagan once said, "if you wish to make an apple pie from scratch, you must first invent the universe". That is how I felt writing this article. I tried to compile everything I know, but each new thing involved some previous knowledge, and that required previous knowledge, and at what point do I stop?

I'm missing plenty, I glossed over more, but in the past five years or so, I've tried to compile and write about everything that has tripped me up along the way. I hope something I've written has helped you in your own journey, and will continue to do so in the future.

I've written 123 articles about web development between my own website, DigitalOcean, SitePoint, Codrops, Envato Tuts+, and Progress.