JavaScript From 0 to Mastery: My Personal Playbook for Conquering Web Development
Tags: javascript, tutorial, beginners, webdev
Published: 2023-11-17 19:04:33

Okay, so you have some background in programming, but JavaScript still seems a little scary. Or maybe you're learning it from scratch right now.

This is what I would tell you if you asked for my opinion.

I'm sure there are many other learning paths out there, as well as different viewpoints, and hopefully, readers will contribute below with their comments ❤️.

### My current opinion on Codecademy ⛔️

To be honest, I'm not a big fan of Codecademy.

From what I've seen, it tends to take very small steps, and students might feel like they're not learning quickly enough or may feel confused when facing a real project.

Maybe it's because I'm not very familiar with it and have only seen some initial courses. If you've had a good experience with Codecademy, please drop a comment below to offer fellow readers a more complete perspective.


---

## Support us! 🙏⭐️
By the way, I'm part of the WebCrumbs team, and it would mean a lot if you could check out our no-code solution for Node.js that simplifies web development. [Giving us a star](https://github.com/webcrumbs-community/webcrumbs) would be fantastic.

We're putting in a ton of effort to help devs take their ideas to a live website as quickly and easily as possible (think: effortless plugin and theme integration), and every bit of support is truly appreciated!

{% cta https://github.com/webcrumbs-community/webcrumbs %}⭐️ Give WebCrumbs a Star! ⭐️ {% endcta %}

Ok. Now, let's dive right back into JavaScript!

---

### _Mise en place_ 🍲

It's a French culinary term that chefs use to mean everything is in its right place. It refers to the setup before the cooking begins.

Just like in cooking, I'd start by ensuring I have all the right tools installed and that I know how to start a new project.

Make sure you have an IDE (Integrated Development Environment), which is like a modern text editor for programming, full of useful features. A popular choice is [Visual Studio Code](https://code.visualstudio.com/) and it's free.

Then [install Nodejs](https://nodejs.org/en). It's not necessary to run plain JavaScript, but most JavaScript-based frameworks will require it.

I wouldn't want to proceed in too small steps, so I'd choose a JavaScript library/framework from the start. I suggest React because it's really popular and required by many companies, but be aware that there are many others (like Angular, Vue, Vite, Svelte, and React derivatives such as Next.js and Gatsby).

An easy way to start a React app is by using [create-react-app](https://create-react-app.dev/docs/getting-started/). Run it (with `npm run dev`). See the app you've created (see it live at `https://localhost:3000`). Explore the code. If you're familiar with static web development, you'll recognize something familiar in some files, although it officially uses JSX, not HTML.

### Cut some paths with online courses ✂️

I am a big fan of [Stephen Grider](https://www.udemy.com/user/sgslo/) as a web development instructor. It's no accident he has 1,328,858 students and almost half a million reviews. This is free advertising.

I think he's that good. But I also understand that learning styles vary from person to person. So before purchasing all his courses, perhaps watch some of the free previews and try a course to see if it suits you.

I'd be cautious when choosing online courses because some are more advanced than others. To start, I'd recommend [**Node with React: Fullstack Web Development**](https://www.udemy.com/course/node-with-react-fullstack-web-development/) or any similar course.

### Practice makes perfection

Programming is the art of failing fast, or the art of debugging. Don't be afraid of errors. They are your best friends as a developer. Trust me. There's even a well-known methodology that involves making errors intentionally while writing code (Test Driven Development or TDD).

Start many projects on your own machine. Then learn how to deploy them on platforms like [Heroku](https://www.heroku.com/) or [Vercel](https://vercel.com/), to begin with - [AWS](https://aws.amazon.com/) is a bit more advanced, but not out of reach.

When you feel ready, join open-source projects. They're a great way not just to practice, but to learn the workflows of more experienced teams. It's really valuable to learn how to collaborate in groups.

If you're looking for a beginner-friendly open-source project, ours offers all the support you need. We even have a "contributions 101" guide waiting for you in our [Readme.md](https://github.com/webcrumbs-community/webcrumbs) (it's called [WebCrumbs](https://github.com/webcrumbs-community/webcrumbs)). But even if you opt for another project, I'm happy. The important thing is to always keep learning.

Keep coding!

{% cta https://github.com/webcrumbs-community/webcrumbs %}Start your open source journey with me :){% endcta %}

{% cta https://github.com/webcrumbs-community/webcrumbs %}We're building the Wordpress for Javascript{% endcta %}