리액트

[리액트] 배우기 전에 쓰는 이유부터 알기

front-hyun 2023. 8. 29. 09:22

React 왜 씁니까 

 

리액트 문법부터 들이밀면 누구나 이해가 가지 않습니다. 

리액트의 정확한 용도를 알아야 리액트라는 라이브러리를 이해할 수 있는데 

 

 

 

 

 

Naver Vibe, Flipkart, Instagram 이런 웹사이트 들어가봅시다.

들어가면 페이지 전환 같은게 새로고침 없이 부드럽게 동작합니다. 

 

이런 사이트들을 Single Page Application 이라고 하는데 

- html 파일을 1개만 쓰고 

- 다른 페이지를 보여주고 싶을 때 html 부분만 샥 갈아치워서 보여줍니다. 

그래서 부드럽게 동작합니다. 

 

UI의 상태를 자동으로 업데이트해준다 !!

UI = reder(state)

가상 돔을 통해서 UI를 빠르게 업데이트한다. 

가상 돔 = 이전 UI 상태를 메모리에 유지해서, 변경될 UI의 최소 집합을 계산하는 기술

단일 페이지 애플리케이션(SPA) 방식으로 개발함 = 최초 요청 시 서버에서 첫 페이지를 처리하고 이후의 라우팅은 클라이언트에서 처리하는 웹 애플리케이션 -> 화면 깜빡 X. 자연스럽게 페이지 전환됨

 

쌩자바스크립트로도 만들 수는 있지만 코드가 너무 길어지는 관계로 

리액트라는 자바스크립트 라이브러리를 설치해서 사용하면 이걸 더 쉽게 만들 수 있습니다.

그래서 리액트라는 라이브러리를 배우고 사용하는 것입니다. 

 

 

리액트 쓰는 또 다른 이유들은 

- html을 함수, array, object 이런 곳에 보관하고 재사용할 수 있어서

큰 프로젝트일 수록 html 관리 편리해짐  

- React Native를 쓰면 같은 리액트 문법으로 모바일 앱개발도 가능합니다.

거기선 html css 문법만 약간 다릅니다. 

 

 

실은 리액트와 비슷한 자바스크립트 라이브러리가 많습니다. 

Vue, Svelte, SolidJS 이런게 요즘 뜨고 있긴 한데 

이 중에 리액트가 가장 틀딱이고 유저가 가장 많기 때문에 리액트를 쓰도록 합시다.