binary_rho

velog에 적었던 글들을 차근차근 tistory로 옮길 예정입니다. [react] SSR을 위한 리액트 API리액트는 브라우저 자바스크립트 환경에서 렌더링 할 수 있는 방법을 제공하지만 동시에 리액트 애플리케이션을 서버에서 렌더링할 수 있는 API도 제공한다.API는 서버에서 렌더링하기 위한 다velog.io  리액트 API리액트는 브라우저 자바스크립트 환경에서 렌더링 할 수 있는 방법을 제공하지만 동시에 리액트 애플리케이션을 서버에서 렌더링할 수 있는 API도 제공한다.API는 서버에서 렌더링하기 위한 다양한 메서드를 제공하는데, 이는server.node.js에 있는 함수를 export한 것이다. 대표 함수들renderToString-> 인수로 넘겨받은 리액트 컴포넌트를 HTML 문자열로 반환-> 서..

2020년 말, 리액트 팀은 ‘제로 번들 사이즈 React 서버 컴포넌트’ 개념을 도입했다. 서버 컴포넌트란?리액트 서버 컴포넌트는 리액트 18 버전에서 추가된 기능이며, 서버 측에서 페이지가 아닌 컴포넌트를 실행하여 미리 렌더링된 마크업을 생성후, 클라이언트에게 전달되어 사용자에게 콘텐츠를 보여주는 방식이다.Next.js 12까지는 페이지 단위의 컴포넌트에서만 백엔드 리소스에 접근이 가능했지만, 13부터는 RSC를 사용하게 되면서 페이지 단위가 아닌 컴포넌트 단위에서 서버에 접근이 가능해졌다!  제로 번들 사이즈란? 프론트엔드를 개발하면서 라이브러리들을 추가하다 보면 번들 사이즈가 늘게 되고, 이는 서비스 성능에 부정적인 영향을 미치게 된다.요즘은 많은 라이브러리들이 트리 셰이킹(아래 설명 참고)을 지..