Autoplay
Autocomplete
Previous Lesson
Complete and Continue
React.js Academy for Beginners with Firebase
Welcome and let's get started!
Welcome to the course (2:39)
What we will be building (3:55)
What you will need for this course (2:08)
Project setup and Components
Create React App (4:13)
Project files & folders (11:35)
A closer look at components (3:28)
Components in action (11:47)
Props, State & Looping
First look at state and JSX (11:09)
Component lifecycle and looping (5:35)
Passing data as props (15:02)
Passing methods as props (16:00)
Prop type validation (10:00)
Forms, inputs and refs
Controlled components (15:52)
Uncontrolled components and refs (9:32)
Create new card form (6:22)
Routing
Setting up react router (8:34)
Passing props to a router component (3:36)
URL parameters (6:45)
Using withRouter and push (7:36)
Passing state via router (5:10)
Setting up Firebase, reading & deleting data
Setting up Firebase (10:22)
Pushing data to Firebase (14:22)
Reading data from Firebase (15:28)
The where & orderBy methods (17:29)
Deleting cards and lists from Firebase (8:41)
Deleting boards (14:39)
Updating data and Modals
Updating data in Firebase (9:41)
Edit card modal (13:37)
Updating the card text (9:04)
Setting the labels (8:07)
Text area auto resize (5:57)
Reading realtime data from Firebase
First look at onSnapshot (6:34)
Working with document changes (3:51)
Realtime cards with updates (7:08)
User authentication and React context
React Context API (12:21)
Firebase Authentication and set up (6:36)
User sign up (5:05)
Logging in and out (8:55)
Listening for auth changes (3:31)
Conditional rendering (14:07)
Rendering boards based on user (5:02)
Redirecting and error messages (11:31)
Roles and permissions (10:27)
Deployment
Building for production (3:02)
Deploying to Netlify (4:48)
Thank You
Thank you (1:34)
Keep on learning
Teach online with
Working with document changes
Lesson content locked
If you're already enrolled,
you'll need to login
.
Enroll in Course to Unlock