There are no two ways about it, learning to code will take some time and effort. After all, if coding were “easy”, companies wouldn’t pay web developers so well! Still, it would be good to know how much time you need to commit and how to go about things productively.

This post will set out an idealistic study plan, covering all the core topics you need to know to become a hireable junior web developer. Using this plan, you could secure an entry-level web developer role where you can earn to learn in 6-9 months, but everyone’s circumstances are a bit different.

Along the way, we’ll sprinkle in some ✨ top tips ✨ to reach your goals without wavering.

✨ Be bad

Before jumping into the specific things you should learn, let’s look at the first ✨ top tip ✨.

No one likes to be bad at something, but we all start somewhere!

Sucking at something is the first step towards being awesome at something!

All the information you need to become a web developer is out there - be that on Scrimba or somewhere else. Accept you won’t be the best to start with but understand you’ll build momentum towards the tail end of these 6 months.

If you rush, you’ll have to learn twice when you need to fill the gaps in your knowledge.

HTML & CSS basics

Although HTML and CSS are different technologies, they are essentially married as you rarely (if ever) use one without the other!

HTML is a special text file format that enables you to define the content of your page. For example, putting a text on the page.

CSS enables you to style that content. For example, by making said title bold and red.

Learning code takes time, and some concepts are pretty tricky to wrap your head around. With the right course, HTML and CSS should be fun!

You will bring basic websites to life and share them with your friends much quicker than you might expect. Moreover, you’ll start to feel comfortable working with text file formats, which are the basis for all of web development.

Making websites interactive with JavaScript

Once you have some content on the page (defined with HTML) and you’ve made it pretty (with CSS), you should learn to make your website interactive with JavaScript.

JavaScript is another special text file format (known as a programming language,) that allows you to write and run instructions when certain events happen on the web page.

For example, when someone presses the “Purchase” button, you can write some code to add the item to a shopping basket.

JavaScript is an essential skill for web developers, as you can use it to add features to websites that make companies money (like a shopping basket!)

Responsive design

You should know the foundations of HTML, CSS, and JavaScript at this stage, but there is still a lot more to learn.

In 2022, it’s more important than ever that websites work just as well on mobiles and tablets as they do on desktops.

Instead of building one website for each device, modern websites respond to the size of the device by laying out information in the most readable way:

A screenshot illustrating how, the smaller the device, the more compactly the same information and interface elements are featured

To achieve this, developers structure their HTML a certain way and rely on a CSS feature called media queries to tweak the size and placement of elements as the screen gets smaller or wider.

✨ Join a community

Thomas Jackson, an independent YouTuber from the UK, became a web developer in 6 months and attributed a lot of his success to chatting with and making friends early on. In his video about “How I became a web developer after 6 months,” he explains, “speaking with other developers gave me invaluable context, and that is just something you cannot buy on a Udemy course”.

Maybe you don’t have any friends who code, but that’s okay! There are numerous Discord servers and Twitter communities dedicated to new developers, and they’re accessible to everyone.

Next-level JavaScript

The foundations of JavaScript can take you a long way, but to become a hireable web developer, you’ll probably need to take things to the next level.

Believe it or not, JavaScript version 1 was released 26 years ago in 1995!

While a lot of the fundamentals remain the same, there are, of course, newer features you would do well to learn.

Not only will they help you write better JavaScript. They will make learning a frontend library like React much easier too (more on React soon!)

Next-level JavaScript features include,

  • Destructuring
  • Spread operator
  • Array.map
  • Array.reduce
  • Arrow functions
  • Currying
  • Constructor functions

Working with APIs

Ah, acronyms! There are many to learn, but probably none more important than API, which stands for Application Programming Interface.

In the simplest terms, an API is provided by a company and allows your JavaScript code to interact with their database or features.

For example, Todoist (todo app) offers an API. As a JavaScript programmer, you could use their API and allow your users to add todo list items to their Todoist account from your app.

Other APIs include ones built specifically for web developers. For example, Supabase can manage a database for you and provide an API so your frontend website can store and retrieve data permanently.

Working with APIs is a tricky one to learn, so expect to spend some time grokking the fundamentals here. It involves sending network requests to servers and will introduce new challenges to your JavaScript code solved with asynchronous functions.

✨ Stay inspired

Around this time, your motivation might be dwindling. This is a perfect time to hear from successful self-taught web developers who are just a few months ahead of you and found success.

For example, the Scrimba Discord has an #⭐i-got-hired channel where new developers a little ahead of you post about their success:

A screenshot of the #i-got-hired channel in the Scrimba Discord community, featuring a post by Stevie, celebrating their first Junior Developer role

Building apps with Flexbox and Grid

Flexbox and Grid are intermediate CSS features that enable you to position elements on a web page so that responsive design becomes easier.

When you learned about responsive design, you were probably exposed to Flexbox and Grid already, but now is the time to master them.

If you expertly can turn design files into real, responsive websites, you will be an asset to any company with a website (AKA all of them!)

Learn Git

Have you ever worked on a Word document only to accidentally delete it?

Maybe you deleted a section thinking you wouldn’t need it anymore, only to change your mind and regret it later.

What would you do if you wanted to collaborate on a Word document with a friend without accidentally overwriting each others’ changes?

Since code is almost entirely expressed in text files, it’s possible to run into similar issues, and that is where Git comes in.

Git is a specialised tool designed to track changes in your code files and coordinate work among a team of developers.

As you near the end of your  6 months journey, you may be feeling ready to collaborate with a study buddy or even contribute to an open source project. That would be great, as it’s a perfect chance to practice your collaboration skills (something employers value a lot)! The tool you should use is Git.

All teams use some kind of source control tool, and in 2022, most use Git. If you know it, you’ll be an attractive candidate as you can hit the ground running. It shows you care about collaboration too.

✨ Be a copycat

As a self-taught developer, you won’t have a degree or certification. To stand out, you need to build projects and demonstrate to employers you’re capable of doing the work.

It can be stressful thinking about what to build, and if you’re not that interested in design, you may never feel your apps look “good enough” to showcase. Why not copy your favourite websites for practice?

Once you’ve built something resembling your favourite website, you can customise it to your liking and tell employers a story about why you added those new features and how you coded it specifically.

React basics

React is an example of a web development library. Web development libraries are prewritten code modules that help you quickly build frontend websites.

When you set out to code a website, you could code every aspect of that website from scratch, but there are some common website features that make more sense to use a template for.

You don't need a library, but to save time and work efficiently together, most teams rely on one, and so you should learn React to increase your chance to hit the ground running.

You may find you have a head start because you learned some next-level JavaScript earlier in your journey!

Advanced React

Nobody expects you to be a React mastermind, but you’ll probably end up learning some advanced React features out of necessity as you build your own projects.

Advanced React features include:

  • Routing
  • React Context
  • Higher order Components
  • Hooks
  • And more

Around this time, you might start thinking about building a “showcase project” (perhaps based on a website you copied!) to demonstrate your skills.

It would be brilliant if you incorporated some advanced React features like Context and routing in it, as that will surely mean your app is sufficiently advanced to impress an employer!

✨ Apply before you’re ready

It’s hard to answer “when am I ready to apply for jobs?”

Maybe you’ll wait for a milestone (like completing your bootcamp) or set a date (maybe after 6-9 months, per this guide!)

In general, most new developers wait too long to apply.

It’s understandable because most of us aren’t very good at measuring our own skills and may even suffer from imposter syndrome.

It’s helpful to understand not all Junior developer jobs are made equal. Many companies are prepared to bring you on early (potentially for a lower salary) and give you an opportunity to learn while you earn.

Since none of us are very good at  measuring our own ability, you should apply and let the employers judge for themselves.

That’s exactly what Annemarie, did and she was SHOCKED when they offered her a job! Annemarie had only been coding for 4 months, but the company appreciated her soft skills, determination, and trajectory and was keen to invest in her:

Annemarie Visser (Netherlands): I am thrilled I found Scrimba! I set a radius of 50km around my house and applied to all the jobs. I didn't expect to get any serious responses so early in my journey, but two companies invited me to an interview. One of them is my current job! I never expected to get this far. I thought 5 months experience was too little experience."

Prepare your resume

As you feel ready to apply for jobs, don’t get caught unprepared!

A well-formatted, clear, and compelling resume can help employers understand where you’ve been and where you’re going. Only then can you stand out in a pile of other applicants!

Some top resume tips:

  • Colourful, fancy templates may seem appealing and like they will help you stand out, but companies actually prefer plain Jane PDF templates, as they have a predictable format and are easy to read and share internally!
  • If you have previous work experience, you should highlight those experiences even if they’re not technical! Your track record and soft skills are more desirable than you probably realise!
  • Somewhere on your resume (ideally near the top), list the technologies you feel strong in (HTML, CSS, JavaScript, React, and Git). Not all recruiters know how to code and may find it easy to match the skills on your resume to the job description they’re managing.

Build a portfolio

Your skills are looking sharp! You even have a showcase project (or two)! If you’re really on it, they’ll be hosted on their own domain (like myproject.com)!

Basically, you’re awesome! But if you’re awesome and companies can’t see that at a glance, it might hurt your chances. That is where a portfolio or personal website comes into play:

On your own website, you get to write about why you’re awesome and showcase your best work.

Did you know? Most developers don’t even have a portfolio! Even if you make an average-looking one, you will stand out. Anyway, you can always improve it later!

As for how to build your portfolio, that is up to you.

It may be tempting to build your own portfolio from scratch (way to put your newfound knowledge of CSS and Grid to use!), but a template can work too. Remember, the unique content and projects within your portfolio matter most to companies.

Conclusion

If you want to become a hireable web developer in 6 months without a degree, you should learn the following:

  • HTML & CSS basics
  • Making websites interactive with JavaScript
  • Responsive design
  • Next-level JavaScript
  • Working with APIs
  • Building apps with Flexbox and Grid
  • Learn Git
  • React basics
  • Advanced React
  • Prepare your resume
  • Build a portfolio

Along the way, don’t forget to:

  • ✨ Be bad (we all start somewhere!)
  • ✨ Join a community
  • ✨ Stay inspired
  • ✨ Be a copycat

We recommend you learn in this order, as each step contributes to the foundation needed to learn the next thing. For example, many new developers get excited about React due to its popularity and association with Meta (Meta made and own React). Jumping into React before you have a firm grasp of how to make website interactive with JavaScript or next-level JavaScript will likely be frustrating.

Of course, 6-9 months is an ambitious timeframe to learn to code at a hireable level but it can be done!

We surveyed more than 25 successful self-taught developers on The Scrimba Podcast to understand how much time you need to commit to become a successful web developer. The answer we arrived at is 2-3 hours a day for 6-9 months.  This includes rest, as, no matter how determined you are, you still need to give your brain time to absorb and process new information!

It took some developers more time. Either because they had other commitments (like family) or learned to code part-time. It takes some people longer to grok the basics, but they almost always catch up later, according to our interviews. Said another way, don’t compare your timeline to others!

Everyone's circumstances are different, and our brains all work a bit differently. While we hope this plan lays out the necessary steps, you should take things at the pace that works best for you!