React -#1 React 시작!

React를 공부하기 시작한 동기

react를 시작하게 된 동기는 다름아닌 프로젝트 투입이였다. 원래 기존에 vue를 조금 공부해보면서 react도 시간나면 접근해봐야겠다는 생각이 들곤 하였는데, 프로젝트 투입이라는 동기로 인해 좋은 기회를 얻은것같다!
열심히 한번 부딛혀 봐야겠다.!!😂

참고 : 패스트캠퍼스 한번에 끝내는 react의 모든 것 강의를 바탕으로 공부할 예정

React란???

React는 프레임워크가 아닌 라이브러리

frame : 틀
1. 필요한기능이 대부분 만들어져있어 사용하기 편리하다.

BUT😡

1. 틀에서 벗어나기가 힘들다.

2. 다른 프레임워크나 라이브러리와 사용시 충돌할 가능성이 있다

3. 필요없는 기능도 포함되어 상황에따라 무거울 수가 있다

라이브러리(React) 특징 👍

• 필요한 부분에 가져다 쓰면된다.

• 다른 라이브러리와 충돌할 일이 없다.

• user interface를 만들기위한 라이브러리

• controller , router, ajax를 내장하지 않아 가볍다.

• Vitual Dom을 사용한다.

JQuery, Javascript

• 실제 DOM을 직접처리하면 성능도 느리고 비효율적이며 처리할 데이터가 많으면 관리하기가 힘들다.

BUT vitual Dom을 사용하게 된다면?

• Vitual Dom은 이를 추상화 시킨것으로 javascript 객체에 불과하며, 이 안에서 처리하는것은 이미 렌더링된 데이터를 실제 DOM API를 통해 처리하는 것보다 빠르다.

React JS의 장점?

• Virtual Dom

• 배우기 쉽다.

• 잘못사용하지만 않으면 뛰어난 Garbage Collection , 메모리 관리, 성능

• 서버 & 클라이언트 렌더링 지원

• • javascript는 client 렌더링 위주, 자바스크립트 처리가 끝나면 우리가 원하는 UI가
    나타남 즉 -> 초기 구동 딜레이가 생긴다.
    서버 렌더링을 하면 서버측에서 html을 미리 생성하고 문자열형태로 브라우저에 띄워주고 client 렌터링이 시작된다.

• 검색엔진 최적화

• • Client 렌더링을 하게되면 검색엔진 봇이 사이트를 수집할때 실제적으로 얻는 정보는 사이트 데이터가 아닌 비어있는 요소가된다.

• 매우 간편한 UI 수정 및 재사용

React JS의 단점?

• view only -> 오로지 화면만을 위해 구성되어있다.

• IE8 이하 지원 X (사용하려면 REACT V-14이하를 사용해야함)