-
React란?
React는 UI들을 독립적이고 재사용할 수 있는 부분으로 관심사를 분리하여 각각의 컴포넌트로 만들 때 도움을 주는 라이브러리입니다.
리액트는 재사용이 가능한 컴포넌트를 만들고, 이 컴포넌트들이 모여 웹사이트를 구성하게 됩니다. 이 컴포넌트들은 자바스크립트 함수(또는 객체)로 이루어져 있기 때문에 필요한 사전지식으로 javascript를 알고 있으면 좋습니다.
리액트는 함수형 프로그래밍을 적극적으로 활용한다는 특징을 기억 해두면 좋습니다.
📌 리액트 코드 작성할 때 꼭 기억해야 할 개념
- render 함수는 순수 함수로 작성한다.
- state은 불변 변수로 관리한다.
공식문서 참조 https://ko.reactjs.org/
사용자 인터페이스를 만들기 위한 JavaScript 라이브러리
탄생 배경
Facebook에서 만든 Javascript 라이브러리로 리액트 등장 이전에 수 많은 라이브러리/프레임워크(jQuery, Vue.js, Angular.js 등)가 가지고 있는 다양한 문제들을 페이스북도 유사한 문제를 가지고 있어 코드베이스를 업그레이드 시킬 필요성을 느껴 개발한 것이 리액트라고 합니다.
리액트 장점
- 모바일 앱으로 발행이 쉽다.
- 앱처럼 뛰어난 UX을 가지고 있다.
- 비즈니스적 강점이 있다.
- 여러 종류의 웹브라우저들마다 자바스크립트를 불러오는 방식이 달라 어려웠으나 리액트는 브러우저들 간의 통일성을 주어 이러한 문제를 해결해준다.
- 데이터 유지 보수하기 좋다. web app의 크기가 커지면 자바스크립트 통제 및 관리가 어려운데 이러한 문제를 해결해준다.
- 데이터 흐름 파악이 쉽다. 앱이 커지면 복잡성 증가로 데이터 흐름이 어디로 이어지는지 파악하기가 어렵고, 디버깅도 어려워지는 문제를 해결해준다.
리액트 개발환경 Setup 하는 방법
- Nodejs 최신버전과 VS code 에디터 설치
- 리액트 설치
// 터미널에 명령어 입력 npm install react react-dom
'React' 카테고리의 다른 글
Redux Thunk (0) 2021.06.14 react-redux 패키지와 Hooks 사용하기 (0) 2021.06.13 Redux로 상태 관리하기 (0) 2021.06.12 Presentational 컴포넌트와 Container 컴포넌트 (0) 2021.06.11 useEffect Hook (0) 2021.06.11