[REACT]0102

리액트 사용 이유 

●프론트 엔드 프레임워크가 필요한 이유?

  사용자 인터페이스를 데이터와 동기화하는 것이 어렵기 때문에 프론트엔드 프레임 워크가 존재함

 

● 바닐라 js에서 문제점이 발생 

    복잡한 프론트 단을 구성하려면 다량의 직접 DOM트래버링과 조작이 필요함

    앱에 버그가 많이 생김 

 

● 리액트

리액트는 UI를 다시 렌더링하여 상태 변경에 반응한다.

1. 웹페이지에 구성 요소를 렌더링해 현재 상태에 기반한 사용자 인터페이스로 만든다.

2. 사용자 인터페이스를 상태와 동기화하는 데 뛰어나다.

 

 

● 리액트 사용법

 브라우저에서 렌더링 하기 위해서는 React DOM 이 필요함 

 

 

개발하면서 참고하기 

https://react.dev/

React

리액트 프로젝트를 실행하기 위해서는 두가지 방법이 존재함

1.create- react -app 

 모든것이 구성되어 있고 적용되긴 쉽지만, 느리고 오래된 기술들이 존재함 

 우선적으로는 편리하기 때문에 먼저 이걸로 배우고 

2. vite

그 다음 실제 앱을 만들때는 VITE를 사용해보기 

 

 

 Quokka앱 

https://quokkajs.com/

Quokka - JavaScript and TypeScript playground in your editor

- 추출되거나 입력된 데이터를 보기 쉽게 해줌

 

quokka를 사용한 데이터 빼기 합치기 

● destructions

빠르게 개체나 데이터를 꺼내와야 할때 유리함

 

 

●  rest 연산자 

 rest요소는 배열 마지막에 위치해야함

 

 

●   스프레드 연산자 

배열에 모든 값을 꺼내 하나의 배열로 다시 만들 수 있음

두개의 차이점을 알 수 있음

 

 

●   확장 연산자 

새 속성을 추가하고 기존 속성을 업데이트 할 수 있음