How To Become A Web Developer (From Complete Beginner to Hired)

Daniel Daines-Hutt
Daniel Daines-Hutt
hero image

In This Guide:

So you want to become a Web Developer. Maybe for a career change, to earn those big bucks, to break into the tech industry, to work remotely, or perhaps the idea of working from your computer appeals to you.

The only problem, of course, is that you’re stuck with more questions than answers.

  • What exactly is a Web Developer?
  • What do they do?
  • Is it even something I'd be interested in?
  • How do you become one?
  • How long does it take?
  • What's a full-stack Web Developer? Is that a different thing?
  • Is web development worth learning or will AI take your job before you learn it?
  • How much money do Web Developers make?
  • How do you even learn web development?
  • Is it expensive to learn?
  • Do you need a degree or to attend a bootcamp?
  • Can anyone learn? Am I too old?
  • Heck… how do I even get paid or hired once I’ve learned it all?

Your mind is probably going a million miles an hour right now but don’t worry. Take a breath, relax, and let me walk you through the answers to all these questions and more.

My goal is that by the end of this article, you’ll not only know everything you need to know, but you’ll also have a plan of attack for exactly how to become a Web Developer and be able to start learning within 15 minutes of finishing reading.

Important: This post is LONG with a lot of resources and a roadmap to both learn web development and then get hired. You might want to bookmark it 😉

A key thing to realize is that you’re not expected to learn everything here right away.

And sure, it will take time and effort. Anything worth learning always does. But if you follow this guide and our recommendations, it will significantly cut down a lot of time you might waste trying to figure it all out on your own.

Also, although it may seem like a lot to learn right now, we’ll also share ways for you to start earning money as a Web Developer while you’re still learning, so you can transition to this career as early as possible.

So try not to be overwhelmed. You’re looking at the path to a brand new career and skill here, so of course there are a fair few steps. But I believe in you.

For now though, simply read through this post to get some answers to all those questions you have and make sure this is exactly what you want to do. Once you're ready to dive in, use the step-by-step section and the resources to become a Web Developer.

Simple!

So are you ready? Good! Let’s dive in…

What is a Web Developer?

When people say web developer, they are likely referring to one of two types of Web Developers:

  1. A Full-Stack Web Developer (meaning they work on front-end and back-end... more on this soon), or
  2. A Front-end Web Developer

Not to add to the confusion but there are also Back-end Web Developers.

All of these roles are writing code. The difference is just the types of tasks and projects the person is typically working on.

In this guide, we’re going to walk you through the path to becoming a Full-Stack Web Developer.

Why this type? Well, let’s look at the difference between the two types, and break down a few terms you might not have heard before, and you'll see why this is the best option for you.

What is a Developer?

That's not a typo. A Web Developer is a type of Developer.

A Developer is simply a broad term that refers to anyone who either creates, modifies, or maintains software applications or systems.

Developers will often have certain specialties such as:

  • Web Development (Creating web-based applications and sites, such as Netflix or Amazon)
  • Mobile App Development (Building mobile apps)
  • Software Engineering (Creating software programs)
  • Data Science (Understanding data and what it means to make informed actions)
  • Machine Learning (Building machine learning models and training AI to understand data and perform actions)
  • Systems Design (Designing and implementing the overall plan for how a project can work, and all the connected parts)
  • Database Management (Helping to store and capture valuable information)
  • Game Development (So us nerds can get our Zelda on ⚔)

All cleared up? Good stuff.

Now let's get back to web development. Web Developers will often specialize in either front-end or back-end or they'll do a bit of both (aka... full-stack).

What’s the difference between front-end, back-end, and full-stack?

Front-end development

Front-end development refers to coding everything that's front-facing in a website or application. For example, when you go to a website everything you see is the front-end. That includes things such as the layout, the user interface, the animations and colors, and how it all fits together to create a great user experience.

Back-end development

Back-end development refers to coding everything that's working behind-the-scenes to make it all work. For example, when you're on a clothes store's website, all the items for sale, available stock, and current prices are dynamically pulled and updated automatically from a database in the background. That means a front-end developer doesn't have to manually go in and change the code each time a t-shirt is sold to specify there's one less t-shirt in stock.

Full-stack development

A Full-Stack Developer is someone who can fulfill both roles. They understand how to build and create both the front and back end, and they even know how to connect and get it all working smoothly.

Watch this 2-minute video below. Aldo does a great job breaking it down 👇

In theory, a Full-Stack Developer can build entire projects on their own, depending on the size of the project and how much time available to create it.

Being a Full-Stack Developer requires more skills and knowledge, but it also pays better because you’re a one-stop shop for getting things built.

Even if you choose to specialize and focus on just front-end or just back-end later, you'll be much better at either of those by understanding the other side.

For example:

Knowing how databases work and how they interact with the front-end will ensure you make better decisions when coding as a Front-end Web Developer.

Why should you become a Full-Stack Web Developer (instead of front-end or back-end only)?

why you should become a fullstack web dev

Money, experience, and opportunity.

Full-Stack Web Developers have to learn more skills but it also means:

  • They get paid more money (exactly how much more in a second)
  • They get a much deeper understanding and experience of how everything works together
  • And they have more opportunities available to them (can apply for any web development role vs. just front-end roles or just back-end roles)

We highly recommend you become a Full-Stack Web Developer, especially if you're just starting out.

Is being a Web Developer a good career?

It sure is! Web Development is a fantastic first step into the tech industry. It’s not as complex as some other tech roles (especially frontend), which means it's great for beginners, while still having most of the same benefits.

Salary

The average salary for a traditional Front-End Web Developer is around $87,000, which is not bad at all.

front end web dev salary

If you continue to skill up and become a Full-Stack Web Developer, then you can expect around $107,000, for a $19K bump in earnings!

full stack web dev salary

Not bad right?

Job demand

Not only does Web Development pay well, but there are a lot of jobs available in this industry, and it continues to grow.

According to the National Bureau of Statistics, there were 197,100 web development jobs in the US in 2021, with an expected growth of 8% year-over-year (higher than most industries).

If we look at ZipRecruiter, we can see that there are currently 109,564 Web Developer jobs available in the US alone right now.

us front end web dev jobs 2023

If we narrow that down to just Full-Stack Web Developer jobs, there are still 64,646 roles available.

us full stack web dev jobs 2023

Again, this is just in the US and doesn’t include any international opportunities, so there are a lot of options out there!

This is just from a full-time employment standpoint. You can make a lot of money as a Freelance Web Developer, and work for yourself if you really want to!

make money building wordpress sites

What else?

Well, how about the fact that you can work from anywhere as long as you have a computer? This means not just remote work but geo-arbitrage. Earn USD and live somewhere cheap, and suddenly that $100k a year job is worth twice or even 3x as much in local currency.

It gets better though. Because you’re often planning and building, you get to not only have a creative outlet for work, but you’re always learning new skills to stay on top of your game.

Is coding actually fun?

I'm guessing you have a rough interest in coding if you're here, but your vision of what it's like and the real life work is probably a little different.

The only way to really know, is to give it a try, and listen to people who've been doing it for a while. Be sure to think about what they're saying though. Some elements they might like or hate, could be something you love.

If you're on the fence, I highly recommend you read this post to really help you determine if coding is for you.

tl;dr: Web development is a truly fantastic career to get into. Learning to code is one of those skills that will be useful to you no matter whether you make it your full-time career or not.

That said... if you don't enjoy it, you're not likely going to stick with it, so be sure to check out Cindy's guide above.

Can anyone become a Web Developer, or do you need a degree?

As long as you have a computer, the internet, and a willingness to learn, absolutely anyone can become a Web Developer - regardless of background.

Why?

Well, the tech industry is one of the few places where employers care less about your education and more about what you can do.

If you’ve built projects and have a portfolio to show that you can do what they’re asking, they don’t care if you have a Computer Science degree.

Heck, we’ve had 1,000s of people hired at Google, Tesla, Amazon, and other companies who’ve never even tried coding before and just learned at home following our training courses.

Even the founder of Zero To Mastery taught himself how to code after switching careers from the travel industry. So we've been in your shoes!

ztm student success stories

If these other students can do it, so can you.

Is being a Web Developer hard?

Yes and no. It’s going to be a learning curve at first as this is likely completely different from what you’ve done in the past.

It’s not overly complex but will take time for you to understand each new concept.

That’s why following a roadmap (which we’ll share in a second), is such a good idea. This way you learn the right things, in the best order, without making it overly complicated or time-consuming.

That said, the actual job of being a Web Developer can be easy if you want it to be. There are plenty of companies where you can do pretty basic coding and get paid good money.

The hardest part of being a developer is that you constantly have to be learning new things because tech evolves so quickly.

Is Web Development worth learning, or will AI take your job before you learn it?

Nope! We cover it more in this guide here, but let me simplify, and explain why AI tools are actually a good thing.

Right now the tech is very cool, but fairly limited:

  • AI tools are not actually sentient. It's pattern recognition and a few other cool things. But the fact that the answers sound like a person, makes it seem like it's smarter than it is
  • It's also limited by the data that it has been trained on. Newer versions are getting access to the internet and new sources, but it still needs a lot of content on the same topic to learn from it
  • Results are affected by how good the user is at leveraging the tool. Ask the wrong questions (prompts), or ask them poorly, and it will give you weak answers or even fake ones

Maybe you saw the court case recently where a lawyer used ChatGPT to find prior examples for their case.

ai tool poor usage

The tool provided the lawyer with 10 prior court cases to use...but it turns out they weren't real cases. It simply made them up to give the user what they wanted to hear.

We're not the only people to have this opinion either.

ai tools survey

Does this mean that AI tools are useless for Web Developers?

Not at all. In fact, if you can learn to both use these tools correctly, and also apply that with some topical knowledge, you can make your life far easier.

In the example above, the lawyer should have verified that those cases were real and said what they were being alleged to have said. In short, the lawyer needed to double-check ChatGPT's work. Instead, they simply trusted it as fact, and cut corners.

The key really is to pair these tools with your current skills, and that's why they won't steal your job.

For example:

You could use an AI tool to help write the outline for some code to solve a problem. Then, as a trained Web Developer, you could check that code and test it out.

This would help you speed up your process and find solutions to problems.

Important: The Developers who learn to embrace these tools in this capacity will have a huge advantage over others in their field. This is because they'll be able to produce more output with a faster and easier workflow, and this is where you get the real threat to jobs. The threat is not with the tools themselves - it's being left behind by not embracing them!

It's also why we're leaning heavily into teaching Developers how to use these AI tools while learning to code and beyond. This way, you'll be a much more efficient programmer, and learn far faster!

How long does it take to become a Web Developer?

Again, this varies and depends on how much time you can invest, and any prior knowledge or experience.

It also depends on how far you want to go. Obviously becoming a Front-End Developer will be a bit faster than becoming a Full-Stack Web Developer, as you typically learn front-end first before you learn back-end.

This is also why we recommend you start applying for work and getting paid for Front-End Web Developer jobs or do some freelance work, and then continue to learn what you need to become a Full-Stack Web Developer. This way you can earn while learning to code.

But, to answer the question. If we were to give an approximate time frame to "How long it takes to learn and become a Full-Stack Web Developer", you would probably be looking at:

  • 2-3 months, if you already have some basic knowledge. Maybe you built some drag-and-drop websites, and you’re also able to put in 40-80 hours a week. Obviously, not everyone has that much free time, but we’ve seen people do this
  • 4-6 months if you can spend 20-40 hours a week. Possibly working evenings and weekends
  • 7-12 months if you can only manage 5-10 hours a week, such as 2 hours a night, or one day on the weekend
  • 1-2 years if you are completely self-taught (i.e. just using Youtube videos without a clear path of what to learn). It can be faster but you need to be incredibly disciplined

Clearly, if you dedicate more time and have a set path to follow, such as a roadmap or course (like Zero To Mastery), you’re going to fast-track your progress.

Am I too old to learn to code?

never too old to learn to code

Nope!

As long as you have a few hours a week to learn, it doesn't matter how old you are.

What’s the best way to learn Web Development?

There are 4 major options to learn to code, and they each have their own pros and cons. We did a deep dive into each option in this article here.

best way to learn to code

But let me give you the mile-high version.

Option #1. Self taught

  • Cost: $0
  • Time: 1-2 years or more, depending on if you have a plan to follow, and are disciplined.

A lot of devs have started this way, but you really do need to stick to it and know what to learn. There are hundreds of things you could dive into and it's easy to get lost, procrastinate, or keep pushing it back and never finish aka tutorial hell!

However, it is also free which is pretty nice 😀.

Our founder actually learned to code this way, but I’ll be honest - the dude is super disciplined, which is so important if you want to take the free route.

learn to code on your own for free

Check out his original Twitter thread here, or his guide on learning to code for free in 6 months.

ultimate guide to learning to code for free

Option #2. Attend an in-person bootcamp

  • Cost: Anywhere from $1,500 to $35,000
  • Time: Can be as short as 6-12 weeks, while others can last up to 2 years, depending on the provider

Basically, you pay for the bootcamp, show up every day, and then get pushed through an intensive learning and building program so that you can learn asap.

Some offer payment plans but can be a little iffy, asking for X percent of future earnings for the next few years. It’s not always a bad deal if you’re getting the training and sealing a $100k a year job, but it's not always guaranteed that you’ll be hired by the end of the camp.

tl;dr: Bootcamps can be very costly (but cheaper than College) and time intensive but are good for people who struggle to follow through on their own as you have the motivating factors of cost and someone on your back for X week/months.

PSA: Be very skeptical of the marketing used by many of these bootcamps. Many of them make some pretty grand claims (ex: job guarantees) that don't actually turn out to be completely true.

At the end of the day, you still have to do the work. You still have to put your resume and portfolio together. You still have to apply for the jobs. You still have to interview and land the jobs.

They don't do these things for you.

What they might do is have some companies that come and do recruiting and give you some advice but please just make sure you know what you're getting.

Just read the fine print 🙂

Option #3. Get a Computer Science degree

  • Cost: $50,000-$100,000 per year, for 4 years. That’s a whopping $200,000-$400,000 in total. Oh dang!
  • Time: 4 years

Hmm… insanely expensive, a long time until you get a job, possibly learning out-of-date curriculum content and most tech companies and jobs don’t really care if you have a CS degree.

So why bother taking this path? Well, if you can afford it and want to take the time, you have a dedicated path to learn, with people pushing you to keep at it. There’s nothing like the fear of wasting $400k to really motivate you to get your work done.

Also, college is a HEAP of fun. Add in the fact that you’ll cover theory content that FAANG-level companies i.e. the biggest, best, and highest paying (Facebook, Apple, Amazon, Netflix, and Google) will want you to know before they hire you and it's a nice bonus.

That being said, as long as you learn about data structures and algorithms from somewhere and practice FAANG-level coding interview questions, you can get those same jobs without the degree.

Option #4. Learn online with a semi-guided course

I'm a little biased here because this is exactly what we offer but I truly believe this option provides the best value (whether it's us or a few other very good platforms out there).

  • Cost: Usually around $35 a month depending on which platform you go with. Most will offer an annual discount or even a lifetime, one-off cost. We currently offer an annual option of $279, or a lifetime membership to every course and all future updates, for just $999
  • Time: As we said earlier, anywhere from 2-12 months depending on how much time you have and what you current level of experience is

Online academies are slightly more expensive than being completely self-taught, but with the added benefit of plans, roadmaps, updated and relevant content, and a fast track of what to learn and how to get hired.

Added bonus? People are weird, but by having a small monetary commitment to pay for the training, you’re actually far more likely to follow through and do the work vs if it was totally free.

Editor’s note: I'm personally guilty of this... I have free courses on a bunch of topics that I’ve never started but have watched $249 courses multiple times. Both by the same instructor… 😅

Another bonus? Try to find a platform / course that has a dedicated and active community that you can interact with vs. a one-time purchase and zero interaction (ex: most Udemy courses).

Like I say, we’re biased but we truly do this this is the best option to learn with. It's extremely affordable but still gives you the same content and many of the benefits of bootcamps / degrees.

We’ve had people hired at major FAANG companies when they were waiting tables earlier in that same year.

You click, join, follow a career path, and then get it done. Simple.

A key point of difference here at ZTM (and I promise to be less salesy after this), is that all our training is focused on getting you hired as soon as possible.

We don’t want to teach you everything there is to know about Web Development, because it would take years and years, and it wouldn’t all be useful or relevant. Many people get stuck in this loop of trying to learn "everything".

Instead, our instructors have actually worked as Senior Developers at companies and have hired new developers in these roles. So they're able to give you a curriculum of exactly what you need to know to be their perfect hire and cut out what's not needed.

You're also going to learn 10x more and faster than any course or tutorial once you're actually working at a company working on solving real problems every single day.

So let's get you the foundations you need and then get you hired ASAP. Then if you want to come back and add some additional skills to your toolkit with us, great!

The Full-Stack Web Developer roadmap: from zero experience to building sites, apps, and getting hired

OK, so by now you can clearly see that becoming a Full-Stack Web Developer is an awesome career, but how do you actually learn it? What do you need to know? What order should you learn it all?

Well, good news. I'll give you two options:

Option #1.

You can keep following along with me here. I'm going to give you the mile-high version below along with some free resources to get started so you can get a sense of what you're getting yourself into.

Option #2.

However, if you're ready to commit and want to become a web developer as efficiently as possible, then I highly recommend you just take our dedicated Web Developer Career Path here.

ztm full stack web dev career path

It does a way better job than I can do in this free post and condenses the information into specific steps to take, so you can ignore the rest while you work on each part.

Not only that, but it takes all the guesswork out. You just follow along, take the recommended courses and learn the right things in the right order, and then continue to follow the training to get hired.

Who is this Web Developer Career Path for?

Anyone with zero experience who wants to learn Web Development, and not spend crazy money on bootcamps or college degrees.

Take the ZTM Career Path if:

  • You’re an absolute beginner with no coding experience
  • You want a fast track to learning to become a Web Developer
  • You want to build real-world projects, not just learn theory
  • You want to learn up-to-date, relevant content!

Still with me? Alright padawan, let's get started.

Quick note: I've extracted the steps below from the Complete Full-Stack Web Developer Course.

It's the best Coding Bootcamp course online so no need to reinvent the wheel right?

And because Andrei (who teaches the course I referenced above) is so awesome, he also made a video roadmap you can check out!

P.S. Even though it was created in 2020, most of the video still applies because the focus on the foundations, not learning every single random topic and shiny new framework / library.

Part 1:

Part 2:

Feel free to watch those videos, but I also recommend you take a look at the steps below, as I’ve added in multiple resources at each point where possible, so you can get some hands-on experience or deeper knowledge.

For example:

When Andrei recommends you learn React in step 12, we share a video with 6 hours of free React training!

Alright, let’s get into it…

Step #1: Learn how to learn

Here’s the thing. You’re going to be consuming a lot of new information, and the simple fact of the matter is that most people are not great at learning new things.

We pick up habits in school and then that’s it. However, like most things in life, there are ways to hack and improve these processes. If you want to learn how to learn more effectively, then check out this guide.

It might seem like a detour but if you can pick up these skills first, then not only will you be able to go through all the content to become a Web Developer faster and more efficiently, but you’ll also retain it better.

Take a minute to make everything after this easier. Then come back to this post.

Step #2: Learn how the Internet works

If you’re going to be building projects for the Web, then you need to know how the Web works. More specifically, how pages are delivered, built, etc, as well as understanding domain names, hosting, HTTP, and more.

Watch the first 40 mins of this video to learn how the internet works:

Don’t worry about watching all of this video now (unless you can’t look away from its awesomeness). We’ll be coming back to this video multiple times, and I’ll include the time stamps in each section below so you dive back in at the right points.

Step #3: Learn the basics of Computer Science

So now you know how the internet works, it’s time to learn how computers work, and how this all relates to each other.

Watch this video first to understand how computer networks work:

Then, watch this video for an overview of how Computer Science works:

As well as this playlist:

Then, go ahead and watch this CS50 “Intro to Computer Science” playlist from Harvard (and save a fortune in college fees).

Note: Although this video is from 2017, it’s still incredibly relevant, and the teacher is amazing. There are newer versions of this lecture series but 2017 is still the best one.

Step #4: Learn how to use the command line

The command line interface (CLI) is a text based environment, designed to let you interact with your computer.

the command line

The command line is a topic that comes up in all programming fields, including web dev so it's important to understand it.

Zed Shaw has a great book/article on the topic that you can read here for free (click the ‘next lesson’ at the bottom of each page to move along).

Ignore the fact that it talks about Python. It’s still relevant.

Step #5: Learn some basic programming languages

Alright. Now you understand the command line, it’s time to start learning some basic programming languages.

Learn:

These 2 'languages' are the basic building blocks of working on the web.

For Example

Imagine you're building a web page.

HTML is the basic structure of the page. It helps define what elements are where on the page, such as the header section, the body, the footer or any other elements you want to add.

html page layout example

You don't just want a blank layout though, and that's where CSS comes in.

CSS allows you to set styling and decorations to that page, such as colors, fonts, sizes etc.

html vs css

You also need to learn how these 2 fit together, so go ahead and watch the video below:

Yep, this is the same video as before, but it will start at the right time stamp for you to learn this concept. Continue watching until you get to the 3 hour 6 minute mark (we’ll come back to the rest again later on).

Step #6: Apply what you’ve learned and build a basic website

One of the best ways to learn and retain information is to start applying what you’ve learned so far. At this point, you should start using your new HTML / CSS skills to create a simple website.

build your first basic website

Maybe not this simple but you get the idea. Ideally, you want to create a portfolio site where you can then add future projects. Perhaps something like this.

site example using basic web dev languages

You can also follow this video series below to learn how to build it from scratch:

Step #7: Learn to use templates for easy site design

Alright so you did the hard work and created a basic site with HTML and CSS. Now, go ahead and check out Bootstrap, and start playing around with editing some of their templates, and see how this compares with coding a site from scratch.

Much easier right?

Sidenote: Technically, you could actually start making money at this point by building basic sites for people and customizing templates. (I’ve personally made a few thousand dollars like this).

However, don’t stop here. The big bucks are when you learn Web Development proper, and you can earn 10x this amount.

Step #8: Learn Flexbox and CSS Grid

Flexbox will help you to make sure that all your CSS elements appear in the right locations on your site, as well as its size, alignment, etc. While CSS Grid will help you design more customizable layouts.

Watch the video below from this timestamp until the end:

Then, go ahead and practice what you’ve learned. You can practice Flexbox here and then practice CSS with CSSGrid Garden.

Step #9: Learn a general-purpose front-end language: JavaScript

HTML and CSS are great for learning the fundamental building blocks of the web, but they have limitations, and the topics are quite frankly huge.

Rather than get stuck trying to learn everything about them, you can bypass a lot of struggles and build on what you’ve learned so far, by learning a more advanced language, such as JavaScript.

Why JavaScript?

  • Every web browser uses it
  • It’s easy to learn
  • It connects with front-end frameworks and back-end server environments. Many of which are also built in JavaScript code
  • It’s one of the most in-demand languages in terms of employment
  • It can manipulate HTML and CSS
  • You’ll learn more about HTML and CSS simply by working with JavaScript

Oh, and JavaScript will let you add far more functionality to your site design from earlier!

Sold? OK, so how do you learn Javascript? Well, you can learn it as part of our Web Developer course (that fits this roadmap).

Alternatively, here’s a few other resources. You can take this mini course and start applying the lessons in there to your current site design from the earlier steps.

mini js course

Also:

Step #10: Make your life easier with GitHub

Learn Git and Github with the tutorial below:

Also use this Git Explorer to practice and then learn more about Git Branching here.

Then, go ahead and create a Github profile.

Follow the steps in the video below to get setup and create a nice looking profile in under 20 minutes. Once you're done, start making commits every day.

Next, use Github pages to put your website online for free. This will be your portfolio.

Step #11: Apply what you’ve learned and improve your website

Again, it’s time to apply what you’ve learned.

You could make a bunch of different JavaScript projects right now, but instead, why not go back and make improvements to the website you already built? What about making it responsive to different screen sizes?

There’s a 100% chance you will need to do this for work in the future, so it’s good to get some experience with it now and maybe add in some extra styling for good measure.

example portfolio site

Step #12: Learn how to use your first framework: React

Alright, let’s make your life easier by adding in frameworks. These will not only help you to be more efficient when coding, but they’ll also open up the door to other projects such as web apps.

What’s a framework?

A framework is simply a structure that you can use to build software on and not have to start from scratch, kind of like a template. This means faster and easier builds while also giving you the ability to manipulate almost everything that you’re using in one place.

There are many options but we recommend you use React.

Oh and guess what? We have a React course also.

Here are the first 6 hours from the course below:

Enjoy!

Once you’ve finished that video, go ahead and watch this one next.

Bonus React steps:

Step #13: Apply what you’ve learned and build your first web application

Alright, time to retain and apply that knowledge again. If you watched the full React Crash Course above, Yihua walks you through how to create your first React app.

create a react app

Once you've built that, get some more experience by trying to customize it or build your own basic React app using create-react-app.

Create-react-app will blow you away, and open up a whole new world for you. Command Line Interfaces (CLIs for short) are now becoming common practice with all frontend frameworks and lets us set up a project quickly.

Then go ahead and deploy your React app on GitHub pages. In the future, you should deploy all your projects on Github pages to show off in your portfolio. Also, deploy your React app on Netlify.

Step #14: Get paid while still learning to code

Another chance to earn money. By this point, you should be a fairly competent front-end web dev and can start applying for roles or freelance work, and getting paid while you're still learning to become full-stack.

However, getting hired in a full-time tech role is a little different from what you’ve done before, so let’s get into it.

Step #15: How to ace the tech interview

Alright, so if you want to get hired now while you’re still a front-end web dev, there are a few things to do. You would have to do these exact same things later, I’m just mentioning these now as this is the point where you could start earning while still learning.

If you don’t plan on applying for jobs yet, you can skip this step. Otherwise, there are 3 major things you need to do:

And by practicing, I don’t mean just learning how to talk to interviewers. You need to actually start learning how to pass the technical interview test.

“Wait… there’s a test?”

Yep! Well not every web development job will make you do a test but most will.

You see, one of the reasons the tech industry doesn’t really care about degrees is because they can simply test their applicants' knowledge and skills to make sure they can do what they say they can.

This is great for you because if you've put in the work and can do the job, you'll have a chance to prove yourself vs. years ago when you HAD to spend 4 years getting a fancy piece of paper.

The good news is, we cover everything you need to know and do to pass coding interviews and get hired at smaller or even larger companies (including the FAANG companies) in these two guides.

crack the coding interview

Here’s the tl;dr version.

The tech hiring process is usually 4 stages:

  • An online application form, where you submit your resume + portfolio
  • If you get through, then you might be sent an online quiz with some basic job-specific questions. If you pass this then you will have…
  • An in-person or Zoom call interview and technical coding test. They ask technical questions and you solve them while they watch
  • And then a final interview to see if you would fit in with the company dynamic

Don’t freak out.

Sure, this is more prep than you will have done for most other jobs, but it's also why you don’t need to spend $400k and 4 years at college. You can simply take a data structures and algorithms course, and then if you want to apply for the larger companies, practice with some FAANG-level interview questions.

Then, go ahead and build up your soft skills so you can crack that final ‘behavioral’ interview to see if you’re a good fit.

That’s all there is to it. Simply, practice the tech questions, ace the interview, and you can easily secure a $100k a year job or higher, and save yourself $355k in college fees.

save money on college

Step #16: Start learning back-end Web Development

FULL-STACK WEB DEVELOPMENT

Even if you did stop to get hired in the last step, we recommend you keep learning and become full-stack, so stick to it.

Remember: The difference in average earnings between a Front-End Web Developer and Full-Stack Web Developer is almost $19k, and that’s just the average starting rate. Add in the fact that you can then open up $150-200k roles later down the line, and full-stack is where the fat stacks are.

Most of back-end development is working with servers and databases so let’s get into what you need to learn.

Step #17: An intro to HTTP, JSON + AJAX

Go ahead and read the following 3 guides, and Learn how these allow you to communicate with servers.

Step #18: Learn Node.js + NPM

Node.js is an incredibly popular cross-platform server environment that’s going to allow you to start building a server and all those fun things on the back-end.

Also, thanks to its popularity and volume of users, you’re spoiled for information if you ever get stuck using it, as well as a whole host of libraries that you can grab code from.

Add in the fact that Node works very similarly to regular JavaScript, and it means you’ll not only pick it up fast, but you also won’t get too confused like you would if it was a completely different language.

Go ahead and download Node.js and NPM.

Then, download lodash from NPM and use browserify to use CommonJS imports, and learn about it in this tutorial. (Hopefully you’ll start to see why NPM is such an amazing tool for developers.)

Then, dive deep into Node with another free 6-hour crash course, this time on Node.js!

Note: The crash course video above is from our full Node.js course. It deep dives into Node.js but it doesn't show you how to set up a server in this teaser, like we do in the complete Web Developer course. That being said, the video is still incredibly helpful to watch and learn from, as it will give you a headstart when you come to learn Node fully.

Step #19: Learn Express.js

Time for another framework! Express.js is a framework built for Node.js, with a focus on web applications on the server side.

Just like other frameworks, it’s designed to make your life easier, thanks to its heap of features and easy accessibility. Grab it from the link above and learn how to use Express.js with Node.

Step #20: Apply what you’ve learned and build an API server

Time to put what you’ve learned on the back-end to work, and build your first api server.

learning back end to become full stack

Watch this video to learn how:

Once you are done with this, use a fun API found here to build a simple app. This is my favorite one.

pokeapi

Step #21: Add further back-end knowledge

Learn some basic Web Architecture concepts by reading this article.

Then, learn the difference between server-side rendering, client-side rendering and pre-rendering (static site generator).

Step #22: Learn SQL

OK so the last ‘major’ element to learn on the back end, (other than pushing projects live), is how to collect, manage, store, and manipulate data within your applications.

And one of the best languages to manipulate databases is SQL.

Again, everything in this roadmap is covered in our Complete Full-Stack Web Developer Course, where we show you how to use both types of DBMS (Database Management System):

  • Relational Databases with (PostgreSQL), and
  • Non-Relational Databases (with MongoDB)

Don’t worry if all that seems confusing. The naming simply refers to how they store and process data. Once you get to this step and start working with these, it’ll be super clear how they work.

If you want to deep dive into SQL, we also have a dedicated SQL and databases course.

Not only that, but we also have some excellent SQL projects that you can practice with and use to boost your portfolio.

Step #23: Apply what you’ve learned. Build a database

Again, it’s time to put what you’ve learned into practice. Go ahead and build a server using SQL, so that you can then connect this with the server you built earlier.

Build a small project using a database you create here.

dbfiddle

Then, go a step further and create an app using firebase as the database and use firebase to set up user login/logout.

Step #24: Deploy your project

At this point, all that’s left is to connect the front-end and back-end of your app, and then get it deployed online!

machine learning web app project

Same as before:

Oh, and add it to your portfolio website for employers to check out 😎!

What’s next?

Congrats, you made it! You’ve learned pretty much everything you need to know to be a working Full-Stack Web Developer excluding a few small things.

Now’s the time to keep practicing what you’ve learned through the roadmap, build some more portfolio projects, prepare for the interview, and apply for jobs.

Sure this is a lot to learn, but this is a whole new career. As we said earlier, you’ll be surprised how fast the time will go by once you start to learn. Heck… the time will pass anyway, so why not change your life and career and become a Full-Stack Web Developer?

If you want to go the free route, then the roadmap above along with Andrei's learn to code and get hired guide will be the fastest path for you to follow on your own.

If you want to fast-track your journey, follow our Full Stack Developer Career Path.

You’ve got this!

More from Zero To Mastery

[Full Guide] Learn To Code For Free in 2024 & Get Hired in 5 Months (+ Have Fun Along The Way!) preview
Popular
[Full Guide] Learn To Code For Free in 2024 & Get Hired in 5 Months (+ Have Fun Along The Way!)

Updated for 2024 (including A.I. & ChatGPT). In 2014, I taught myself how to code & got hired in 5 months. This is the step-by-step guide I used. Now 1,000s of other people have also used it to learn to code for free & get hired as web developers.

ZTM Career Paths: Your Roadmap to a Successful Career in Tech preview
Popular
ZTM Career Paths: Your Roadmap to a Successful Career in Tech

Whether you’re a beginner or an experienced professional, figuring out the right next step in your career or changing careers altogether can be overwhelming. We created ZTM Career Paths to give you a clear step-by-step roadmap to a successful career.

Programmer Success Stories: Real People. Real Stories. Real Results preview
Programmer Success Stories: Real People. Real Stories. Real Results

Are you thinking of learning to code? Need some inspiration? In this article, we share 6 programmer success stories from people who are just like you.