From no programming experience to web developer in 19 small steps
Tags: career, webdev, beginners, javascript
Published: 2020-07-01 15:44:56

[Youtube](https://www.youtube.com/channel/UC7khnAAAID1WQ_4gQO73Gmw) | [Twitter](https://www.twitter.com/catmcgeecode) | [Instagram](https://www.instagram.com/catmcgeecode)

Would you rather be a Python developer? Check out [this article](https://dev.to/catmcgeecode/from-never-writing-code-to-becoming-a-python-dev-in-19-steps-5a0l) instead!

Sometimes it's really hard to know where to start. You make this decision that you want to become a web developer, and you do a bitta Googling, and suddenly you just have a lot more information with no actual direction. 

So here are 19 steps to get your first web developer job without any prior knowledge of code or accreditation. Of course, it's not the only route, but it's what worked for me and plenty of other people I know. And it's, you know, fun!

If you'd rather read these steps as a Twitter thread (I know I would lol), it's [here](https://twitter.com/CatMcGeeCode/status/1278314269482930176).

##Step 1. Get yourself a text editor that you like
I know you want to dive right into coding, but you need to know where to put this code first! Having a good text editor with highlighting and suggestions as you're typing makes ALL the difference. I started just using default text editors and yes, they work, but I felt so much more motivated and directed when I started using a real code editor like VSCode.

The industry favourite is [VSCode](https://code.visualstudio.com/) and it's great for beginners too. Go download it.

##Step 2: Learn HTML
HTML is fundamental knowledge for knowing how websites and web apps work. I think it's important to have a wide knowledge of HTML, that you can learn from [this awesome free Codecademy course.](https://www.codecademy.com/learn/learn-html)

##Step 3: Learn CSS
You could spend years learning CSS, and most web devs are still learning and discovering something new every day. For now, you want to learn how to connect a stylesheet (forgetting to connect the CSS has caused my so many problems) and know basic styling.

So check out another [free Codecademy course](https://www.codecademy.com/learn/learn-css)! (I swear I'm not meaning to advertise them, they're just awesome.)

##Step 4: Build! 
Now you know enough to build something... so build something! 

You may still feel like you know nothing, so feel free to search the internet as much as you need to. We all do. Even when you're a senior, you'll be searching the web every day.

If you're stuck for ideas, [Geeks for Geeks has some great ones](https://www.geeksforgeeks.org/top-10-projects-for-beginners-to-practice-html-and-css-skills/).

##Step 5: Learn some Javascript!
You know how to make your site LOOK like something, so now it's time to learn how to make it DO something.

I highly recommend that you learn the basics of Javascript online before trying to implement it in your website. So guess what? Time for [another Codecademy course!](https://www.codecademy.com/learn/introduction-to-javascript)

##Step 6: Make your Javascript do some funky things on your website
The best way to learn is by thinking of something you want your website to do, and doing it. Do you want to show a meme when you click something, make a turtle slowly follow your mouse, randomly change the background colour? You can! Sometimes when you can't think of good ideas, the best thing you can do is think of the dumbest thing ever and just implement it.

Or you can check out some of my other articles for ideas. I have a 'get a job with projects' series that covers basic fun projects, and [50% of them are in HTML, CSS, and Javascript!](https://dev.to/catmcgeecode/get-your-first-dev-job-by-building-these-projects-1-guess-the-hex-code-game-4k40) They're bare bones projects designed to make it easy to think of and add your own things on top of them.

##Step 7: Play around with developer tools
Dev tools are necessary for debugging your code.

You can open developer tools in any browser, which will let you explore the DOM, edit CSS, view the console, and more. Right click, and then click 'Inspect'. 

Explore the dev tools, figure out what they're telling you, use them to change the text on government websites and pretend you hack them. They look a little like this:

![Developer Tools on Chrome](https://dev-to-uploads.s3.amazonaws.com/i/41v7kvmoe1qoqq0cxwuc.png)

##Step 8: Learn responsive web design
Your website looks cool and does cool things, so now it's time to make it work on every device.

[Here's another Codecademy course](https://www.codecademy.com/learn/learn-responsive-design) (you can't beat them.)

##Step 9: Get familiar with the command line
If you haven't used the Terminal (MacOS) / Cmd (Windows) app yet, it's TIME! 

The command line is just another way of navigating & manipulating your files, and it is nothing to be afraid of. It's also super important - you'll need it to start using awesome Javascript frameworks, and you'll use it when you become a dev to install libraries and run your code! Start [here.](https://lifehacker.com/a-command-line-primer-for-beginners-5633909)

##Step 10: Get your first website (HTML, CSS, Javascript) on GitHub
Now you've built a site that looks cool, does cool things, is responsive, and you know how to use the command line. So it's time to learn git!

Git is a version control tool that you can use locally on your computer. Github lets you manage this version control tool with an awesome GUI, and you can share your code with other devs and employers.

[Learn how to start using git and GitHub here](https://www.freecodecamp.org/news/what-is-git-and-how-to-use-it-c341b049ae61/) (it's not Codecademy this time!)

##Step 11: Javascript must become your new best friend
In the modern world, many web devs use Javascript frameworks to build websites and it's become pretty much a necessity for getting a good web developer job. 

However, before launching into one of these, it's important to become REAL comfortable with Javascript. You don't need to know all the weird whacky behaviour, but you need to be super comfortable with the fundaments. There are tutorials you can follow, but the best thing you can do is build build build!  

##Step 12: Learn what Javascript frameworks are
Popular Javascript frameworks, like React, Vue, and Angular, all have a reason to exist. Put away your text editor for a while and learn what they do. Learn more about the DOM too! Start [here](https://jsreport.io/the-ultimate-guide-to-javascript-frameworks/).

##Step 13: Build your first app with Angular or React
Angular and React are wanted by employers more than Vue, so I'd recommend learning one of those two. I personally prefer React and the community around it, but use your knowledge from Step 12 to pick one you like! 

Follow a quick-start tutorial to get you started. The official documentation has a [great one for React](https://reactjs.org/docs/create-a-new-react-app.html).

##Step 14: Learn the fundamentals of your chosen framework
Best way to do this? Build a to-do app.

Brad Traversy has an AMAZING React crash course on his YouTube page - [check it out.](https://www.youtube.com/watch?v=sBws8MSXN7A)

##Step 15: Play around with your new toy
There are UNLIMITED possibilities with all of this new knowledge. Ok, maybe not unlimited, it depends on what your definition of 'unlimited' is... but that's more of a philosophical question. So just keep building, building, building. Continue to search the web if you're stuck. 

There are some good starter ideas [here](https://daveceddia.com/react-practice-projects/). Remember, if you're going to be following a tutorial or doing a basic project that you find online, BUILD YOUR OWN THING ON TOP IT. It's what I always say, and it works. 

##Step 16: Deploy something - anything!
When you're happy with something you've built, get it on the web for all to see. It's something you can show off to employers and something they can have a look at really quickly. They're not going to spend more than 2 minutes looking at your resume, so having something online is essential.

I recommend using [Netlify](https://www.netlify.com) to deploy. It makes things extremely simple and every time you push something new to a specific branch on GitHub, it'll deploy it for you!

##Step 17: You're ready to start applying for jobs
Once you have a Github with a few projects and something deployed on a domain, you're ready to start applying to jobs. 

Even if you feel totally unqualified, go for it anyway! You miss 100% of the shots you don't take, and you'll start learning what to show off on a resume and what will be asked in interviews.

##Step 18: Practice for coding interviews

Ok, I'm going to be straight with you here. Literally nobody likes coding interviews, I don't know a single person who's good at them, but we have to do them anyway. 

Coding interviews will ask you about data structures and algorithms, so learn a few of these and practice solving problems on pen & paper or, even better, a whiteboard. A great place to practice is [Leetcode.](http://leetcode.com) 

##Step 19: Keep building, keep learning

Every single developer is learning every single day. You can never know everything. We all started somewhere and it was hard for us when we were starting out too. Keep building new projects and trying new things. but make sure to take a break when you need it!

There are plenty of other routes to becoming a web developer, like mastering HTML, CSS or Javascript without knowing any frameworks, or getting accredited at a university or bootcamp. But these 19 steps are the best and simplest if you're wanting to learn on your own, and they WORK.

Good luck my nerd friends!