CSR (Client-Side Rendering, 클라이언트 사이드 렌더링) 실행 흐름사용자 요청: 사용자가 페이지를 요청빈 HTML 전송: 서버는 빈 HTML 파일과 JavaScript 파일을 클라이언트로 전송클라이언트에서 데이터 fetching: 클라이언트(ex.크롬 브라우저)는 JavaScript를 실행해 필요한 데이터를 API 등에서 가져온다.클라이언트에서 렌더링: 클라이언트는 데이터를 사용해 페이지를 동적으로 렌더링한다.특징렌더링 위치: 클라이언트(브라우저)에서 렌더링.렌더링 시점: 사용자 요청 후 JavaScript 실행 시리액트의 기본 동작 방식. 클라이언트에서 데이터를 fetching( JavaScript 파일 다운로드 및 실행 , JavaScript 파일로부터 DOM을 렌더링)하는 과정..
Atomic Design System(원자 설계 방법론)
홈페이지를 구축할 때, 얼마나 많은 시간과 노력이 드는지 어떻게 판단할 수 있을까?프로젝트의 노력수준은 페이지 수 자체보다는 해당 페이지에 포함된 기능과 구성 요소에 의해 결정된다. 따라서 재활용할 수 있는 구성 요소들을 작성하는 스타일 가이드가 있다면, 프로젝트의 능률은 올라갈 수 있다.Atomic Design System 원자 설계 방법론 그러한 스타일 가이드를 작성하는 방법으로, 자연계에서 아이디어를 얻은 'Atomic Design System'을 활용할 수 있다. 자연계에서 원자들이 서로 결합하여 분자를 형성하고, 분자들은 결합해서 복잡한 유기체를 형성한다. Atomic Design System에서는 이를 바탕으로 원자, 분자, 유기체, 템플릿, 페이지 총 5개의 설계 단계를 거친다. 1. 원..