리액트란? 그리고 리액트를 쓰는 이유

리액트란

• 자바스크립트 라이브러리
• 넷플릭스 페이지
• 웹사이트 써도 모바일 웹쓰는것과 같은 느낌
• 기존의 웹사이트들은 요청을 보내고 HTML Page를 받는 식으로 진행됨
  • 약간 무거웠다.
  • html 페이지가 로딩되는 동안 기다려야 했음
• 자바스크립트의 이점
  • 사용자들이 보는 것을 조작할 수 있음 = DOM
  • 새로운 html 페이지를 가져오지 않아도 다른 것들을 보여줄 수 있다.
• 리액트는 자바스크립트에 추가로 더해주는 것

왜 자바스크립트 대신 리액트?

• 자바스크립트는 일일이 다 설정해줘야한다.
• 예를들어 TODO list 페이지
• 클릭에는 모든 단계들이 전부 설명되어야 한다.
• 이런 프로그래밍 방식을 명령형 접근방식이라 한다.
• 버튼을 생성하고 텍스트 컨텐츠를 설정하기 위해서 저수준의 코드를 실행해야한다.
  • 이는 계속 반복된다.

• 리액트에서는 컴포넌트가 중요

• 자바스크립트 처럼 코드가 절차적으로 많이 않음

• 리액트를 활용해서 복잡한 사용자 인터페시드 작업을 쉽게 구축할 수 있다.

• 고수준의 코드를 사용해서 선언형 접근방식의 코드를 작성할 수 있다.

리액트로 단일페이지 애플리케이션 구축하기

• 위젯만 리액트로 관리할 수 있지만 전체 페이지를 리액트로 관리할 수 있음
• 가령 넷플릭스의 경우 영화를 클릭하면 페이지가 이동한 것 같지만 html 요청이 이루어지지 않았음
  • 이는 자바스크립트를 사용한 것임

리액트의 대안 탐색하기 (Aungular/ Vue)

• 리액트는 컴포넌트에만 집중하고 있음
• 라우팅을 하는 경우 서드파티를 설치해야함

• 앵글러는 리액트랑 비슷한 컴포넌트 중심

• 프레임워크에 많은것이 내장되어 있음

• 뷰는 앵글러랑 리액트 합친 느낌

• 기능은 앵글러>뷰>리액트

• 라우팅 포함되어 있음

• 앵글러만큼 과부하되지 않음