Video Resources

How to Build Web Applications with React (React Fundamentals)

A two-part React fundamentals learning path for building modern web applications. Learn how React components act as reusable building blocks for a user interface and how props pass data from parent to child components. Then manage user input with controlled components, state, and onChange and onSubmit handlers to build forms with real-time validation and no page reloads.

Frequently Asked Questions

What this playlist answers

8 questions this playlist covers — skim them for a quick takeaway, or dive into the videos above for the full picture.

This two-part learning path introduces the core concepts of building web applications with React: creating reusable components, passing data with props, and handling forms with state, controlled components, and event handlers.

React components are independent, reusable pieces of code that define part of a user interface and its behavior. Complex interfaces are built by combining smaller components, and functional components are the modern standard.

Props, short for properties, are read-only inputs passed from a parent component to a child component. They let data flow through an application and allow the same component to render different content.

Components define the structure and behavior of a UI element, while props provide the data those components use to render. A helpful way to think about it is that components are like functions and props are the parameters passed into them.

React form handling stores input values in component state and updates them through event handlers such as onChange. This lets developers validate, transform, and submit form data dynamically instead of relying on default browser behavior.

Controlled components are form elements whose values are driven by React state. Each input is linked to a state variable and updated through event handlers, which makes behavior predictable and validation easier.

Form submission in React is handled with an onSubmit handler that usually calls event.preventDefault() to stop the page from refreshing. The application then processes or validates the data in state.

Traditional HTML forms rely on default browser behavior and reload the page on submission, while React forms use state and event handling to control input and submission. This gives React forms real-time validation and a smoother user experience.

Featured:

Turn AI anxiety into action

Featured:

Bolstering technical skills development in MENA

Featured:

Explore new digital career pathways

Featured:

Take action on generative AI

Featured:

Hear what the experts have to say

How to Build Web Applications with React (React Fundamentals)

What this playlist answers

Proprietary research. Actionable frameworks.

Bridging the skills gap: The power of digital apprenticeships in a rapidly evolving economy

Leveraging AI to uncover $50M in revenue growth and $500K in savings

Data illiteracy: A hidden threat

Using customized training solutions to create new career pathways

Creating an AI talent ecosystem in Latin America

ADP: AI skills power great customer experiences