TIL-20220729

회고

• 문서쟁이도 아니고... React 공식문서만 봐서 뭐하냐
  • 프로젝트에 UI를 만들어봐야지...
• Crafting Interpreters 보고있는데, C를 안하면 뒷부분이 의미없어서 C도 한번보자.
  • CPython도 C잖니...
• SICPJS도 정리하고....
• 비록 학위는 finance지만, CS 기본기는 갖춘 개발자가 되어야지ㅠㅠ
  • Programming / Language(Compiler & Interpreter) / Computer Systems(Architectures) / Operating Systems / Data Structures & Algorithms / Databases / Computer Networking / Basic Math for CS / Distributed Systems.....
• 25km Cycling (80m) done. 빛가람 -> 나주대교 -> 승촌보 -> 나주대교 -> 빛가람

React

• Updating Arrays in State (revisited)
  • (Overview) Arrays are mutable in JavaScript, but you should treat them as immutable when you store them in state. Just like with objects, when you want to update an array stored in state, you need to create a new one (or make a copy of an existing one), and then set state to use the new array.
  • You will learn
    • How to add, remove, or change items in array in React state
    • How to update an object inside of an array
    • How to make array copying less repetitive with Immer
  • Updating arrays without mutation
    • Adding to an array
    • Removing from an array
    • Transforming an array
    • Replacing items in an array
    • Inserting into an array
    • Making other changes to an array
    • Updating objects inside arrays
    • Write concise update logic with Immer
  • Recap
    • You can put arrays into state, but you can't change them.
    • Instead of mutating an array, create a new version of it, and update the state to it.
    • You can use the [...arr, newItem] array spread syntax to create arrays with new items.
    • You can use filter() and map() to crate new arrays with filtered or transformed items.
    • You can use Immer to keep your code conside.

• Updating Objects in State (revisited)
  • (Overview) State can hold any kind of JavaScript value, including objects. But you shouldn't change object that you hold in the React state directly. Instead, when you want to update an object, you need to create a new one (or make a copy of an existing one), and then set the state to use that copy.
  • You will learn
    • How to correctly update an object in React state
    • How to update a nested object without mutating it
    • What immutability is, and how not to break it
    • How to make object copying less repetivie with Immer
  • What's mutation?
  • Treat state as read-only
  • Copying objects with the spread syntax
  • Updating a nested object
    • Write concise update logic iwth Immer
  • Recap
    • Treat all state in React as immutable
    • When you store objects in state, mutating them will not trigger renders and will change the state in previous render "snapshots."
    • Instead of mutating an object, create a new version of it, and trigger a re-render by setting state to it.
    • You can use the {...obj, something: 'newValue'} object spread syntax to create copies of objects.
    • Spread syntax is shallow: it only copies one level deep.
    • To update a nested object, you need to create copies all the way up from the place you're updating.
    • To reduce repetitive copyting code, use Immer.