🙆‍♀️ FE/React

나의 ContextNext 프로젝트를 진행하면서 코드 재사용성을 높이기 위해 코드 공통화 하는 작업을 하고 있다.그러다보니, 여러 컴포넌트나 부모-자식 구조의 컴포넌트 사이에 동일한 값을 전달하기 위해 Context 를 주로 사용한다는 점을 알게되어, Context라는 것을 좀 공부해보고자 한다. ContextContext란 부모 컴포넌트가 트리 아래에 있는 모든 컴포넌트에 깊이에 상관없이 정보를 명시적으로 Props를 통해 젙달하지 않고도 사용할 수 있게 해준다.Props를 UI트리를 통해 데이터를 전달하는 경우, 깊이 전달해주거나 많은 컴포넌트에 같은 Props가 필요한 경우 장황하고 불편할 수 있습니다. Props drillling 상황이 초래할 수 있습니다.Props 전달하는 대신 ‘순간이동’시킬..

과금될까바 늘 미뤄두었던 AWS EC2 배포를 드디어 해보고 잊지 않기 위해 블로그에 남기게 되었다. 목적나의 경우, 간단한 React 프로젝트를 웹 서버로 배포하기 위해 AWS 가상 서버 서비스를 사용하는 것으로 온전히 프론트 배포에만 집중되어 있다. 향후, 백엔드 배포도 기회가 된다면 해보면서 다양한 경험을 쌓을 수 있으면 좋겠다. AWS 는 가입 1년 간 프리티어를 제공합니다. 프리티어라고 모두 무료가 아닙니다. 일정 유형의 인스턴스에서 일정 시간 동안 무료로 제공한다고 하니... 모두모두 과금되지 않도록 주의합시다! (😢무서워요) AWS 가입을 전제하고 기록하겠습니다. 1. EC2 구매1. 검색 창에 EC2라고 검색하고 노란색 '인스턴스 시작' 버튼을 클릭한다. 2. 이름은 자유롭게 입력하고 하..

🧐 typescript 내에서 firebase 왜 임포트 에러가 뜰까? 찾아보니 tsconfig.json 에 moduleResolution 이라는 옵션이 있다. moduleResolution: 모듈을 어떠한 방식으로 해석할지에 대한 속성 (공식문서) 해당 속성의 옵션은 5가지 정도가 있다.classic : TypeScript의 가장 오래된 모듈 해결 모드, 오늘날에는 거의 사용하지 않음.node10 : node로 알려져있으며 commonjs로 설정되어 있을 때 기본 모듈node16 : --module node16의 대응물이며 해당 모듈 설정으로 기본적으로 설정nodenextbundler해당 옵션을 키고, node 혹은 node16으로 속성을 지정해주니 에러가 사라졌다. 따라~    영어 문서를 읽으려니..