Me
Back
— · 4 Min read

Resources to learn Web Development - React, NextJS TailwindCSS and everything before that.

It's been a couple months since I've dived deep into web development, and after some amazing projects like Tweets.beauty, LMFAO.tech and many more, I've realised that the best way to learn web development, is to learn React. In terms of framework, I don't think there's anything close to how powerful NextJS is. So here's a collection of resources I used, to learn React and NextJS.

I'll only point out resources that are free, or you can get them for free.

I'll walk over how I did it, but I'll also point out what the best way would have been.

Pre requisites

So before starting, you need to make sure you atleast know these basics

Javascript

A basic understanding of Javascript is essential. Learning javascript would make everything 100x easier for you.

Resources - Javascript

I learnt Javascript on Educative.io. I had the subscription to the course thanks to the Github Students pack

so,

I later also found this course on Scrimba, which also seems to be REALLY good. Learn Javascript for free

But well, javascript is an insanely weird language. you MUST know typescript too. But that's not an issue for now - you can switch to typescript slowly.

javascript lol

HTML

HTML is a very basic language. It's not a programming language. It's just a markup language. Anyone can learn HTML in a couple of hours.

Here, a really cool interactive HTML cheatsheet

Honestly, this is all you'll need to know

Cheatsheet

Resources - HTML

For HTML, one of the best resources is W3Schools.

React

Ok, now it gets exciting! You've already learnt a lot of Javascript and HTML - and now you want to learn React.

I learnt react (mostly) on youtube. When I searched for "react tutorial", I found a lot of videos - but ugh, many of them were too long.

Resources - React

The best video that also helped me was this one by traversy media

  • Scrimba also has an amazing react tutorial which my friends used - Learn react for free | Scrimba. Scrimba is fully interactive, it's a really good resource and also free! In fact, it's so good that it provides the editor and video in the same website side-by-side!
  • CodeDamn also has an amazing react tutorial - Also fully interactive! It also has a youtube video if you don't want to bother with the website.
  • If you don't mind paying a little bit, I've heard good things about UI.dev's react tutorial.
  • I also didn't know that the new react beta docs also have a tutorial - Which is honestly really good React Beta docs

NextJS

For NextJS, once you're good with react, there's literally no better way to learn it than to go through the Next.js learn.

It's documented really well and is also sort of interactive, as you're building a blog website and learn things along the way.

I also love This video by CodeDamn but it's outdated now

TailwindCSS

For tailwindcss, I'd say, it's very easy to learn. It's just about using little classes to style your components.

Tailwindcss Docs - Tailwindcss Docs were very helpful to me. The tailwindcss youtube channel is also really really good for learning little tricks and tricks.

If you like learning from videos, this video, again by traversy media is a really good quick tutorial Tailwind CSS Crash course - Traversy Media

Conclusion

That's it! I hope you've learnt a lot now. If you have any questions, feel free to ask!

What resources did you use to learn? Comment down below!