본문 바로가기

분류 전체보기53

[항해99] 4주차 회고 한 주에 대한 정리 4주차는 React의 숙련 주차였습니다. 4주차에 집중적으로 배운 것은 리덕스를 통한 전역 상태관리 였습니다. 리액트가 부모 컴포넌트에서 자식 컴포넌트로 props를 전달해 줌에 따라 깊이가 깊어 지면 필요없이 전달해야하는 문제가 있습니다. 이를 해결하기 위해 배운 것이 상태관리였고, 리액트에서 가장 많이 사용하는 리덕스를 이용했습니다. 또한, firebase를 사용해 서버리스 서비스를 경험해 보았습니다. 아래에서는 리액트가 클래스 컴포넌트가 아닌 함수형 컴포넌트를 사용하는 것을 권장함에 따라 라이프 사이클 메서드를 비교하고 hooks에 대해 간단히 알아보겠습니다. 라이프 사이클 먼저, 라이프 사이클은 컴포넌트가 렌더링을 준비하는 순간부터, 페이지에서 사라질 때까지를 말합니다. 라이프.. 2022. 2. 6.
[CS] 메모리 계층과 성능 이 글은 '한 권으로 읽는 컴퓨터 구조와 프로그래밍' 을 정리하여 작성한 글입니다. 메모리 계층과 성능 과거에는 CPU와 메모리의 작업 속도가 같았지만, 시간이 지남에 따라 CPU는 속도가 빨라졌고, 메모리는 그렇게까지 빨라지지 못해 CPU 보다 속도가 뒤쳐지기 시작했습니다. 이로인해, CPU가 느린 메모리를 기다리느라 아무 일도 하지 않는 경우가 생겼습니다. 메모리 계층 메모리를 필요에 따라 여러가지 종류로 나누어 둠을 의미합니다. 이 때 필요한 대부분의 경우 CPU가 메모리에 더 빨리 접근하기 위함 입니다. 레지스터와 캐시는 CPU 내부에 존재합니다. CPU가 아주 빠르게 접근할 수 있습니다. 주 메모리는 CPU 외부에 존재합니다. 레지스터와 캐시보다 더 느리게 접근 할 수 밖에 없습니다. 대용량 저.. 2022. 2. 3.
[React] 라이프 사이클 이번에는 리액트 컴포넌트의 라이프 사이클에 대해 알아보겠습니다! 라이프 사이클 컴포넌트가 렌더링을 준비하는 순간부터, 페이지에서 사라질 때까지를 라이프 사이클이라고 합니다. 위의 이미지는 리액트의 라이프 사이클을 보여주는 그림입니다. 각각 어떤 역할을 하는지 알아보겠습니다. 라이프 사이클 유형 라이프 사이클을 크게 3가지 유형으로 나눌 수 있습니다. 이는 생성될 때(Mount), 업데이트 할 때(Update), 제거할 때(Unmount) 입니다. Mount 먼저, 마운트(Mount)에 대해서 설명하겠습니다. 마운트는 DOM이 생성되고 웹 브라우저에 나타나는 것을 의미합니다. Update 업데이트(Update)는 4가지 상황에 의해 발생합니다. props가 변경될 때 (New props) state가 변경.. 2022. 1. 31.
[React] 리액트란? 이번에는 자바스크립트 라이브러리 중 하나인 리액트에 대해 알아보겠습니다! 리액트 먼저, 리액트(React, React.js, ReactJS)는 자바스크립트 라이브러리 중 하나로 사용자 인터페이스를 만들기 위해 사용됩니다. 또한, 리액트는 SPA(Single Page Application)의 UI를 생성하는데 집중한 라이브러리 입니다. 리액트의 특징 그렇다면 리액트는 왜 사용할까요? 리액트의 특징을 알아보며 생각해봅시다! 1. Component 기반 라이브러리 컴포넌트(Component)는 독립적인 단위의 소프트웨어 모듈을 말합니다. 리액트는 독립된 컴포넌트들을 조립하여 화면을 보여줍니다. 리액트는 헤더, 메인 콘텐츠, 네비게이션, 메뉴, 버튼 등 여러 컴포넌트들로 쪼개져 구성할 수 있기 때문에 전체적인 .. 2022. 1. 31.