In the theory part, students review essential ES6 features – let/const, arrow functions, and destructuring – that are used throughout modern React code. They then learn React fundamentals: what JSX is, how to define functional components, and how to pass data via props to build reusable UI blocks.
In the hands‑on practice, students implement a simple but complete Home page for ShopHub composed of a Header, Banner, FeatureSection, and Footer using React components and props. By the end of the session, each student has a functional landing page with a basic user interface and a clear understanding of how component‑based development works in React.