Nice transition from Petr’s courses about animation to React world. Fantastic work like always Petr.
Jaroslav Horak
Short videos where the explanations are not so fast, no too slow, 100% practical classes.
Fernanda Najah
One of the most organized and structured courses for React I’d seen. 10 dead tomatoes out of 10.
Mark Omarov
Find out exactly what you will learn inside of the course.
Some of the questions answered in this course.
Is this for you?
What will you learn?
What do you need before start?
Are you an advanced beginner? This is for you:)
HD videos explaining the basics of React.js!
| Module 1 | Collapsible Component (2020) |
| Unit 1 | R101 - Project Setup - 3:14 |
| Unit 2 | R101 - Components Structure - 4:03 |
| Unit 3 | R101 - Styled Components - 7:06 |
| Unit 4 | R101 - useState - 6:35 |
| Unit 5 | R101 - useRef - 6:05 |
| Module 2 | Fetching Data (2020) |
| Unit 1 | R101 - useEffect - 5:11 |
| Unit 2 | R101 - useEffect with fetch - 6:45 |
| Unit 3 | R101 - isLoading state - 8:58 |
| Unit 4 | R101 - Custom React Hook - 7:23 |
| Unit 5 | R101 - Export function from custom hook - 3:54 |
| Module 3 | Collapsible Component |
| Unit 1 | R101 - #1 - Introduction and setup - 5:08 |
| Unit 2 | R101 - #2 - Passing children to React component - 5:27 |
| Unit 3 | R101 – #3 – Conditional class rendering - 6:08 |
| Unit 4 | R101 - #4 - Calculating height of an element - 6:04 |
| Module 4 | Fetching Data |
| Unit 1 | R101 - Fetch - #1 - Creating the initial loading State - 8:14 |
| Unit 2 | R101 - Fetch - #2 - Using the Fetch API - 8:46 |
| Unit 3 | R101 - Fetch - #3 - How to use localStorage - 7:34 |
| Unit 4 | R101 - Fetch - #4 - Checking the time since a timestamp - 7:45 |
| Module 5 | Currency Converter |
| Unit 1 | R101 – Currency – #1 – Loading data into state – 11:59 |
| Unit 2 | R101 - Converter - #2 - Filtering through data - 7:30 |
| Unit 3 | R101 - Converter - #3 - Conversion calculations - 10:47 |
Free forever, Instant Access
Modules 1 and 2 (60min) has been added to React 101 in May 2020 and cover React Hooks API. Modules 3,4 and 5 contain older React Tutorials. Feel free to skip them, but you might pick some other React tips there too.
No, video files are not available for downloads. You need to be online and logged in to my site to be able to follow this course.
Yes, you need to have some basic React and modern JavaScript knowledge. I recommend going through the React Tutorials 2017 playlist on my YouTube channel first.
React.js is used by some of the most popular online apps such as Facebook, Instagram or AirBnB. Knowing how to use React will open a whole new spectrum of possibilities for your own project or your next career move.
All you need is a code editor (I am using VSCode). You can download the starting files and follow me step-by-step from start to finish of each project.
For any other questions use the Get In Touch form or hit me up on Twitter @ihatetomatoes.
Here is what others think
about the React 101.
A really great course if you’re already somewhat familiar with React but want to reach the next level.
More up-to-date than most tutorials found on YouTube including how to use hooks and styled components effectively.
Learning React can be quite a daunting challenge. But React 101 is the perfect introduction.
Things just click. And then you’re away.
I’ve taken both React 101 and ‘React for Beginners by Wes Bos’ and in my opinion React 101 is a better introduction.
As with all of Petr’s tutorials, the code for this tutorial is very thoughtfully put together.
Great care is taken in order to step the learner through some difficult code. The lessons are NOT intimidating and surprisingly fun! And because they are fun you remember the essential principles taught!
I feel much more confident in react & feel prepared to take on larger projects without fear–thanks to these carefully crafted lessons.
This is what good teaching looks like.
Many thanks, Petr!
Petr never disappoints! This course should get anyone from an advanced beginner to a pro of React. Thanks
I didn’t expect this course to be so great!
Short time videos full of useful information, without any unnecessary husk, amazing! It’s worth the time!
I have completed Module1 of React 101 so far. It is excellent. I really learnt a lot.
I love that you explained which lifecycle method will come first. Detailed and clear and simple. Real examples with techniques to write your code. Love it! Great course!
One of the most organized and structured courses for React I’d seen.
Clear voice and good quality tutorials.
Easy to follow and simple to understand, top React course.
Even if you don’t have much experience with React you will learn a lot from these real world examples.
10 dead tomatoes out of 10.
Great course for everybody who wants a quick overview of React’s basic capabilities.
Petr is THE BEST teacher!
Short videos where the explanations are not so fast, no too slow, 100% practical classes.
I’m a beginner and searched a lot of resources to learn React, and with Petr I’m finally really learning! =)
Petr is a great teacher.
He is very knowledgeable and available for help when you need assistance.
I have gone through other React tutorials but this one has by far the best explanations and demos.
What sets this React tutorial apart from others is that not only its easy to understand while following along, it includes a Bootstrap CSS framework which I always use to build responsive websites quickly.
HIGHLY RECOMMEND this course for those looking to learn ReactJS.
Consider watching his Webpack 2 and React Tutorials on his YouTube channel as well. This will help you transition quickly into learning this course.
May be fast for someone’s first tutorial, but if you’ve looked at React before, this is awesome!
Petr tells you what he’s doing and gives good brief descriptions as to what is going on.
Awesome course! Great work. I like the last video on how he recommends we try it ourselves first.
Nice transition (get it? TRANSITION hehe) from Petr’s tutorials about web animation to React world.
Petr cleverly put all the dull (but necessary) stuff about React environment setting on his Youtube channel and make this course purely about React.
It is great course for beginners. I really enjoyed it. Fantastic work like always Petr!
If you are sick of making TODO apps this is the Course for you.
The example apps have a real world feel.
Everything is well explained from the React concepts through to the tools used. This is an outstanding course.
Incredible tutorial on how to use hooks with React. This course finally made it click with me. And it’s very nice that there’s some styling sprinkled in too!
I’ve never looked at React before this course, so it was a tad bit fast for me, BUT Petr is an excellent teacher and I understood every concept he went through.
I will definitely be going through the tutorials on his YouTube channel to learn more! Thank you Petr!
I am a fresher full-stack web developer. This course is very clear and suitable for me. Hope you can make more courses like this!
Excellent work 🙂
I’m a newb to React and being able to hear how Petr talks through his code helps me to understand it better as he moves through the app.
I feel like it was time that was well spent going through this course.
Thanks Petr! Have you tried campari tomatoes? They’re wonderful! 🙂
It’s a great tutorial. Explained things very well even the beginners will be able to start from scratch and run with it.
Love the way things are explained.
Thank you, Petr. These tutorials were very insightful and simple to follow.
Excellent course. Everything explained very well. Recommended for anyone learning react. There are’t many React.js courses with examples like this one. Thanks Petr for this amazing course.
Great intro into building with React. Looking forward to the React workshop being available.
This is by far the best tutorial on React I’ve seen.
I especially enjoyed the pace and the clear explanations.
Highly recommended !!!
Great job Petr and I will surely be checking out the workshop.
I liked it too much. The fundamentals of React are cleared for me. I am waiting for React Workshop. Thank you.
Excellent
Sorry my english is very poor, but your course is awesome! Thanks.
The course has been good. I like that it’s been broken up into small manageable chunks.
Petr thanks! Great course, simple to learn, your step by step approach is very functional.
It isn’t only a tutorial, it’s a full immersion in the working method of an amazing front-end designer!
Awesome! Keep up the good work!
I loved this course. Peter explains really well everything that he is doing and at the right pace (not too slow, but not foo fast either).
The materials were also very helpful. I feel now enabled to work on something on my own 🙂 Thanks!
I already have a bit of experience with React.js anyway I highly recommend! This is a great way to start or reboot the basics.
This tutorial is unique. Petr knows how to lead you step by step in React learning. Thanks!
I love these tutorials, practical and up-to-date.
Good videos, I just finished a full-stack boot camp with JavaScript/React and this was good review prior to jumping into the advanced React Workshop.
This is a really helpful React tutorial. I feel like I’m learning so much faster than reading something and it’s project based so that always helps. Thank you.
♥
Made by Petr Tichy
Now that you are at the bottom of the page, why not to do some clicking instead of scrolling and reading?