본문 바로가기

분류 전체보기39

코드잇 스프린트 9주 차 위클리 페이퍼 코드잇 스프린트 4기 9주 차 위클리 페이퍼 1. 본인이 생각하는 CSS-in-JS의 장점과 단점을 설명해 주세요. 장점 className이 겹치는 것을 걱정할 필요가 없었다. props를 활용한 조건부 스타일링이 편했다. 단점 VSCode에서 컴포넌트 태그는 초록색으로 나타나는데 HTML 태그가 없이 전부 초록색 태그만 보이니까 가독성이 안좋다고 느껴졌다. 일반적인 컴포넌트로 HTML, CSS 작업 하다가 CSS-in-JS를 사용하니까 적응이 어려웠다. 2. Presentational & Container 디자인 패턴에 대해 설명해 주세요. 관심사의 분리(Soc; separation of concerns)를 하는 하나의 방법으로 하나의 컴포넌트에서 비지니스 로직과 뷰(UI)를 처리하던 것을 비지니스 로.. 2024. 2. 24.
코드잇 스프린트 8주 차 후기 코드잇 스프린트 4기 기간 2024-02-12 ~ 2024-02-17 과제 팀 데일리 미션: 매일 팀마다 1명이 1개의 질문을 하고 나머지 팀원들이 답변 위클리 미션: 주마다 배운 내용을 바탕으로 스프린트 과정 동안 만들어가는 개인 프로젝트 위클리 페이퍼: 주마다 정해진 2개의 주제에 대해 조사 학습 토픽 18. React로 웹사이트 만들기 토픽 19. Styled Components 스터디 codingTest: 매 주 월, 목 코딩 테스트 문제 1개 풀이 으쌰으쌰: 매일 모던 자바스크립트 Deep Dive 책 정해진 진도 공부 후 정리 후기 그동안 웹 사이트에 하나의 페이지만 있는 구조로 위클리 미션이 진행되었었다. 이번 8주 차 위클리 미션에서는 /shared, /folder 페이지가 나뉘어 처음으로.. 2024. 2. 18.
[WEB] CSR, SSR, SSG 코드잇 스프린트 4기 8주 차 위클리 페이퍼 CSR(Client-side Rendering) 렌더링의 주체가 클라이언트(웹 브라우저)이다. 웹 브라우저에서 자바스크립트로 HTML을 만들어 렌더링을 진행한다. 과정 1. 사용자가 방문하면, 브라우저가 서버로 요청을 보낸다. 2. 서버에서 HTML 뼈대와 자바스크립트, CSS 파일 등을 보내준다. 3. 브라우저가 다운로드하는 동안 사용자는 아무것도 볼 수 없다. 4. 다운로드 완료된 자바스크립트가 실행되어 페이지를 그린다. 장점 서버의 부하가 비교적 적다. 초기 로딩 이후에는 비교적 빠르다. 단점 모든 자원을 한번에 불러와서 첫 로딩이 비교적 느리다. 자바스크립트가 실행 되어야 메타데이터가 변경되어 SEO에 불리하다. SSR(Server-side Render.. 2024. 2. 17.
[React] 생명주기(Life Cycle) 코드잇 스프린트 4기 8주 차 위클리 페이퍼 생명주기란? 컴포넌트에서 특정 시점(컴포넌트 생성, 변경, 제거)에 이벤트를 호출하는 것이다. 클래스형 컴포넌트와 함수형 컴포넌트는 라이프 사이클을 관리하는 방법이 다르다. 클래스형 컴포넌트 생성할 때(Mounting), 변경할 때(Updating), 제거할 때(Unmounting)의 메소드를 제공한다. 생성할 때 · constructor: 컴포넌트가 호출되어 렌더링되기 이전에 가장 먼저 호출되는 함수. · getDerivedStateFromProps: props로 받아온 것을 state에 설정. · render: 컴포넌트를 렌더링하는 함수. · componentDidMount: 첫 렌더링 이후에 마운트(DOM에 추가)되면 발생하는 함수. 변경할 때 · get.. 2024. 2. 17.