What & Where to Learn - Web Development Roadmap in 2020
Tags: beginners, webdev, tutorial, javascript
Published: 2020-10-20 14:12:05

### Before you begin with the Roadmap
- I am sharing a roadmap for learning web-development starting from the absolute beginner stage
- This is not the only way you can become a web developer. You don't have to follow the exact sequence of learning these technologies.
- You can of course mix and match according to your preference.
- I am sharing the courses or tutorials that I found helpful in learning the various web technologies.
- And most importantly, the course creators or instructors haven't paid me to talk about their courses.
- The courses that I am sharing here are for learning `MERN stack` [MongoDB, Express.js, React, Node.js].

## Let's Begin

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/esqtglxqyp0qz0i9fv45.jpg)

The typical roadmap for learning all the technologies for becoming a decent MERN stack web developer would be something like the following 👇

### 🖥️ Front-End technologies: 
> 
- Html
- CSS
 - CSS frameworks like Bootstrap, Tailwind, etc.
 - Preprocessor libraries like SASS etc.
- Responsive Web Design
- Javascript
 - DOM manipulation
 - ES6 features in-depth
- React, Vue or Angular
 - Design frameworks line Material UI etc.
 - Packages like Redux etc.

### 🛠️ Back-End technologies: 
> 
- Node.js
- Express.js
 - REST API with Express.js
 - Authentication in Backend
- Git and Github for version control
- MongoDB
 - Mongoose.js

### 📱 Mobile development technologies:
>
- React Native or Flutter

<hr>

## Courses for learning these awesome technologies
When I started to learn I didn't felt very comfortable reading the documentation for learning something. So I went for online tutorials.
These courses gave me a headstart. And after several months [more like a year and a half] learning these things, I can say that I'm comfortable now to learn a new technology on my own, following written tutorials and documentation.

### For knowing about all the technologies in a single course you can go for the following course. 👉
 - [The Complete 2020 Web Development Bootcamp by Angela Yu](https://www.udemy.com/course/the-complete-web-development-bootcamp/?referralCode=F2958B9D9447BDFC8244)
```
But keep in mind this won't give you in-depth 
knowledge of these technologies. After this course, 
you'll be comfortable working with these 
technologies, and then you have to continue for more 
advanced knowledge.
```

<hr>

### If you want to take more of a modular approach 👉

- For Html, CSS with responsive web design
 - [The Creative HTML5 & CSS3 Course by Dev Ed](https://developedbyed.com/p/the-creative-html5-css3-course) | `very much recommended`
 - [Build Responsive Real World Websites with HTML5 and CSS3 by Jonas Schmedtmann](https://www.udemy.com/course/design-and-develop-a-killer-website-with-html5-and-css3/?utm_campaign=website1010&utm_medium=website1010&utm_source=mycoupon)
- For Javascript and ES6
 - [The Creative Javascript Course by Dev Ed](https://developedbyed.com/p/the-creative-javascript-course)
 - [The Complete JavaScript Course 2020: Build Real Projects! by Jonas Schmedtmann](https://www.udemy.com/course/the-complete-javascript-course/?utm_campaign=website1010&utm_medium=website1010&utm_source=mycoupon) | `very much recommended`
 - [20 Web Projects With Vanilla JavaScript by Brad Traversy](https://www.udemy.com/course/web-projects-with-vanilla-javascript/?referralCode=F9B7C7FED834F91ADE75) | `very much recommended`
- For a complete package of MERN Stack with Node.js, Express, React, Redux & MongoDB
 - [MERN Stack Front To Back: Full Stack React, Redux & Node.js by Brad Traversy](https://www.udemy.com/course/mern-stack-front-to-back/?referralCode=C12928B38906CA29181F) | `very much recommended`
- For React.js
 - [React Front To Back by Brad Traversy](https://www.udemy.com/course/modern-react-front-to-back/?referralCode=E43D257CE81EC8218FC9)
- For Node.js with Express and MongoDB
 - [Node.js API Masterclass With Express & MongoDB by Brad Traversy](https://www.udemy.com/course/nodejs-api-masterclass/?referralCode=F95A0D3B9CA1DB648F55)
 - [Node.js, Express, MongoDB & More: The Complete Bootcamp 2020 by Jonas Schmedtmann](https://www.udemy.com/course/nodejs-express-mongodb-bootcamp/)
- For Mobile development with React Native
 - [The Ultimate React Native Series by Mosh Hamedani](https://codewithmosh.com/p/the-ultimate-react-native-course) | `very much recommended`
- For Mobile development with Flutter
 - [The Complete 2020 Flutter Development Bootcamp with Dart by Angela Yu](https://www.udemy.com/course/flutter-bootcamp-with-dart/?referralCode=2B7724A180C0502A2547)

Hope you will have a good time learning these 😄. 

Again I'm saying, none of the instructors of the mentioned courses sponsored me to write about their courses.
I am sharing these because some of these courses helped me a lot to learn about web development and I'm very grateful to these awesome people for making these tutorials.

Show some love if you like my blogs.

Thanks for reading 😃.

---

Find me around web 🕸:
- 💻 Visit my [Website](https://soumya-dey.github.io/)
- 🌟 Check out my [Substack](https://soumyadey.substack.com/)
- 😸 Check my [Repos on GitHub](https://github.com/Soumya-Dey)
- 🦊 Check my [Repos on GitLab](https://gitlab.com/Soumya-Dey)
- 📦 Check my [Packages on NPM](https://www.npmjs.com/~soumyadey)
- 🔗 View my [Profile on LinkedIn](https://www.linkedin.com/in/soumya-dey-kolkata/)
- 📝 View my [Blogs on Dev.to](https://dev.to/soumyadey)
- 😜 Follow me on [Instagram](https://www.instagram.com/soumya_sl/)
- 📚 Check out my [Goodreads Profile](https://www.goodreads.com/dobby_the_free_elf)
- 📪 Contact me [Here](mailto:soumyadey200@hotmail.com)