React for Beginners: Build an App, & Learn the Fundamentals

Name: React for Beginners: Build an App, & Learn the Fundamentals
Rating: 4.3 (56 reviews)

All React, No Distractions. This course will stick to the fundamentals, and guide you through creating your first app

Created byRyan Johnson

Last updated 11/2018

English

What you'll learn

A solid foundation of React fundamentals that will prepare you for more advanced topics
How Component state, props, and lifecycle methods work
How React renders to the DOM and manages updates
How to work with forms in React
How to create your first fully functioning React application
Plus more...

Course content

1 section • 18 lectures • 57m total length

Introduction1:18
A brief introduction where I introduce myself and give an overview of what will be covered in the course.
Introducing Codesandbox1:54
A demo of codesandbox.io an online code editor that I'll be using throughout the lessons.
Fundamentals: Components5:05
An overview of Elements and Components the basic building blocks in any React app.
Fundamentals: JSX3:40
An overview of JSX, and HTML like syntax that is very popular in the React community.
Build an App: Introduction4:07
Now that the fundamentals are covered let's dive into a demo of the app we'll be creating.
Build an App: Component State5:11
A deep dive into React's local state, and how to work with it in your components.
Build an App: Lifecycle Methods3:55
An introduction to React's lifecycle methods.
Build an App: Add Search Form3:56
An introduction on how to interact with forms in your React app.
Build an App: Save Search Query2:23
Build an App: Submit Search3:40
Build an App: Render Search Results2:49
Build an App: I'm Feeling Funny2:20
Build an App: SearchForm Component4:26
Build an App: Refactoring and Clean Up3:13
Build an App: Adding Styles3:41
Learn how CSS and styling fits into your React app.
How it Works: Rendering into the DOM1:43
A high-level overview of how React goes from JSX elements to native DOM elements.
How it Works: Rendering Updates2:58
A high-level overview of some key features that contribute to React's speed.
Conclusion: Wrapping Up1:22
A brief overview of the class assignment.

Requirements

JavaScript, HTML, and CSS fundamentals are required
Not required, but experience with JavaScript ES6+ is beneficial
No prior experience with React is required

Description

A lot of React newcomers tend to get hung up on external dependencies like webpack, and redux. While tools like this are great they tend to add additional complexity when starting out.

In these lessons I will be avoiding all these distractions, and sticking to React fundamentals, and guiding you through the creation of your first app.

Some of the topics covered include:

Elements and Components
Working with JSX
State and Lifecycle
Working with Forms
Creating Dumb/Stateless Components
Building your first App

In addition to the above I’ve also included two bonus videos on React rendering, and updates. If you have ever wanted to learn a bit about how React works under the hood these are for you.

After taking this course, you’ll have a solid foundation in the fundamentals of React, and will be confident enough to move onto more advanced topics, which I hope to cover in future courses.

Who this course is for:

Students with little to no experience with React
Students who want to learn how React works under the hood
Students who want to build their first React app
Students who want to build single page applications