Would you rather be a Python developer? Check out this article 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.
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 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.
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! (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.
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!
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! 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:
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 (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.
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 (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.
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.
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.
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. 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 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.
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!
Top comments (23)
Awesome, I love this article. Thanks for sharing
Very good advice! Thank you very much!! I'm just learning javascript, would it be necessary to also learn jQuery completely? Or is it not necessary? Since there are many libraries that are in jquery, others recommend not using jQuery but all javascript, I have that question. Thank you!!!
I used to work in web development as a front end. I have moved away from it because of personal reasons. I would like to go back but I am over 40 now..... Is there a point?
Yes!! Many people make the switch to tech later, and you already have experience so it’d be great. I’d love to hear about your experiences too
Thank you for your response; I thought this is a young person game only. Well, now I only need to brush off my skills :-) and re-learn new skills. I am a keen Pythonista so I do like use the combo of Python and JS for interactivity on the web.
Ahhh I'm so excited for you! Make sure to post about your journey here so you can inspire others to start chasing their dream too!
hii..
your think is very interested in life
Thanks for these superb steps for beginners, I already have basic concepts in this, but I'm struggling in learning react and how I can build a react-app for a small mountain resort that belongs to me.
any suggestions please.
Hey there. You really don’t need to use React for most things and I don’t recommend launching straight into it!
What exactly are you struggling with in React?
class components and functional components and how to use state and hooks, so I have a little idea it's to calculate the rate of rooms based on how much night they needed like that? u understand what I'm talking about />
You’re well on your way then! I’m still not sure exactly what you’re confused about, but hooks can only be used with functional components, and they can do loads of things including updating the state.
Good luck!
Yeah, these are the easy steps and why their is a influx of weak web devs in the market. It really has to suck to be competing in this market. I would want to see the dev landscape in 5 to 10 years and just how oversaturated it is or if it will be normal. It's a taboo discuss ed but a real supply and demand topic not discussed
Definitely. Getting your first junior dev job is definitely difficult, especially web development. But you'd be surprised how few juniors actually know about React / Angular / Vue, never mind have experience with it!
I'm committing to learning web development for at least a hundred days in a row... I'm going the self taught route, thanks for giving us great pointers... Started yesterday from Liberia...
Nice! Next step is to dip your toes I with a backend language. I just finished writing a course "Go Mastery" you can check out at classroom.qvault.io
Hii, i am beginner in web development know all besic concepts but know i want to go with mern stack development so can u suggest hiw can i go with that
Hi!! So exciting, welcome to web development! MERN stack includes React, so these 19 steps will help you for learning that. While you're learning Javascript, you can really easily learn Node (the N in MERN). Node is just backend Javascript. As long as you know how to use the command line and understand Javascript, Node is easy to learn. Express (the E in MERN) pretty much comes hand-in-hand with Node. It's just a library that you can use with Node. Follow this to get started with Node and Express.
Then play around with Node and Express, try out different things. Once you're relatively comfortable, start learning how frontend (React) works with backend (Node & Express). Make a project. I love this one - create a collaborative drawing tool with React, Node, and Express (ERN!) Keep playing around until you feel comfortable with all of these things working together.
For learning MongoDB (the M in MERN), it really depends on how comfortable you are with how databases work. I'd suggest taking a short introductory course into databases and NoSQL so that you're at least comfortable with the concepts. Otherwise using databases will be way too complicated! Then follow this tutorial to set MongoDB up on your computer and play around with it for a while. Then connect it with your Node and Express app, I think this tutorial is pretty good for that. Then, try to make it work with the collaborative drawing tool!
Good luck with your learning. I know it can seem really daunting at the start. But trust me, things will start falling in to place once you start building things on your own and it'll be the best feeling ever.
It couldn't be more simpler than this ☝️
Awesome, very helpful
Thank you, teacher.
Great steps I personally moved to php after html/css/js now in the process to learning angular with ts
Minimalist! Nice simple steps, the way its explained. Makes it look easy, need to practice step by step.
👍