React 2

데이터 흐름의 이해와 비동기 요청 처리

React에서의 데이터 흐름 ⇒ 하향식(top-down) - 컴포넌트 바깥에서 props를 이용해 데이터를 arguments 혹은 속성(attributes)처럼 전달받을 수 있음 - 데이터를 전달하는 주체 : 부모 컴포넌트 ** 앱 개발 ⇒ 상향식 (Bottom-up) - 프로토타입 → 컴포넌트 찾아냄 → 컴포넌트 개발 → 페이지 조립 - 테스트가 쉽고 확장성이 좋음 상태(State) : 변하는 값 부모의 상태를 변화시켜야 할 때는 역방햘 데이터 흐름 추가 ⇒ State 끌어올리기 (Lifting state up) - 상태를 변화시키는 함수를 하위 컴포넌트에 props로 전달해 해결 - 콜백함수를 사용하는 방법과 비슷함 State 끌어올리기 (Lifting state up) - 단방향 데이터 흐름에 부합..

React 2023.03.30

React 정리 (특징 + JSX)

React - 프론트엔드 개발을 위한 JS 라이브러리 리액트 3가지 특징 1. 선언형 (Declarative) - 코드를 자세히 분석하지 않고도 코드의 의도를 분명히 알 수 있게 작성하는 방식 - JSA 문법 기반 →직관적으로 코드를 짤 수 있음 2. 컴포넌트 기반 (Component-Based) - 여러 종류의 코드를 묶어둔 컴포넌트를 기반으로 하나의 기능 구현 - 컴포넌트 분리 → 독립적, 재사용 가능 + 기능 자체에 집중해서 개발 가능 → 유지보수, 유닛 테스트 편함 3. 범용성 (Learn Once, Write Anywhere) - JS 프로젝트 어디든 유연하게 적용 가능 JSX - React에서 UI를 구성할때 사용하는 문법 (JS를 확장한 문법) - 브라우저는 JSX 이해x 그래서 중간에 브라..

React 2023.03.16