서버사이드 렌더링 CSR(Client Side Rendering) 서버에서 HTML을 처리하지 않고, 브라우저의 자바스크립트를 통해 상호작용하여 전달해주는 방식. 장점 사이트 상호작용에 있어 활발 초기 로딩 후 빠른 웹사이트 렌더링 웹애플리케이션에 좋음 자바스크립트 라이브러리 활용 단점 제대로 구현하지 않을 시 SEO(검색최적화)가 취약 초기 로딩에 많은 시간이 걸림 대부분 추가적인 라이브러리가 필요 SSR(Server Side Rendering) 서버에 HTML 파일을 저장해두었다가 요청이 발생할 때 모든 파일을 브라우저에 전달하는 방식. SEO, 크롤링에 최적화 되어 있습니다. 장점 검색엔진 SEO에 최적화 초기 화면 로딩이 빠름 단점 잦은 서버 요청 전체적으로 느린 페이지 렌더링 모든 페이지를 리로..
Faker(페이커) 적용하기 이제 더미데이터를 페이커를 이용해서 랜덤하게 설정해줄 수 있습니다. npm으로 페이커를 설치하고, faker가 가지고 있는 함수를 통해 닉네임, 글, 이미지등을 가상으로 만들어줄 수 있습니다. 또한, 아래 링크를 통해 페이커 설치, 사용방법을 익힐 수 있습니다. www.npmjs.com/package/faker faker Generate massive amounts of fake contextual data www.npmjs.com 이제 페이커를 이용해서 generateDummyPost라는 더미데이터를 만들어주고, 글을 initialState의 mainPosts에 concat으로 글을 추가해줍니다. 이 코드는 generateDummyPost 함수를 이용해서 서버에서 데이터를 ..
리액트의 불변성을 지키려고 하면 위 그림처럼 길게 써야되고, 초보자가 하기에는 무리가 있습니다. 코드가 오류나기도 쉽기 때문입니다. 따라서, 이런 문제를 해결하기 위해 immer라는 라이브러리를 사용합니다. return produce(state, (draft) => { });가 기본 모양이고, 이를 이용하여 코드를 작성하면 됩니다. draft.뒤에 코드를 작성해주면 되고, immer를 사용하게 되면 코드량이 감소되고, 가독성, 생산성이 높아져 보다 깔끔한 코드를 작성할 수 있습니다.
