💻 Frontend
React를 선택할 수 밖에 없는 이유
category
💻 Frontend
리액트를 선택하는 이유.1. 컴포넌트 단위 개발2. JSX3. Single Page Application, Client Side Rendering 개발많은 라이브러리 중 왜 리액트냐.정리면접References
리액트를 선택하는 이유.
- 매우 인기있는 라이브러리니까
- 많은 기업에서 요구하는 기술이니까
이런 솔직한 이유는 리액트를 사용하는 이유에 적합하지 않습니다. 리액트의 장점을 살펴보면서 우리가 왜 리액트를 선택했는지 알아보겠습니다!
1. 컴포넌트 단위 개발
React를 사용하면 컴포넌트 단위로 개발할 수 있습니다. 쉽게말하자면 html 재사용성을 높여 개발할 수 있습니다.
컴포넌트란 UI를 구성하는 개별적인 뷰 단위입니다. React에서 컴포넌트는 여러 파일에서 사용할 수 있기 때문에 생산성과 유지보수를 용이하게 합니다.
2. JSX
JSX, JavaScriptXML의 약자로 JavaScript를 확장한 문법입니다.
JSX의 장점은 중괄호만 있다면 모든 자바스크립트 표현식을 넣을 수 있습니다.
아래와 같이 사용할 수 있습니다.
const name = 'Josh Perez'; const element = <h1>Hello, {name}</h1>;
이 과정을 js로만 한다면,
- html element dom에 접근
- dom element text에 변수 추가 등등..
다소 복잡하고 귀찮은 과정이 이어집니다. 하지만 JSX는 중괄호 안에 바로 변수를 넣어주기만 하면 됩니다!
아래와 같이 사용할 수도 있습니다.
function getGreeting(user) { if (user) { return <h1>Hello, {formatName(user)}!</h1>; } return <h1>Hello, Stranger.</h1>; }
3. Single Page Application, Client Side Rendering 개발
React를 사용한다면 Single Page Application 개발이 쉬워집니다. 기존 JS로도 개발할 수 있지만 복잡하다는 점이 있습니다.
SPA는 HTML, CSS, JS 파일을 최초 1회만 로드하고 이후에는 JS 파일을 통해 필요한 HTML 파일을 조작하는 방식을 말합니다. 처음 한번만 요청하면 파일이 불러와지기 때문에 페이지 이동을 하여도 새로운 페이지를 요청하지 않아도 됩니다. 화면의 필요한 데이터만 불러오기 때문에 처리 과정이 효율적이며 속도도 빨라 사용자 경험에서 좋습니다.
많은 라이브러리 중 왜 리액트냐.
다른 라이브러리, 프레임워크도 있는데 왜 하필 리액트일까요?
React는 페이스북에서 제작하였습니다. 글로벌 기업이 제작하였기 때문에 유지보수가 계속 이루어 지고 많은 기능이 계속 추가되고 있습니다. 그리고 다른 프레임워크에 비해 사용자 수가 가장 많다는 것도 큰 장점입니다. 큰 생태계가 이루어지고 있기 때문에 검색을 통해 쉽고 빠르게 도움을 얻을 수 있습니다.
정리
면접
Q: React를 왜 사용하시나요?
A: JSX 문법으로 컴포넌트 단위로 개발하면서 코드 재사용성과 유지보수를 높이고, SPA 개발을 하며 사용자 경험을 높이기 위해 사용합니다.
