☘️ About React

🌟 리액트의 특징

기술적 관점

• 가상 DOM (Virtual DOM)
• Routing 이점 ⇒ Browser 위에서 Mobile App 처럼 동작함
  개발 경험 관점
• 컴포넌트 기반
  • UI를 독립적이고 재사용 가능한 여러 컴포넌트로 분리함으로써, 대규모 애플리케이션의 개발과 유지보수를 용이하게 합니다.
• 선언적 접근
  • 명령형 vs 선언형


• 명령형 프로그래밍 (Imperative Programming)
  명령적 프로그래밍은 "어떻게" 작업을 수행해야 하는지에 초점을 맞춤
작업을 수행하는 방법에 초점을 맞추며, 코드는 작업을 수행하는 데 필요한 모든 단계를 자세하게 설명함.
• 선언형 프로그래밍 (Declarative Programming)
선언형 프로그래밍은 “무엇을” 작업해야하는 지에 초점을 맞춤
작업의 목표에 초점을 맞추며, 내부 구현은 감추고 무엇을 해야 하는지만을 선언함.


🌟 함수형 컴포넌트 특징

1. 가독성이 좋고 문법이 간결
2. Hook 사용가능
3. 메모리 사용량이 Class보다 적다

---

🌟 Hook이란?

다양한 React기능을 사용할 수 있게 해줌

- State Hook

state를 통해 컴포넌트는 사용자 입력 정보를 기억할 수 있다.

Effect Hooks

: Effects를 통해 컴포넌트를 외부 시스템에 연결하고 동기화할 수 있게 해 줌.

React는 Hooks를 배열로 관리하고 있다.

: React는 Hooks를 배열로 관리하고 있다.

1. 이것은 Hooks를 관리하고 있는 배열에 index로 접근할 수 있다는 의미이며 호출 순서에 의존하고 있다는 것이다.

2. Hooks은 조건문 반복문 안에서는 사용할 수 없다.

3. 컴포넌트의 최상위 레벨이나 커스텀 훅에서만 사용 가능하다.

Hooks의 내부 관리 방식

1. React에서 state는 컴포넌트가 리렌더링 한 후에도 변수를 기억한다. 따라서 리렌더링 된 상태값을 기억하고 index 0번 자리로 돌아간다. 그래서 설정자 함수를 다시 호출하면 값이 변경되는 것이다.
2. 배열로 다루고 있지 않다면 생기는 문제점
   1. 이름 충돌
   2. 복사 붙여넣기가 어려움
   3. 믹스인 다중 상속 문제(다이아몬드 문제)

🌼 오늘의 어려웠던 점

React만의 장점이 강한 만큼 배워야 하는 것도 많은 것 같다...!
이 로직들을 이해하고 잘 이용하는 게 쉽지 않은 것 같다는 생각을 많이 한다

⭐️ 오늘의 회고

저번시간까지 만들었던 메달 순위 기록 프로그램을 한번 더 스스로 짜보았다..!
처음 프로그램을 만들 때 이해가 잘 가지 않았던 부분들이 다시 작업을 하며 퍼즐을 맞춰가는 것 같다..!
3번까지 복습해야 내 것으로 만들 수 있을 것 같다 . 당장은 이런 복습들이 힘들고 피곤하지만 그만큼 내 기억속에 오래오래 남고 이것들이 쌓여 기반이 되지 않을까 생각하고 다짐한다!