# Discussion Questions: Props vs. State

# Discussion Questions: Props vs. State.md

Discussion Questions: Props vs. State

1. What is the difference between props and state in React?

2. When would you use state instead of props?

3. Assuming UserDetail is a component, what will its props be if it's rendered as follows:

   const user = {name: 'Spider Man', age: 32}
   
   <UserDetail title="Profile Page" dog="Fido" user={user} />

4. Take a look at https://learning.flatironschool.com. Pretend you were going to recreate a specific page. What top level components would you have? What props would they receive and what state would they own? What components would they have as children?

1. Difference between props and state in React:
props:

Used to pass data from parent components to child components.
They cannot be changed within a child component.
It can be accessed throughout the child component.
They are used to customize the behavior or appearance of a component.

state:

Used to manage the internal data of the component.
It can be changed using setState.
They can only be accessed within the component in which they are defined.
They are used to track information that can change over time.

2. When would you use state instead of props?
For internal data of the component.
For dynamic data that changes over time.
For data that requires specific behavior from the component.

3. the props are as follows:
title: "Profile Page"
dog: "Fido"
user: { name: 'Spider Man', age: 32 }

4. Top-Level Components:
   Header:
   Props:
   logo: URL of the Flatiron School logo
   navigationLinks: An array of objects representing navigation links (text, href)
   Child Components:
   Logo
   Navigation
   Hero Section:
   Props:
   title: Main title of the page (e.g., "Become a Software Engineer")
   subtitle: Optional subtitle providing more context
   imageUrl: URL of an image to display in the hero section
   callToAction: Text and link for a call to action button (e.g., "Apply Now")

didam goran, aras yousef, sarah mustafa

Zainab Al-Najjar, Ibrahim Muhaned, Mardin Luqman
1- The key difference between state and props is that state is managed within a component, while props are passed from a parent component to a child component. State is used to manage internal component data, while props are used to pass data from a parent component to a child component

2- If data is managed by one component, but another component needs access to that data, you'd pass the data from the one component to the other component via props.
If a component manages the data itself, it should use state to manage it

3- App: Manages overall application state.

Props: None

State: App-level state (e.g., user authentication, global settings)

Children: Various pages/components

UserDetail: Renders user details.

Props: title, dog, user

State: None (assuming no local state needed)

Children: None (if not specified)

4- Specific Page Recreation:

Identify top-level components based on the page structure and functionality.

Assign appropriate props and state based on the data and behavior required for each component.

Organize child components as needed to build the desired page layout and functionality.

Ali Izzaldin | Dilan Ahmed | Ahmed Sabah| Vinos Sarah | Meer Atta

1. The difference between props and state in react : The state is used for components to internally manage the data within the component locally. On the other hand the Props are passed from a parent component to a child component unlike state which is more internally used for managing and dealing with the data part of the component.

2. We are using state instead of props when the data we are dealing with is internally exist in the component and needs to be managed or updated by the component itself . Also, we use props when we are having a static data and the rendering is not necessary. In a nut shell, we use the state while we are working with data within the component range.

3.We will be having there props which are ( tittle , dog, user ).

4. this question is three part ,
   part 1 , we are having 4 top level, ( nav bar , sign up , contents, footer) and each of these components are having even more components within themselves.
   part 2, everything inside the footer is a prop and it is the same for nav , in the nav ba

part 3 ,

Team [ Papula , Halwest , Shkar , Shinak, and Nada ]

1. What is the difference between props and state in React?

• Props: We are using props to pass data from parent to child components. and it's immutable.
• State: The internal data of the component which can change through the set function. state can be global.

2. When would you use state instead of props?

• State use when we have data continuously needs to change.
• props using when we have data that don't have to be changed.

3. Assuming UserDetail is a component, what will its props be if it's rendered as follows:
   const UserDetail = ({title,dog,user}) => {}
   its props are title,dog and user(object)

4. Take a look at https://learning.flatironschool.com. Pretend you were going to recreate a specific page. What top level components would you have? What props would they receive and what state would they own? What components would they have as children?

Top-level Components:
Sidebar - Notification header - Dashboard - Right Section- Footer