React application engineering

The course, in order

Open a unit in the map to inspect its activities. Reading, guided completion, independent work and review remain distinct evidence.

1. Render a field with stable label and error relationships

   Render a stable label/control/error relationship with unique linked identities and ordinary escaped error text.

   Open this unit
2. One state, two views of it

   Keep one canonical input state while deriving consistent rendered views instead of separately storing values that must agree.

   Open this unit
3. Keep profile navigation distinct from mutations

   Use a native link for profile navigation and buttons for mutations, preserving their distinct activation semantics.

   Open this unit
4. Separate accepted baseline from an edited draft

   Keep the accepted baseline distinct from the current editable draft and calculate dirty state from their actual values.

   Open this unit
5. Test what the user gets, not how you built it

   Test the rendered behavior a user can observe rather than coupling assertions to private component implementation details.

   Open this unit
6. Toggle checkbox membership without duplicate identities

   Toggle checkbox membership by exact identity without duplicate entries or mutation of the caller’s collection.

   Open this unit
7. The answer that arrives after you stopped asking

   Publish an asynchronous result only while its request still owns the resource generation.

   Open this unit
8. Reconcile ordered entity state without stale selection

   Reconcile ordered entity identities and selection without retaining a selected record that was removed.

   Open this unit
9. Keep browser-only affordances outside server markup

   Render a stable server-safe representation before introducing browser-only affordances in a later lifetime.

   Open this unit
10. State that cannot disagree with itself

    Represent mutually exclusive resource states explicitly so loading, accepted value and failure cannot contradict each other.

    Open this unit
11. Compare effect dependencies with their actual equality rule

    Connect an effect’s lifetime to its dependencies and compare values with Object.is rather than recursive equality.

    Open this unit
12. Render failure and retry identity without inventing recovery evidence

    Choose the declared current resource view before rendering a failure fallback with an explicit retry identity.

    Open this unit
13. Choose a connected opener before a safe fallback

    Restore focus to a still-connected usable opener, then choose a safe fallback without stealing an independently moved focus.

    Open this unit
14. Restore the outer provider after an inner scope

    Install an inner provider only for its owned scope and restore the exact outer value on every exit path.

    Open this unit
15. Reset only after confirming the accepted revision

    Reset a draft only when the accepted baseline revision still matches the reset request; keep hydration serialization as its separately stated security boundary.

    Open this unit
16. Keep one active submit operation and reconcile its result

    Own one asynchronous submit operation and reconcile its accepted result without discarding edits made while it was pending.

    Open this unit
17. Replace an effect lifetime without overlapping resources

    Release the previous effect lifetime before acquiring its replacement and retain correct ownership after setup failure.

    Open this unit
18. Keep the previous value when preparation fails

    Prepare a replacement value before publishing it so a failed preparation leaves the previously accepted value unchanged.

    Open this unit
19. Release a temporary work resource after success or failure

    Hold an acquired temporary resource until asynchronous work settles, then release it once after success or failure.

    Open this unit
20. Reuse a derivation only for the same input identity

    Reuse a derived result only for the same immutable input identity and cache no identity whose computation failed.

    Open this unit