Class 01: React and Components Note
Component-Based Architecture
Definition of a Component: In the context of web development and React, a component is a reusable, self-contained unit that represents a specific piece of a user interface (UI). Components can range from simple, like a button, to complex, like an entire form or page.
Characteristics of a Component:
- Reusability: Components can be reused across different parts of an application.
- Encapsulation: Components encapsulate their own functionality and do not interfere with the rest of the application.
- Modularity: Components can be developed and maintained independently.
Advantages of Component-Based Architecture:
- Reusability: Components can be reused, reducing development time.
- Maintenance: Components are modular and encapsulated, making them easier to maintain.
- Collaboration: Different teams or developers can work on different components simultaneously.
Props in React
What is “Props” Short For?: “Props” is short for properties. In React, props are used for passing data from one component to another.
How are Props Used in React?: Props are passed to a component as attributes and can be accessed within the component. They allow data to be passed down the component tree. Data with props are being passed in a uni-directional flow (one way from parent to child).
Flow of Props:
- Parent Component: Props are defined in the parent component.
- Child Component: Props are passed to the child component.
- Child Component Usage: The child component receives and uses the props.
Things I Want to Know More About
- Best practices for component design to enhance reusability.