1. 리액트 개요
리액트란 뭐고 왜 사용하는가 ?
Intro
React.js는 Meta(구 FaceBook)에 의해 개발되고 유지보수되는 javascript기반의 오픈소스 라이브러리다.
리액트는 컴포넌트 기반의 손쉬운 화면구축과 빠른 렌더링 성능으로 발표 당시부터 선풍적인 인기를 끌었고 현재는 전 세계 수많은 기업에서 사용 중입니다. 그 인기에 힘입어 2023년에는 국내의 전자정부프레임워크(eGovFrame) 4.1버전에도 정식으로 리액트 템플릿이 추가면서 공공 부문에서도 React 도입이 점점 늘어나고 있습니다. 이런 추세 속에 리액트는 웹 개발자라면 반드시 익혀야 할 기술로 자리잡고 있습니다.
리액트가 사용된 사이트
아래 사이트를 참조하면 이름정도는 들어봤을 대기업 웹사이트들이 react를 활용하여 개발되었음을 알 수 있다.
페이스북
인스타그램
넷플릭스
에어비엔비 등
리액트의 장점
리액트가 선풍적인 인기를 끌었던 이유는 개발자의 개발편의성과 빠른렌더링 성능이 주된 이유이다. 어떤 기능들로 개발 편의성을 높였으며 빠른 렌더링이 가능한지 간단하게 알아보자
1) Component를 통한 손쉬운 UI구축
Component는 리액트에서 화면의 구성요소들을 추상화하여 표현한 개념으로 쉽게 말해 좋아요 버튼, 썸네일과 같은 HTML조각들을 의미 합니다. 리액트는 이러한 Component들을 조립 및 재사용하여 UI(User Interface)구축을 쉽고 빠르게 할 수 있습니다.
2) Virtual DOM을 활용한 빠른 렌더링
React에는 HTML의 DOM을 모방한 React만의 Virtual Dom이 존재 합니다. Virtual DOM의 diffing 알고리즘을 통해 실제 DOM과 비교 후 최소한의 변경만 실제 DOM에 반영하여 빠르게 화면을 렌더링합니다.
3) React Native로의 손쉬운 전환
리액트와 같은 문법을 사용하는 React Native로 앱(안드로이드/ios 등)개발이 가능합니다. 물론 앱개발과 관련된 추가적인 지식을 알아야하고 약간의 차이점이 있지만, 기본적으로 React문법을 기반으로 하기 때문에 쉽게 배울 수 있습니다.
4) JSX문법으로 손쉬운 HTML데이터 바인딩이 가능
React에서는 리액트에서 개발한 JSX문법 이라는 것이 존재하는데 이 문법을 통해 HTML객체들을
javascript의 배열, 객체, 함수 처럼 다룰 수 있어서 HTML코드의 재사용성이 증가하고 그 덕에 빠른 개발이 가능합니다.
5) 많은 국내회사에서 사용중이다.
우리가 리액트를 배워야 하는 가장 큰 이유는 많은 회사에서 사용 중이기 때문입니다.
이미 많은 회사에서 기존에 JSP등으로 만들어 뒀던 페이지를 react로 전환하는 작업 등을 진행했거나 또는 진행하려고 하고 있으므로 취업을 위해서는 반드시 리액트를 알아야 하는 문화(?)가 생겨버렸습니다.
사실 리액트는 모든 웹 어플리케이션을 개발하는데 적합한 라이브러리는 아니고 , SPA(Single Page Application)을 제작할 때 사용하면 좋은 라이브러입니다.
번외)
무조건 react가 좋다고 해서 적용했다가 이를 늦게 나마 인지한 회사들은 MPA(Multi Page Application) 방식으로 다시 전환하는 경우도 있기 때문에 Vue.js같은 라이브러리도 다룰 줄 알아야 하고 요즘은 모바일 앱개발도 많이 하기 때문에 React Native 와 Flutter 등을 다룰 수 있는지 묻는 경우도 많아지고 있는 추세입니다.
공부해야 할게 갈수록 많아 지는 추세이고 배움에는 끝이 없네요.
사실 개발자란 직업말고도 다른 직업들도 비슷하겠죠. 공부를 멈추는 순간 정체됩니다. 근데 저런 언어들을 다 공부해야 취업할 수 있을까요?
아닙니다.
어차피 개발공부에는 끝이 없기 때문에 여러분들도 당장은 React에 집중해서 공부를 하고 이를 통해 프로젝트를 진행 한 후 배운내용을 바탕으로 취업준비를 해도 충분할겁니다.
나머진 취업 이후에 공부해도 늦지 않거든요.
Last updated