Components and Props Flashcards
Components let you split the UI into independent, reusable pieces, and think about each piece in isolation. This deck provides an introduction to the idea of components.
Conceptually, components are like JavaScript _______.
Functions. They accept arbitrary inputs (called “props”) and return React elements describing what should appear on the screen.
Given the attached code, is this a valid React component and why or why not?
Yes! This function is a valid React component because it accepts a single “props” (which stands for properties) object argument with data and returns a React element.
Can you use an ES6 class to define a component?
Yes!
When React sees an element representing a user-defined component, it passes JSX attributes and children to this component as a single object.
What is this single object called?
“Props”
Can component names start with a lowercase letter and why or why not?
No. Always start component names with a capital letter. React treats components starting with lowercase letters as DOM tags.
Can components refer to other components in their output?
Yes. This lets us use the same component abstraction for any level of detail. For example, we can create an App component that renders Welcome many times:
Whether you declare a component as a function or a class, it must never modify its own _____?
Props. React is pretty flexible but it has a single strict rule:
All React components must act like pure functions with respect to their props.
