본문 바로가기
Spec UP - Frontend/소플의 처음 만난 리액트

chap 1. 리액트 소개

by TIS_Ha 2024. 3. 5.
반응형

1.1 리액트는 무엇인가?

1. 리액트란?

: 사용자와 웹사이트의 상호작용을 돕는 인터페이스를 만들기 위한 자바스크립트 라이브러리

* 라이브러리란, 특정 프로그래밍 언어에서 자주 사용되는 기능을 모아서 정리해놓은 모음집이다.

* 사용자 인터페이스(UI)란 사용자와프로그램이 서로 상호작용을 하기 위해 중간에서 서로간에 입/출력을 제어하는 것이다.(ex. 버튼, 텍스트 입력창)

UI를 만들기 위한 기능 모음집을 UI 라이브러리라고 하며, 리액트는 대표적인 자바스크립트 UI 라이브러리이다.

- UI 라이브러리 예시 : React, 앵귤러JS, Vue.js

 

1.2 리액트의 장점

1. 빠른 업데이트와 렌더링 속도

리액트는 빠른 업데이트를 위해 Virtual DOM(가상의 DOM)을 이용한다.

* DOM(Documetn Object Model)은 하나의 웹사이트에 대한 정보를 모두 담고있는 큰 그릇.(크롬-개발자도구-콘솔 탭-document)

리액트는 Virtual DOM을 이용해 변경사항이 발생했을때 업데이트해야할 최소한의 부분을 검색한 뒤, 검색된 부분만 다시 렌더링하여 변경된 내용이 빠르게 적용된다.

 

2. 재사용성

리액트는 컴포넌트 기반 구조로, 모든 페이지가 컴포넌트로 구성되고, 하나의 컴포넌트는 또 다른 여러개의 컴포넌트로 구성된다.

이러한 각 컴포넌트는 웹사이트 여러 곳에서 반복적으로 사용될 수 있다.

리액트 컴포넌트를 개발할 때 항상 쉽고 재사용이 가능한 형태로 개발하는 것이 중요하다.

 

3. 활발한 지식공유 & 커뮤니티

리액트는 개발자로부터 많은 관심을 받고 있고, 실제 사용하고 있는 개발자들도 많아 활성화된 커뮤니티를 가지고 있다.

 

4. 모바일 앱 개발 가능

리액트 네이티브라는 모바일 환경 UI 프레임 워크를 사용하면 모바일 앱을 개발할 수 있다.

보통 모바일 앱 개발을 위해 안드로이드 앱의 경우 코틀린을, iOS 앱의 경우 스위프트라는 프로그래밍 언어와 각 개발 프레임워크를 학습해야한다.

하지만 리액트 네이티브를 사용하면 자바스크립트 코딩을 통해 안드로이드 앱과 iOS 앱을 동시에 출시할 수 있다.

1.3 리액트의 단점

1. 방대한 학습량

2. 높은 상태 관리 복잡도 : 성능 최적화를 위한 state 관리의 어려움.

 

 

반응형

'Spec UP - Frontend > 소플의 처음 만난 리액트' 카테고리의 다른 글

chap 4. 엘리먼트 렌더링  (0) 2024.03.18
chap 0. 준비하기  (0) 2024.03.05

댓글