📖 Link Materials to Class Agenda:
- Slides (make a copy for your program - link the copy)
- Coding Exercise(s), Part 1
- Coding Exercise(s), Part 2
- Exit Ticket
-
👋 Welcome & Do Now (10) :
- Begin the session with a welcome message and a short activity to engage students.
- Have students complete the Do Now.
-
𝍇 React Components (15) :
- Explanation and demonstration of React components.
- Discussion on the importance of components: reusability, organization, efficiency.
- Identify components and instances in given code snippets.
-
</> Writing JSX (10) :
- Introduction to JSX and its importance.
- Compare JSX and HTML.
- Identify JSX code from examples.
-
⤵️ Props (25) :- Explanation of props in React and why they are used.
- Demonstrate passing and using props in components.
- Code along to create components with props.
-
⏳ Break (10)
-
🗂️ Organizing Components (10) :
- Discuss the necessity of organizing code for readability and maintenance.
- Demonstrate importing and exporting components.
- Students practice creating, importing, and exporting components in separate files.
-
💻 Code Solo (10) :
- Have students work in small groups or independently.
- Remind students that Googling and seeking solutions is a critical skill.
-
💻 Project Work Time (20) :
- Students work on the project, applying the concepts learned.
- Volunteers circulate to provide individualized support and feedback.
-
👋 Exit Ticket & Closing (10) :
- Direct students to the Exit Ticket in the Class Agenda.
- Ensure they submit before leaving.