Skip to content
DG In-Class

Introduction to React - Components & JSX

Learning Outcome Guide

Section titled “Learning Outcome Guide”

At the end of this class, you should be able to…

  • Explain the core concepts of React and its component-based architecture.
  • Set up a simple React project using the current best-practice (e.g. Vite).
  • Write and render functional components using JSX.
  • Use props to pass data between components.

Coding Demo

Section titled “Coding Demo”
In-Class Demo Jan 2026 term

To run the coding demo, you need to have your Student Workbook open in Visual Studio Code.

  1. Open the terminal window and paste in the following.

    Run from the root of your repository
    pnpm dlx tiged --disable-cache --force DG-InClass/SDEV-1150-A04-Jan-2026/sk/lesson-29 ./src/lesson-29

  2. Walk through the steps in the ReadMe.md of the new lesson.