Phase 05: React Engineering

This is a self-paced learning repository. Follow the modules in the recommended order, but study and practise according to your own schedule.

The completed project is available on main. The starter branch provides a clean beginning.

What you will build

E-commerce Frontend

Recommended learning path

Module	Topic	Videos	Code reference
1	React Mental Model, JSX and Components	Watch on YouTube	p05-module-01-react-mental-model-jsx-and-components
2	State, Events and One-Way Data Flow	Watch on YouTube	p05-module-02-state-events-and-one-way-data-flow
3	Hooks, Forms and Local Persistence	Watch on YouTube	p05-module-03-hooks-forms-and-local-persistence
4	Context, Reducers, Data Fetching and Error Boundaries	Watch on YouTube	p05-module-04-context-reducers-data-fetching-and-error-boundaries
5	Testing, Performance, Accessibility and Release	Watch on YouTube	p05-module-05-testing-performance-accessibility-and-release

Technology and engineering areas

• React
• JavaScript
• Vite
• Context
• Vitest

Repository structure

modules/       ordered learning resources and practical labs
project/       completed reference on main; clean beginning on starter
assessment/    project requirements, review questions and rubric
docs/          supporting curriculum and engineering references
resources/     reusable templates and reference material

Video lessons

Watch lessons, demonstrations, debugging sessions and project walkthroughs on the Oliseyenum channel:

▶ https://www.youtube.com/@oliseyenumomodi

As individual videos are published, their direct links can be added to VIDEOS.md.

How to use this repository

git clone https://github.com/oliseyenumomodi/phase-05-react-engineering.git
cd phase-05-react-engineering
git switch starter

Move through the modules in order. Use module tags to inspect each reference point:

git tag
git checkout p05-module-01-react-mental-model-jsx-and-components
git switch main

Project review

After completing the modules:

1. build the project from the starter branch;
2. run the supplied checks;
3. compare your decisions with main;
4. review the assessment requirements;
5. explain the architecture, trade-offs and limitations.

Author

Oliseyenum Omodi
Software Engineer • Builder • Instructor
Oliseyenum Studio • Powered by Illumination Gate

Build. Teach. Share.