본문 바로가기

NextJS2

Hydration Next가 궁금해서 기존에 작업했던 everydaaay_shop 쇼핑몰 프로젝트를 관리하는 대시보드를 제작중입니다 Next관련 자료를 찾아볼때마다 Hydration이라는 용어가 나오는데 간단하게 제가 이해한 바는 아래와 같습니다 Hydration이란 서버사이드 랜더링, 클라이언트사이드 랜더링을 혼합해서 사용하는 방식입니다 왜? : - SEO, 이미지 최적화 등 많은 요소 때문에 Next.js 와 같은 서버사이드 랜더링기능을 수행할수있는 프레임워크를 많이 사용하게 됨 - 서버사이드 랜더링으로 페이지를 제작하면 정적인 페이지라 초기 랜더링을 빨라도 사용자 상호작용이 많을때 좋지않음 - 그럼 서버사이드 랜더링해서 빠르게 ui를 보여주고 동작은 클라이언트 사이드 랜더링에서 수행된걸 사용하자 - 서버사이드 랜더링.. 2024. 4. 1.
왜 NextJS를 쓰는가? 프론트엔드로 취업을 희망하기에 공고들을 보면 NextJS를 우대사항으로 뽑는 공고들이 많습니다 왜 NextJS를 쓰는지에 대해 의문이 생겨 알아봤습니다. 검색하면 다들 SEO(검색엔진최적화)를 위해 사용한다고 적어놓은 글들이 많습니다 사이트의 수익성을 생각하면 가장 큰 이유인것같습니다 구글을 예로 들면 구글 브라우저는 검색시 1. 크롤링 - > 2. 색인 생성 -> 3. 검색결과 게제의 순서로 진행됩니다 그러니 브라우저 크롤러에게 빠르게 앱의 정보를 제공하기 위해 초기랜더링이 CSR보다 빠른 SSR을 사용하기위해 NextJS를 사용한다는 말인데 SEO만 원했다면 서버사이드 랜더링을 위한 다른 방식 사용 react-helmet을 통해 페이지별 메타태그를 다르게 설정하거나 번들 사이즈를 최적화하고 URL의 .. 2023. 11. 12.