728x90 반응형 useSearchParams2 [React.js] 8주차 - MPA, SPA, 이미지 최적화 1. 페이지 라우팅경로에 따라 알맞은 페이지를 렌더링 하는 과정을 말한다. 1.1. MPA 전통적인 웹 서버는 사용자에게 보여줄 웹 페이지들을 다 가지고 있었다. 브라우저가 특정 주소를 갖는 페이지를 요청하면 해당 페이지를 찾아 xxx.html 페이지를 브라우저로 보내주고, 브라우저는 받은 html 파일을 그대로 화면에 렌더링하는 방식으로 페이지를 라우팅하였다. 이렇게 서버가 여러 개의 페이지를 가지고 있는 것을 Multi Page Application(MPA), 브라우저가 페이지를 요청했을 때 서버 측에서 미리 완성해놓은 html 파일을 보내서 브라우저가 그대로 렌더링하는 것을 서버 사이드 렌더링(Server Side Rendering) 방식이라고 한다. (서버 측에서 페이지를 미리 렌더링해준다는 의.. 2024. 12. 2. [TIL] 11/14 - Zustand, useSearchParams, URLSearchParams, useLocation, 동적 CSS 1. ZustandZustand 는 작고 빠르며 확장 가능한 리액트 프로젝트에서 사용하는 상태관리(Store) 라이브러리이다. 스토어(Store) 는 애플리케이션의 여러 상태(state) 를 중앙에서 관리하는 것을 말한다. 이를 통해 컴포넌트 간 데이터를 쉽게 공유하고 데이터 변경을 감지해 자동으로 렌더링할 수 있다. 리액트는 기본적으로 부모 -> 자식 방향으로 데이터를 전달을 하고 이런 방식을 Props(Emits) 방식이라고 부른다. 하지만 컴포넌트가 중첩되어 있는 경우, 그림과 같이 중간에 있는 컴포넌트들이 불필요한 데이터를 취급하게 된다. (Props Drilling)이 방식은 컴포넌트 간의 결합도를 높이고 유지/보수를 어렵게 만든다. 그래서 스토어를 사용해서 공유해야 하는 데이터들을 .. 2024. 11. 14. 이전 1 다음 728x90 반응형
