Work & Development · Frontend Frameworks & TypeScript

Build Applications with React

Build a React learning-goal tracker, test its behavior and explain how its parts fit together.

Level: Intermediate
Lessons: 12 lessons in 4 modules
Estimated study: About 16 hours
Format: Online, self-paced

Start your free 3-day trial Read lesson 1 free Already a student? Open course

Monthly: $0 today with a card, then $34 on day 4 unless you cancel before then. After the trial, 30 days' notice applies. Active on-campus students have academy access included. Check your existing student account before buying another subscription.

Before you start

Recommended preparation:

Use a computer with a keyboard and a current browser. Individual lessons explain the tools needed for each exercise.

Full study requires active Academy access. This course can be audited independently of optional assessed programs.

About this course

After Interactive Browser Apps, build a learning-goal tracker with React 19. In about 16 hours, make reusable screen parts, manage changing data, validate forms, switch screens and save practice goals. Test useful behaviors and explain your design choices.

What you will be able to do

Build and explain components, props and state.
Handle forms, routing and asynchronous data with useful feedback.
Choose appropriate state boundaries and test a meaningful interaction.

Course outline

Split the screen into parts with clear jobs and pass named information between them.

Run React and explain the render boundary1 h 15 minFree preview
Pass goal information through explicit props1 h 15 min
Render collections with stable identity1 h 15 min

Remember changing data, keep typing separate from saved goals and check form entries.

Model completion with state and derived progress1 h 15 min
Create goals with a controlled and validated form1 h 15 min
Edit a goal while preserving saved data1 h 15 min

Choose screens from the URL, load outside data and learn when an effect is needed.

Add routes that work with Back and direct links1 h 15 min
Load example data and handle stale requests1 h 15 min
Persist the tracker with an explicit storage boundary1 h 15 min

Check keyboard access, test important behavior and hand over a tracker you can explain.

Build accessible filters without duplicated state1 h 15 min
Test a state change and a rendered interaction1 h 30 min
Deliver and explain the learning-goal tracker2 h

Related assessed programs

This course belongs to the following optional programs. Each has its own required course bundle, evidence review and separate fee. Each program page shows its approved fee and current registration status.