Wun Code
JavaScript

Data and State

A UI is built from data, so here you learn to filter, sort and group that data without touching the DOM directly.

Start the trackFree, no sign-up needed

What you'll learn

  • State in one placeChange the state and the UI follows
  • Filtering as you typeSearch without reloading
  • Sorting without breaking the originalCareful: sort changes the original
  • Grouping with reduceFrom one list to groups
  • Don't mutate, make a copyWhy we freeze data
  • Derived stateCompute it, don't store it
  • Undo, step by stepA history of snapshots that never change
  • PaginationPage number in state, slicing at render time

Track contents

8 lessons, 2 hours in total
  1. 1State in one placeJavaScriptChange the state and the UI follows
  2. 2Filtering as you typeJavaScriptSearch without reloading
  3. 3Sorting without breaking the originalJavaScriptCareful: sort changes the original
  4. 4Grouping with reduceJavaScriptFrom one list to groups
  5. 5Don't mutate, make a copyJavaScriptWhy we freeze data
  6. 6Derived stateJavaScriptCompute it, don't store it
  7. 7Undo, step by stepJavaScriptA history of snapshots that never change
  8. 8PaginationJavaScriptPage number in state, slicing at render time