DEV Community

loading...
Cover image for Learning React

Learning React

crabyke profile image Duzmath Lajos ・1 min read

I have started learning React yesterday.
I have put into that like 10 hours, since yesterday morning, but I feel like, I have ZERO clue what is going on.

I would like to kindly ask you fellow developers, to send me sources where I can understand the basics of this library.
Brad Traversy's course was waaaaay to much and I had to leave the 2 hours video at the half of it, because there was too much going on.
I am now doing Dev Ed's Todo list app but it's also too much and every one of these tutorials are too fast for a beginner like me.

I feel like I have kind of good understanding of Vanilla JS, but React is a totally different cup of tea.

Please help me :(

Thank you in advance!

Discussion (32)

pic
Editor guide
Collapse
hijazi313 profile image
Muhammad Hamza Hijazi

Brad is a teacher who covers everything related to full stack development. But I was unable to understand most of his tutorials, I don't know why but it's true. But it didn't stop me from watching his tutorials I love his tuts.

Now let's come to you, as you have just started learning React , so you are a beginner and you will find many things difficult to digest at this stage, but don't worry bro, it's natural.

In order to learn React I personally think one should know about Javascript and Especially ES6+ and how some of it's features work under the hood.
Then there are some topics which you should know , First learn Working with class based components and try to learn each and everything with those Class Based components e.g working with props, define methods, how to manage a component local state with this.sate and how to effectively update state with setState and some of the Lifecycle methods which will help you to run some block of code at specific stages in your program i.e componentWillMount() etc.

Then you should know about Higher order components and why we need them and how to use them.
What are pure components ?
Working with refs
Routing with react-router-dom
Passing properties within different components. And propType checking
prop drilling and State management with Context API concept.
Form handling with React. React Events
Then start learning about React Redux, how to manage state with React-redux.
After learning all these move to functional components and learn about react hooks which help you to manage state and provide lifecycle methods in functional components.
Then learn how to consume data from third party REST APIs.
How to perform authentication, and Protected Routes in your app.
You should also know how to style properly your react apps and their components. Learn any famous UI library such as Material UI, ANT Design, Tailwind css.
I hope learning these things will make you a better react developer.

Collapse
sergiogracia profile image
Sergio Gracia

The tutorial from the official React page (reactjs.org/tutorial/tutorial.html) helped me a lot in the beginning.

Just grab a coffee, relax and read it slowly. I'm sure you'll get it sonner than later ;)

Collapse
raibtoffoletto profile image
Raí B. Toffoletto

Second that. I started from there and moved to freeCodeCamp later.

Collapse
sanchitbhasin profile image
Sanchit Bhasin

Hey man, if you have gone through react crash course by Brad traversy on YT
Then I would say react can't be added to ur skills in just 2 hrs. I am also learning react by colt Steele's course on udemy
You can also go through the original docs - reactjs.org but I would recommend also enrolling in a course by some good teacher and just hustle 🔥

Collapse
ronniemunter profile image
ronniemunter

Colt is really great, I've followed his full stack academy, very complete and you can always follow the updates

Collapse
neo42 profile image
Hao Jiang

I would recommend Kent C Dodds's free react intro course on egghead.io. Hands-on & succinct. But you might want to slow the video down while typing things out.

If you don't mind premium content, highly recommend ui.dev by Tyler Mcginnis. Really great explanation on all building block concepts of react.

I felt exactly the same way when I started learning react. Then I tried to explain each concept to myself. If I couldn't explain it well, I would go back to where it comes from and understand it. Hope this helps.

Collapse
mpagels profile image
Martin Pagels

Here you can find the hole react documentation "translated" to function components and hooks. It's a much modern approach to code in react.

reactwithhooks.netlify.app/

Collapse
shafaqshaikh profile image
shafaq shaikh

Hey , you have made an awesome choice by starting to learn react , to start with react you should go through the react officials documentations , they have very good and much understandable docs , and if you want to learn by tutorials then you should go for a Maximilian react course on udemy it's a crazy course for begginers .you'll learn alot by this course

Collapse
rokingcoder33 profile image
Ralph King Jr

I see Udemy suggested several times in the comments. Check with your local library to see if they have a Udemy license so you can watch videos for free. For example my library has a page with all the elearning ( aacpl.net/elearning ) they offer. That being said, please consider paying for courses you find useful.

Collapse
pixeledcode profile image
Shoaib Ahmed

How proficient are you with javascript?

Collapse
crabyke profile image
Duzmath Lajos Author

How can you measure that :D

Collapse
pixeledcode profile image
Shoaib Ahmed

Experience is one thing. Wouldn't suggest someone to learn react or any framework/library if they are new to JS.

Thread Thread
crabyke profile image
Duzmath Lajos Author

I made some stuff in JS, like for 2-3 months straight.
I have my other posts here, which shows my JS skills a little bit. (I am not expert tbh)
dev.to/crabyke/border-radius-gener...
dev.to/crabyke/rock-paper-scissors...

What I just figured out, that function arguments and parameterst are my weak points in JS tho.

Just want to step a bit up, because this year, I would like to find a job in the development industry and for most of the places, React is essential.

Thread Thread
pixeledcode profile image
Shoaib Ahmed

I would say you have enough experience tbh. If you're not digging react, maybe go with vue?

Thread Thread
crabyke profile image
Duzmath Lajos Author

I will just give some time to React, I guess.
Sooner or later it will turn out if it is my cup of tea or not and I think, a basic knowledge (even if I might not like it) is good to have.

Collapse
brysonpdavis profile image
brysonpdavis

fullstackopen.com/en/
has the best introduction to react o have yet found in part 1 of the course. and if you're interested in more advanced features like redux, routing, testing, etc those have dedicated units later in the course.

Collapse
raibtoffoletto profile image
Raí B. Toffoletto

How about start from FreeCodeCamp written exercises?? They are slow and well explained, they start with ""classic"" React and Redux, and later on you can start looking into Hooks and ReduxToolKit for better fluency.

I'm sorry I don't have videos to suggest, I learn better from written sources and documentation. (old guy here)

Collapse
adamdsherman profile image
AdamDSherman

I found this tutorial quite clear and concise: taniarascia.com/getting-started-wi...

Collapse
hijazi313 profile image
Collapse
hijazi313 profile image
Muhammad Hamza Hijazi

I will suggest you to give some time to Udemy, Udemy courses are far better than Youtube tuts.
Stephen grider and Andrew mead are very good instructor.

Collapse
redfoxfinn profile image
RedFoxFinn

One to recommend is this:

fullstackopen.com/en/

It's MERN-stack targeting course from University of Helsinki and it really has high quality materials.

Collapse
simpleadam profile image
simpleAdam

seeing as you are new to programming,

  1. those tutorials only cover parts of what you need.
  2. it is normal to take a long time to understand even "simple" apps.
Collapse
kelvindisi profile image
Kelvin Ndisi Wambua

I would suggest freeCodeCamp there is a nice 9hrs length video with a very easy introduction.

Collapse
crfries profile image
crfries

youtu.be/4UZrsTqkcW4

This video gave me a much better understanding. He explains everything so well

Collapse
markanthony999 profile image
markanthony999

Look at it like mini web pages integrated in an overall design. At least that's helps me out...sometimes.

Also, look at different people. Each individual has a different way of describing things.

Collapse
amirreza_dev profile image
Amirreza

I would recommend Codecademy! They are awesome I mean not only you can learn React js but also they give you projects to solve! (Premium Version) so give it a try or you can go for reactjs.org docs

Collapse
karanvk profile image
Karan V

Try Maximilians course on Udemy udemy.com/course/react-the-complet...

Collapse
owaisakber profile image
owaisakber

github.com/owaisakber/30-Days-Of-R...

Try this 30 days react course. It might help u

Collapse
arekmal__ profile image
Tamago™

Try go to scrimba.com it is really beginner friendly. It comes with built in web editor

Collapse
crabyke profile image
Duzmath Lajos Author

Thanks everyone for the tips!

Collapse
ronniemunter profile image
ronniemunter

Maybe I would advise to get used to this library by following short project based videos on YouTube, like 10 minutes long. Also I find that focusing on what you expect from the technology is very important to your motivation in learning it.

Collapse
mohammadhilal1 profile image
MohammadHilal1

You can start with react documentation(reactjs.org) and if needed some video content can go with codevolution you tube channel. He has some good stuff related to react and explained everything very nicely. It is easy to understand the basics of react and as you get comfortable with you can go further as mention by other people's below in the discussion.