본문 바로가기

분류 전체보기57

[GCP] Idle Min-Instance Memory Allocation Time GCP 에 firebase admin 백엔드 서버를 배포해놓고 약 5일 정도 지났는데, 벌써 요금이 생겼다. 왜 생겼을까? API 를 사용해봤자 10번도 안썼는데, 아무것도안했는데.. 200원 내세요 원인 -> Idle Min-Instance Memory Allocation Time 아마 인스턴스 최소개수를 설정해놓아서 그런 듯 예상된다. 개발단계에서는 일단 0개로 써도 될 것같다. 운영하고 있는 서비스 잠시 멈추기 -> 직접 정지하는 것을 제공하진 않지만 비슷한 방법으로 호출하는 allUsers 를 삭제시켜 사용 링크 다시 추가하기 링크 2022. 9. 29.
[GCP] 트리거 실행 실패 - 소스 코드를 빌드하거나 배포할 수 없습니다. 배포가 됐는데 계속 유니콘이 날 반겨줬다.. Oops.. something wrong... 그래서 뭐가 잘못됐는데... deploy-test 라는 레포를 만들어서 문서에서 유도하는 대로 새로운 환경은 배포해보았다. 결과는 잘 되었고, 내 레포와 무슨차이가 있을 지 비교분석해봤다. 빌드 로그를 확인해보았을 때, deploy-test 서비스는 빌드 단계가 Build-Push-Deploy 단계로 이루어졌는데, 내 프로젝트는 0:Build 로만 머물러 있었다. 왜 이런 차이가 있는가? 를 지속적 배포 수정(트리거 관련) 에서 내가 무엇을 바꿨는지 생각해봤을 때, 구성 부분에 유형을 Dockerfile 로 바꿔서 썼었다. 처음에 트리거 관련 에러가 났을 때 해당 구성을 확인했었는데, 나는 Dockerfile 로 .. 2022. 9. 23.
ClickAway Component ClickAway Component? Dropdown 이나 Popover 같은 컴포넌트를 만들면, 그 컴포넌트 이외의 영역을 눌렀을 때에도 열려져 있는 상태를 닫게 하고 싶은 경우가 있다. 그것을 위한 구현방법에 대해 이전 프로젝트에서 다른 사람들이 구현한 것을 구경해보았을 때 window 에 click listener 를 달아서 해결한다던지, open 상태에 따라 전체 영역을 감싸는 div 를 만들어 사용하는 방법이라던 지 (이전 프로젝트에서 썼던 방법) 등의 방법이 있었다. ClickAway 라고 멋대로 이름을 짓긴 했는데, 바깥 영역을 눌렀을 때 어떤 동작을 하고싶음 이라는 것은 다양한 곳 (Dropdown, Popover, Modal 등) 에서 쓰일 수 있기 때문에 headless 컨셉의 공통 컴.. 2022. 9. 20.
[vsc] eslint parsing error - eslint working directory 가끔 작업을 하다보면 eslint 오류가 생기지 않을 곳에서 생길일이 있다. 어제는 안뜨고, 오늘은 뜨고, 그런 경우가 있기도 하고 나는 안뜨고, 같이 일하는 동료는 뜨고, 그런 경우가 있는데 아래와 같은 경우는 아닌지 확인해보자. 프로젝트 폴더구조를 아래와 같이 잡았다고 가정했을 때, VSC 의 working directory 를 front 로 잡지 않고 my-project 로 잡는 경우 eslint 관련한 오류가 뜬다. my-project ├── back └── front 해결법은 vsc eslint extension 의 working directories 설정을 지정해준다. 내가 작업할 directories 는 front 와 back 이므로 front, back 을 설정하면 사라지는 것을 확인할 수.. 2022. 9. 16.
✨ init project (Co-Studo) 프로젝트 셋업, 왜 프론트 4명이나? 혼자서 진행하던 프로젝트에 코드스쿼드에서 함께 공부했던 도니, 햄디, 제이미를 꼬드겨 합류시켰다. 프론트에서만 3명을 추가로 합류하는건 과하다고 느껴질 수도 있는 부분이라 고민을 많이 했었고, 합류하시는 분들도 고민이 많으셨을 것이다. 그럼에도 이렇게 진행한 이유를 생각해봤다. 1. 지금까지의 프로젝트는 혼자 or 프론트 2명 이 진행하였음 -> 여러명 일때는 프로젝트를 어떻게 진행할까? 2. 진행하고 있는 스터디의 수작업 (체크인, 체크아웃)이 너무 귀찮음 -> 하루라도 빨리 기능이 돌아가는 페이지를 만들자. 3. 우리만의 UI 시스템을 만들어보자. -> 변경에 유연한 컴포넌트를 작성하기위한 노력 프로젝트를 혼자서 진행해보면서 처음에는 "2. 하루라도 빨리 기능이 .. 2022. 9. 14.
React Children 보통 children 의 type 은 ReactNode 로 설정하는 편이다. children 을 배열로 사용할 상황이 있었다. props 를 통해 받은 값을 바탕으로 Group 의 최대 갯수를 지정하고, slice 하고싶었다. 물론 group 이라는 컴포넌트에 미리 데이터를 slice 하여 보내줄 수도 있겠지만, 미리 데이터를 정제하여 보내는 것 보다 생략해서 보여주는 로직은 Group 컴포넌트의 역할이 맞다고 생각했다. 간단히 JS 환경에서 테스트해보았을 땐 children 이 배열로 반환되어서 map 을 사용할 수 있을거라고 생각하고 사용해보았다. 그런데 다음과 같은 ts 오류가 발생했다. children 을 ReactNode 로 타입을 지정하여 사용하고 있기 때문에 오류가 났다. 의도한대로 map .. 2022. 9. 7.