Search 6,000+ CA Community College Courses

Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

freeCodeCamp

React JS Course for Beginners - 2021 Tutorial

via freeCodeCamp

Start learning Write review

Overview

Embark on a comprehensive 7-hour React.js tutorial designed for beginners, covering fundamental to advanced concepts through the development of a real-world application. Master React essentials including JSX, Styled Components, React Router, state management, props, context, and hooks. Dive into API handling, TypeScript integration, and state persistence using SessionStorage. Learn to deploy your application to Netlify and explore bonus topics such as class components, TypeScript refactoring, and implementing a login system with TMDB API integration. Build a feature-rich movie database application while gaining hands-on experience with modern web development practices and tools.

Syllabus

) Introduction.
) The App.
) The Movie DB - API Key.
) What is React? .
) Starter Files.
) Quick about tooling.
) Bootstrap with CRA.
) Install dependencies.
) Copy fils from starter files.
) Setup API Key and walkthrough of API files.
) React without JSX.
) Short about JSX .
) Crash course in Props and State.
) Short about Styled Components.
) Global Styles.
) Header Component.
) Header Component - Styles.
) Home Component - Scaffold.
) Short about built-in hooks in React.
) Fetch data from the API for Home Page.
) Custom hook for Home Page.
) HeroImage Component.
) HeroImage Component - Styles.
) Grid Component.
) Grid Component - Styles.
) Thumb Component.
) Thumb Component - Styles.
) Spinner Component.
) SearchBar Component.
) SearchBar Component - Styles.
) SearchBar Component - Logic.
) Button Component.
) Button Component - Styles.
) Button Component - Logic.
) Short about React Router.
) Routing with React Router.
) Movie Component - Scaffold.
) Fetch movie data from the API.
) BreadCrumb Component.
) BreadCrumb Component - Styles.
) MovieInfo Component.
) MovieInfo Component - Styles.
) MovieInfoBar Component.
) MovieInfoBar Component - Styles.
) Actor Component.
) Actor Component - Styles.
) Short about PropTypes.
) Validate Props with PropTypes.
) Short about SessionStorage.
) SessionStorage - Home.
) SessionStorage - Movie.
) Build and prepare for Netlify.
) Netlify drag and drop and Netlify CLI.
) Netlify Continous Deployment.
) Bonus - Classes - SearchBar Component.
) Bonus - Classes - Home Component.
) Bonus - Classes - Movie Component.
) Bonus - Typescript - Introduction.
) Bonus - Typescript - Bootstrap project and copy files.
) Bonus - Typescript - Refactor base files.
) Bonus - Typescript - Refactor Home and Components.
) Bonus - Typescript - Refactor Movie and Components.
) Bonus - Login - Short about TMDB login and rating system.
) Bonus - Login - Global Context.
) Bonus - Login - Login Component.
) Bonus - Login - Login Component - Styles.
) Bonus - Login - Login from Header.
) Bonus - Login - Rate Component.
) Bonus - Login - Rating from MovieInfo.

Taught by

freeCodeCamp.org

Reviews

5.0 rating, based on 1 Class Central review

Start your review of React JS Course for Beginners - 2021 Tutorial

  • Profile image for Manoj Kumar
    Manoj Kumar
    The react js course is very good I liked this course and I gained knowledge and enjoy a lot and last this is demanding skills and helpful for me in upcoming carrier
Start learning

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Sign up for free
Someone learning on their laptop while sitting on the floor.