분류 전체보기 (11) 썸네일형 리스트형 useReducer, useContext를 사용한 전역 상태 관리(with React, TS) 프로젝트 아키텍처를 짜던 중, 고민할 문제가 생겼다. 바로 "상태관리" ! 프로젝트 특성상 상태를 계속 들고 있어야 했고, 그 상태에 따라 하나의 페이지에서 바로바로 렌더링을 해줘야 했기 때문에 전역 상태관리가 필수적이었다. 기존에 진행했던 프로젝트에서는 'zustand'를 사용해 쉽게 전역 상태관리를 진행했지만, 라이브러리의 사용이 제한되어 있으므로 다른 해결 방법이 필요했다. 그래서 발견한 react hook이 useContext, useReducer다. 근데 일단 이게 뭔지 모르니까? useReducer 보통 React에서 상태를 관리할 때는 useState를 많이 사용한다. const [state, setState] = useState(0); return ( {state} 1로 만들기 ) 이렇게 .. 프로토타입 패턴이란? 근데 프로토타입이 뭐죠 ? 사실 공부하기 전에는, 피그마로 만든 디자인을 실행 가능하게 만드는 프로토타입을 생각했다. 약간의 초기모델 수준 ... 여기서의 ProtoType은 자바스크립트의 기본 속성을 말한다 !! 보통 값이 잘 나오는지 확인하려고 콘솔을 찍어보면(콘솔로그말고 디버깅을 사용하자) 이런 화면을 많이 볼 수 있다. 즉 객체 원형을 이용해 만들어진 객체라고 볼 수 있다. 자바스크립트는 프로토타입 기반의 언어라서, 객체지향적으로 프로그래밍할 수 있다 ! 그래서 프로토타입 패턴이 뭔데? 프로토타입 패턴은 동일 타입의 여러 객체들이 프로퍼티를 공유할 때 사용한다. 즉, 자바스크립트의 기본 속성인 프로토타입을 통해 프로토타입 체인을 사용한다. class Dog { constructor(name) { .. 디자인패턴? 그게 뭔데. 디자인패턴은 소프트웨어를 개발하는 과정의 반복되는 일반적인 문제들에 대해 기준이 되는 해결책을 제공하는 중요한 개념이다. 디자인패턴은 소프트웨어의 특정 구현을 직접 제공하지는 않지만, 반복되는 문제 상황들을 최적화된 방법으로 해결하도록 돕는 컨셉들이다. 흔히들 들어본 싱글톤 패턴, 옵저버 패턴, 프로토타입 패턴 등 여러 패턴들이 있다 ! 학교에 디자인패턴 수업이 있지만, 들어보지 않아서(정확히는 교수님이 별로라서!) 관련 정보를 알지 못했는데, 부트캠프에서 바닐라JS로 옵저버 패턴을 구현하면서 흥미가 생겼다. 앞으로 궁금한 디자인패턴에 대한 내용을 정리해볼 생각이다! 이전 1 2 다음
