React Basics
React Take a dive into the React world, complete with the brand new Hooks API. Learn how to “think” in components, dataflow and master JSX to build React applications the modern way. Starting from the beginning you’ll learn all the main concepts of React, the best practices and comprehensive chapters will allow you to deep dive. Then, put your new knowledge together by building a real-world React application.
Author: Almero Steyn
The Missing Introduction to React • 6:52
The Missing Introduction to React - Job-ready training
- Skill up your team
- Expert knowledge
- Certificate of completion
- Stream or download
- Best practices included
- Closed Captions (subtitles)
- 30-day guarantee
- Slack community access
Topics you'll learn
- Component Architecture and Theory
- Deep JSX understanding
- Functional Components and Props
- React DOM vs Browser DOM
- Building Functionality
- Thinking In Components
- Fetching Data over HTTP
- Router Basics
- Accessible Forms
Ultimate Courses is fantastic. My engineering team is building apps better than ever. In-depth training that pushes new standards.
Jordan Epps
Introduction to React
The Missing Introduction to React
06:52
Rendering view in React
Rendering view with HTML
01:57Bootstrapping React in HTML
02:07Render an element with React.createElement
03:30Rendering nested elements with React.createElement
04:34What is JSX?
03:34Creating view with JSX
04:49The relation between HTML and JSX
04:15Accessibility and ARIA in JSX
02:38Interpolating values in JSX
03:58Using expressions in JSX
06:23
Introduction to Components
Introduction to Components
05:52Pure functions
03:12Components as functions returning view
04:11Passing props to Components
05:15The children prop
06:43Setting up a dev environment with create-react-app
11:07Isolating Components as exports and imports
04:26Adding an event handler to an element
07:12Adding state with the useState hook
07:31One-way Data Flow in Components
07:43Building re-usable Components
09:43
The React virtual DOM vs the browser DOM
Introduction to the React reconciler
06:12Introduction to the React Dev Tools
08:32
A deeper dive into Components
Conditional rendering with an if statement
12:02Conditional rendering with the ternary operator
01:27Conditional rendering with the boolean AND operator
03:59Interpolating Arrays in JSX
03:14Exploring Array.map
04:04Using Array.map to render an Array
02:56Understanding the key prop
12:11Filtering collections client side with Array.filter
08:20Mapping an Object to view
04:07Handling basic side effects
13:40Understanding shallow dependency checks
05:29Using the empty dependency Array in useEffects
07:31Cleaning up after side effects
11:05JavaScript closures and the useEffect hook
17:11
Forms in React
Creating controlled Components
10:29Binding multiple form controls to Component State
08:54Submitting form data
05:51Updating form State from code
03:31Using a textarea
03:56Using a select
04:55Using a checkbox
04:35Grouping checkboxes together
06:52Using radio buttons
08:17Loading data into a form
09:48
Thinking in Components
From design to rough Component outline
04:09Building a static React view from the design
21:27From static view to statefull app
15:48Making sure the app is accessible
06:55Identifying re-usable code
15:48
HTTP Requests
Understanding HTTP requests
04:47Create a basic HTTP server in Node Express
05:48Fetching data from the server
15:00Sending data to the server
09:44Avoiding State changes on unmounted Components
04:51Using async/await
03:36Setting custom HTTP headers
03:21
Routing
Adding React Router to your application
11:29Navigating with the router’s Link Component
06:36Understanding route parameters
13:53Updating the browser title
09:49Making routing accessible
09:29
Or get the complete bundle...
Everything you need to start mastering today
React Master Bundle
8 hours • 72 lessons
React Kickstart Bundle
8 hours • 66 lessons
Perfect for Teams
Skill up your development team quickly. It's easy to get your team onboard with us! Get special team discounts, progress reports, team upgrades and much more.
100% money back guarantee
We’re proud to be empowering thousands of developers, beginners and experienced pros. If you’re anything less than 110% satisfied, let us know within 30 days and we’ll refund you in full.
Student/Location discounts
Not-so-good exchange rate? (i.e. India/Brazil) Get in touch for a coupon. Student? Email us from your student email or attach your student ID.
Powering the world's best developers and teams
I can't think of any Angular course training that I trust to be more accurate, and promote the best practices, than Ultimate Courses.
Jules Kremer
Ultimate Courses is fantastic. My engineering team is building apps better than ever. In-depth training that pushes new standards.
Jordan Epps
I've spent $1,500 dollars in the last 6 months trying to learn what you gave me in a single course.
The clearest and best produced courses on the market! Clear, concise, packed with best practices.
An immense job breaking things down into simple concepts. I would strongly recommend Ultimate Courses.
Self-paced, comprehensive, real examples from beginning to end, clear and concisely brilliant.
Todd's Angular courses are one of the best online trainings that can be found. A+.
I’ve achieved the structure and organisation that is difficult to get on your own. Excellent.
The courses are incredible. You've opened the door for me to build real Angular apps.
I've learned and understood so much in such a short amount of time, it's unreal!
A fast track to becoming a super solid Angular developer. Detailed, easy to understand, brilliant.
This course is the best resource for learning Angular. The Angular Pro course is incredible.
Fantastic courses explained incredibly well. Very easy to follow and understand concepts. 10/10.
Landed my first job after taking these courses, not sure I'd have made it otherwise.
A must have for anyone wanting to become an Angular developer. I learned incredible amounts!
You've helped me grasp architecture of Angular apps, and the way it should really be done.
Todd condenses all his hard earned knowledge into a time-saving learning process.
The best place to get started with Angular, and go straight to the advanced material.
Todd's in depth knowledge of Angular was fantastic, and the TypeScript explanations are superb.
Extremely helpful in breaking down concepts into something beginners can understand.
Goodbye books and lectures, hello Ultimate Courses. Intuitive, enlightening, and refreshing.
The best resource for anyone wanting to get started with Angular, and go way beyond.
The content has been well thought out, everything fits together perfectly.
Everything you could to learn for Angular. The courses ask "why?", and responds with the answers!
I've come up to speed immediately. I was lost and confused before this course, a brilliant job.
I attempted other courses before these, and Ultimate Courses is way ahead and incomparable.
Hands down the best courses available. Daunting concepts aren't scary anymore, they're a breeze.
Ultimate Courses is a fantastic way for you and your team to start writing quality code.
Very few break down concepts in such a digestable way. Full of vital real-world techniques.
Ultimate Courses gives you an edge. Bursts of knowledge that really step up your game.
Crystal clear concepts, meticulously designed examples and projects. Fantastically valuable.
The best Angular instructors out there with unrivalled knowledge. First-class Angular courses.
The essentials of architecture, combined with organisation and advanced tricks.
If you want to finally understand Angular and TypeScript, you're in the right place.
The Angular courses are the best you'll find. They've taken our skills to the next level.
Absolutely love these courses, I've built my first proper app. Recommended to all.
The real ultimate guide to Angular. Thank you for all your contributions to the community.
The Angular courses have been indispensable for me getting things done, the right way.
Hands down best start to finish NGRX course available. 10/10.
The first course I've ever watch to the end. I've immediately grasped NGRX Store and Effects!
This course is incredible and laid everything out for me in a few hours. I've fallen in love with NGRX!
There's no material available like this online all in one place, fantastic.
