DEV Community

Cover image for How to Get Started Learning Web Development from Scratch
Michael J. Larocca
Michael J. Larocca

Posted on • Originally published at htmlallthethings.com

How to Get Started Learning Web Development from Scratch

Introduction

So, you want to become a web developer, but where do you start? With so much information overload, it can be overwhelming! Rest assured, tech industry experts Matt Lawrence and Mike Karan will put you at ease and help guide you to the appropriate learning path that's right for you in this beginner-friendly article!

Topics covered in this article include:

  • Reasons to learn web development

  • Misconceptions about the time it takes to learn

  • What to learn, and in which order to learn them

  • Different learning paths

  • Recommended learning platforms and resources

  • The value of networking


Why become a developer?

There are many reasons to pursue learning web development, including the potential for lucrative earnings, career change or advancement, and the desire to engage in a creative hobby, to name a few.

Not only is web development an in-demand skill, but with the recent surge in remote work, you could work full-time at home or earn extra money part-time as a side gig!

Reasons Why You Would Want to Become a Developer

  • Lucrative Earnings Potential

  • Opportunity for Career Change or Advancement

  • Engaging in a Productive and Creative Hobby

  • Remote and Flexible Work Opportunities


Misconceptions about the time it takes to learn

Now before you quit your day job and take that "learn everything you need to know in 6 weeks to become a 6-figure web developer" course, Matt and Mike would like to give you a fair warning: you are not going to learn everything you need to know in 6 weeks to become a 6-figure web developer!

Learning web development takes time, patience, and dedication. You cannot master web development in a predetermined set amount of time! Permit yourself to take the necessary time to learn web development and establish realistic expectations.

Remember, practice makes perfect! Like other crafts, such as learning to play the guitar, mastering web development requires plenty of hands-on practice. You won't become the next Eddie Van Halen by just reading music theory books, and you won't become a rock-star coder by just reading programming books! When it comes to web development, you must get plenty of hands-on coding practice. Only then will you start to comprehend the underlining programming concepts.

Most importantly, take your time with the learning process! I'm telling you this because it's tempting to expedite learning to earn a certification. Trust me on this one because I've been there before. If you make certificates and certifications your primary goal and rush to attain them, you may find out that you still need to acquire the skills listed in them when earned!


Foundations (HTML, CSS, JavaScript)

Although there are many web development technologies out there, Matt and Mike advise us to start with the foundations: HTML, CSS, and JavaScript.

HTML

HyperText Markup Language is the standard language for creating and designing websites and web applications. It is responsible for structuring content on the web. (Just don't openly call it a programing language, or you'll get trolled! You'll understand why later.)

CSS

Cascading Style Sheets, a stylesheet language that allows developers to control the appearance and layout of web pages, including colors, fonts, and spacing.

JavaScript

A versatile, high-level programming language used to create dynamic and interactive web experiences by manipulating HTML and CSS elements on a web page.

Matt and Mike advise us to learn them in this order:

  1. HTML

  2. CSS

  3. JavaScript

Starting with HTML and CSS is an excellent approach for beginners, as these two languages complement each other well. By learning HTML, you can structure your content, while CSS enables you to style and format that content. You'll be surprised how fast you can create visually appealing and functional web pages with only HTML and CSS, making for an enjoyable learning experience!

However, JavaScript is a programming language presenting a steeper learning curve. JavaScript requires a deeper understanding of logic and programming concepts. For beginners, diving straight in can be overwhelming and counterproductive.

I can certainly attest to not starting by learning JavaScript first! When I first looked into learning web development, I saw that JavaScript was a highly in-demand skill, so I decided to skip over learning HTML and CSS. I spent almost a year focusing solely on JavaScript, and as mentioned earlier, I rushed through learning because I wanted a certification. I got so frustrated that I nearly gave up learning to code altogether!

Once you have a solid grasp of the foundations of HTML, CSS, and JavaScript, you can confidently move on to learn other technologies, such as Frameworks.


Frameworks - Which one is right for you

What is a framework? A web development framework is a set of tools, libraries, and conventions that simplifies and streamlines web application development.

To give you an illustrative example, using a framework in web development is like constructing something with a box of pre-built LEGO pieces. Both offer ready-made components that you can quickly assemble to create your desired structure, making the process more efficient and beginner-friendly.

Some popular web development frameworks include:

  • React

  • Angular

  • Vue.js

  • Svelte

A great tip to help determine which framework is appropriate for you is to check your local job market. If jobs in your area are hiring developers that know Angular, well, that may be your answer!

If your primary goal is not local employment, you can research each framework and determine which one might be the most comfortable for you to work with.

If you happen to be interested in learning Svelte, Mike is very knowledgeable about it and has written an article on the topic that is published on Scrimba's website! Svelte vs React: Which framework to learn in 2023?

Svelte, unlike other frameworks, compiles your code into highly optimized, vanilla JavaScript during the build process, resulting in smaller bundles and faster load times. Svelte helps you build fast, easy-to-use apps with less effort, making it a great option for creating efficient and lightweight applications.

If you are still trying to decide which framework to learn, React is an excellent option, as numerous companies utilize it, and many educational institutions teach it.


Learning paths

When selecting a learning path, there are primarily three options: traditional school, bootcamp, and self-taught. Each of these paths has its advantages and disadvantages.

Traditional school

  • Pros: Earn a degree, qualify for jobs requiring degrees, structured learning environment

  • Cons: High cost, longer duration, possibly outdated curriculum

Bootcamp

  • Pros: Shorter duration, focused curriculum, networking opportunities

  • Cons: Expensive, intense pace, may lack depth in some areas

Self-taught

  • Pros: Low cost, flexible schedule, self-paced learning

  • Cons: No accredited degree, lack of structure, limited networking opportunities

Matt and Mike offer a fair warning: regardless of the learning path you choose, in today's job market, there are no guarantees when it comes to securing employment, unfortunately.

Although there's no guarantee of successful job placement for any learning path, this insight isn't to discourage you; instead, it aims to assist you in determining the most suitable learning path for your needs.

We can, however, stack the deck in our favor by creating a portfolio of impressive projects, collaborating on open-source projects, and volunteering to make websites for organizations. (The idea is to get viable work experience to supplement your education).

To offer you some encouragement, individuals from each learning path have successfully secured jobs at FAANG companies:

Erik, Alexander, and Dylan took different learning paths and landed jobs at Amazon!


Learn to learn

Whether you opt for a traditional school, a bootcamp, or a self-taught approach, web development is a lifelong journey. As new technologies constantly emerge, you will need to engage in continuous self-learning. As Matt aptly tells us, "You're not going to go back to school after you already graduated to learn Svelte!"

So, to truly excel in web development, you must learn to learn, which involves developing a growth mindset, embracing challenges, and remaining open to new ideas and techniques, even after completing your educational journey.

With this mindset, you will be better prepared to navigate the ever-changing landscape of web development and stay ahead of the curve, regardless of your chosen learning path.


Learning platforms

freeCodeCamp

A great FREE web development learning platform is freeCodeCamp. You can learn the coding fundamentals by directly coding on their website, and you can earn certifications!

As Matt and Mike recommend, you should learn HTML and CSS first. On the freeCodeCamp website, you can learn both and earn the Responsive Web Design Certification! I took this FREE course, and I highly recommend it!

Responsive Web Design Certificate


Scrimba

Scrimba is an online coding school that offers both FREE and paid courses. What is unique about Scrimba is its online code editor. Unlike other static code editors, theirs are screencasts, where a teacher talks you through the displayed code (in an audio-style presentation), and you can pause the screencast and edit the code, making learning to code a much more immersive experience!

If you know who I am, you already know I have a long history with Scrimba, and I can highly recommend learning with them!

If you're interested in taking a paid course from Scrimba, be sure to use the discount code provided, courtesy of HTML All The Things!

Scrimba Discount! https://tinyurl.com/ScrimbaHATT


YouTube

Other self-taught learning paths include learning from YouTube. I've spent plenty of time learning web development on YouTube, and I believe this is a well-curated list of FREE beginner-friendly teachers to learn from:


Practice platform

CodePen is an excellent FREE online resource where you can get plenty of hands-on practice with HTML, CSS, and JavaScript.

Matt and Mike encourage us to learn web development by building projects that interest us, and CodePen is a great place to do it! There is no need to download or install the software; it's all available online!

If you would like to get an idea of what you can build, you can check out my profile on CodePen, which includes projects I completed to earn a freeCodeCamp certification: My CodePen Profile


Networking

Regardless of what web development learning path you decide to take, be PROACTIVE in networking!

Mike tells us that when you connect with others learning to code, you form an "in the trench" style bond with them. Then, when people in your network enter the tech industry, they are likely to reach out to you with employment opportunities when the companies they work for are hiring. Mike tells us this often occurs, making networking an excellent way for you to break into tech!


HTML All The Things

Be sure to listen to the episode!

Episode 248 Become a Junior Developer, Learn Web Development from Scratch

Be sure to check out HTML All The Things on socials!


Scrimba Discount!

  • Learn to code using Scrimba with their interactive follow-along code editor

  • Join their exclusive discord communities and network to find your first job!

  • Use this URL to get 10% off on all their paid plans: https://tinyurl.com/ScrimbaHATT

This article contains affiliate links, which means we may receive a commission on any purchases made through these links, at no additional cost to you. This helps support our work and allows us to continue providing valuable content. Thank you for your support!


My other related articles


Conclusion

When you learn web development, you equip yourself with skills that can provide monetary opportunities, career advancement, or even a fun, productive hobby.

The best way to get started, and discover if web development is right for you, is to start by learning the fundamentals: HTML and CSS first, then JavaScript. You can learn these for FREE using online resources.

If you are seeking employment, it's best to research the requirements of the companies you want to work for. Some companies require a college degree, others do not, and some companies recognize certificates and certifications while others do not. Knowing this will help you decide which learning path is best for you, and supplementing your education with viable work experience will give you a competitive advantage.

Your journey continues after graduation! Web development is a lifelong pursuit, so you must develop a growth mindset and learn continuously to stay up-to-date!

Regardless of your learning path, networking with others along the way could benefit you in the future. Someone in your network who succeeds in making it into the tech industry could reach out to you directly when their company hires, providing you with a career hack to break into tech!


Let's connect! I'm active on LinkedIn and Twitter.


Top comments (0)