본문 바로가기

리액트2

리액트를 클린하게 작성하는 법 Components 이름짓기 // 컴포넌트의 이름은 꼭 지정하고, 이름을 정확하고 알기 쉽게 지정해주세요 // BAD😡 export default () => ... // GOOD🤩 export default function Card() { return ... ) 일관되게 작성하기 컴포넌트를 작성할때 일관된 스타일을 유지하는게 좋습니다. 예를들어 컴포넌트를 작성할 때 function(일반함수)을 쓰던가, 아니면 화살표 함수로만 쓰는 등의 일관성을 지키는게 중요하고 이는 여러분의 코드에 더 나은 생산성을 가져다 줄 것 이라 생각합니다! 코드분리하기 리액트 컴포넌트를 코드를 작성할 때 200줄 미만으로 작성하는 편이 좋습니다. 200줄 이라는 말의 속뜻은 컴포넌트를 작은 구성요소로 나누라는 말입니다. 예를 들.. 2021. 11. 18.
React에의 서버사이드렌더링(SSR) vs 클라이언트사이드렌더링(CSR) 최근에 next.js를 시작하며, 기존의 클라이언트렌더링 방식과 서버사이드렌더링의 방식은 어떤 차이가 있는지 적어두기로 했다. 웹 개발자라면 ssr과 csr방식이 어떻게 돌아가고 있는지 정도는 알아야 할 필요가 있다고 생각한다. 기존의 렌더링 방식(SSR) 전통 방식인 서버사이드렌더링의 동작은 다음과 같다. 1)브라우저에서 프론트서버로 부터 페이지를 요청한다. 2)프론트서버는 브라우저에 그려주어야 하는 데이터를 백엔드서버로 요청한다. 3)백엔드서버는 데이터베이스로 부터 데이터를 가져온다. 4)백엔드 서버는 가져온 데이터를 프론트서버로 전송한다. 5)프론트서버는 백엔드서버에서 받은 데이터를 가지고 html과 합쳐 브라우저에 전송한다. 전통적인 ssr 방식이 불러일으킨 이슈 하지만 이런 전통적인 ssr방식은.. 2020. 10. 23.