Peter's hardware & software

주로 Firebase를 사용하다 보니 GCP위주로 쓰게 되네. Next.JS를 해야해서 시험 삼아 비어 있는 프로젝트를 GCP App engine에 올려봤더니 하루 만에 비용이 청구되서 깜놀! App engine은 무료 사용 구간이 없나봐. 암튼 그래서 결과 공유하려고~ App engine 원래 비용은 아래 캡쳐 가장 작은 B1 인스턴스 사용하면 시간당 $0.065가 청구된다고 되어 있네. 한화로 시간당 82원 정도. 24시간이면 1,977원이겠네. 실제로 그런지 봤어. 두 가지로 테스트 해봤는데 첫 번째는 가변 인스턴스, 두 번째는 가장 저렴한 B1 인스턴스야. 청구된 비용은 아래 표로 만들어 봤어 ㅋ 인스턴스 종류 사용량 실제 청구 비용 시간당 비용 Flex(가변) 22.88 hour 1,929원 +..

React Query에서 나름 강력크한 기능 중 하나가 infiniteQuery지. Flatlist로 무한 스크롤 같은 거 구현할 때 데이터를 계속 읽어와야 하잖아. 그럴 때 useInfiniteQuery를 사용해서 연속적으로 데이터를 읽어와. 무한 스크롤 안들어간 앱 찾기가 힘드니까 거의 필수라고 볼 수 있지. Query할 DB는 다른 건 열심히 안해봤고 Firestore는 지금 사용중인데 잘 돌아가네. useInfiniteQuery 원래 문서는 아래 링크에 있으니까 참고해 https://react-query.tanstack.com/reference/useInfiniteQuery useInfiniteQuery Subscribe to Bytes Your weekly dose of JavaScript ne..

next.js 에서는 font optimazation이라는 기능을 제공해. 웹 폰트를 fetch할 때 extra round trip을 제거해준다고 되어 있는데 ㅋㅋ 참 영어를 한글로 바꾸기 힘드네.. 원래는 추가적으로 다운받고 하는 절차가 발생하나 봐? 어쨋든 뭐 그냥 헤더에서 넣어서 쓰면 되나보다 했는데 넣으라는 위치가 따로 있네? 넣으라는 위치는 pages 폴더에 _document.js(tsx) 파일의 ); } } _document.js(tsx)라는 파일은 next.js 프로젝트에 기본적으로 포함되어 있지 않아서 만들어야 하는데 위 코드랑 내용 똑같아. 주석하고 웹폰트 사용하기 위한 tag만 추가한거야. 그리고 나머지 css 파일에서 font-family 설정하면 해당 폰트를 사용할 수 있지. 문서에..

난 최근에 React native를 시작해서 그런지 왠만하면 최신 라이브러리를 사용하고 싶더라고~ 그래서 상태 관리 라이브러리도 가장 최근에 나온 Recoil을 사용하고 있어. Redux가 가장 유명한 거 같은데 ㅎㅎ 난 한번도 써본적이 없어. MobX도 마찬가지고. Context도 몰라. 상태 관리 라이브러리라고 뭐 거창하게 이름붙여 놨지만 결국 React에서 하위 컴포넌트로 props 계속 넘겨주기 힘드니까 전역 변수 쓸라고 만드는 거 아냐? ㅋㅋ 난 이렇게 이해하고 있어 아니면 알려줘. React 할 줄 알면 Recoil도 크게 어렵지는 않은 것 같아. 약간 useState 훅 사용하는 느낌이랄까? 간단하게 사용법을 살펴보자면, 일단 Recoil을 사용하려면 RecoilRoot로 최상위 컴포넌트를 ..

Next.JS 프로젝트를 GCP에 올려 봤어 GCP 계정 당연히 있어야 하고 난 mac 에서 vscode로 개발하니까 참고하고.. (한참 글쓰다가 알았는데 결제 설정 안해놨으면 안돼 ㅠㅠ 그러니까 결제 설정하고 따라하자.) 먼저 next.js 프로젝트를 만들자. 터미널에서 npx create-next-app test --typescript code . typescript 싫은 사람은 뒤에 --typescript 빼도 되고~ 해보나 마나 잘 돌겠지. ㅎㅎ 그래도 돌려봐 ㅎ npm run dev 역시 잘 돌지 ㅎㅎ 나는 3000번 포트에 하고 있는게 있어서 localhost:3001로 뜨는데 보통 3000번으로 뜨니까 헤깔리지 말고 니들은 localhost:3000으로 테스트햐. 그러면 흐미 지겨운거~ 허구..

회로 설계할 때 가끔씩 이럴 때가 있어. AC컨트롤하는 디바이스인데 디지털 로직때문에 SMPS쓰자니 너무 크고 가격도 비싸고 DC 아답터 쓰자니 AC 다이렉트로 들어가는데 웃기잖아 ㅋㅋ 전원 두번 넣는 느낌이지... 바보같고 그래 ㅋ 그치? 그렇다고 보드 위에 SMPS를 직접 설계하자니 무섭잖아!?? 인증 통과 할 생각하니까 심장도 쫄깃쫄깃하잖아! ㅎㅎ 이 뿐만이냐? 발주하는 새끼분들은 맨날 급하데 ㅋㅋㅋ 이럴 때 사용하는 전자 부품이 있어. AC-DC 컨버터라고 하는데 걍 소형 SMPS야. 내가 알고 있는 건 파워젠이라는 회사에서 만들고 있는 MS04시리즈야. 가격은 디바이스마트 기준 6200원이야. 비싸다고? 욕하기 전에 전원 인증 받은 일반 SMPS 얼만지 알아보자. 전원 회로 많이 해보고 인증도 ..

React Native 프로젝트 할 때, 난 함수 컴포넌트만 쓰는데 다른 회사는 어떤지 모르겠네? 검색하다보면 스택오버플로우에도 Class 컴포넌트로 되어 있는 코드가 많던데 난 그놈에 this가 너무 꼴보기 싫어서 함수 컴포넌트만 사용해. 1인 기업이라 누가 뭐라할 사람도 없고 ㅎㅎㅎ 그래도 궁금해서 조금 찾아보니 함수 컴포넌트와 클래스 컴포넌트 차이가 없다고 그러네. 둘 다 몇 가지 추가 기능이 있다고는 하는데 크게 문제 없는 것 같아. 그런데 Hook 에서 이유를 좀 찾을 수 있겠더라구. reactjs.org에서 Hook 문서보면 첫줄에 나와. Class 없이 리액트 사용하고 싶다고 ㅋㅋ 좀 더 읽다 보면 hook 만든 동기가 나오는데 요약하자면 class가 많은 문제를 만든다 그래서 별로다~ 결국..

React Query는 React web이건 React native건 데이터 가져오거나 보낼 때 무지성으로 사용하자 fetch를 이용해 날씨를 가져온다고 가정해보면... const weatherQuery = await fetch(`https://api.openweathermap.org/data/2.5/weather?q=SEOUL&appid=87d867200b06df0b91f9e7399bdXXXXX`) .then((res) => res.json()); 이렇게 하면 간단하게 서울의 현재 날씨를 가져올 수 있어. 이건 쉬운데.. 관리가 어렵겠지.. 같이 생각해 보자고 단순히 fetch만 하면 얼마나 좋겠어? 하지만 때로는 fetch할 때 timeout을 설정해야 하고, 데이터의 만료 시간을 설정해야 하고 또 ..

GCP firebase firestore 작업하다보면 Collection 이름을 변경하고 싶을 때가 있다. Collection 이름을 뭔가 부끄럽게 만들었다던지.. 할 때.. ㅋㅋㅋㅋ 하지만 Firestore는 Collection 이름을 변경하는 기능을 지원하지 않는다. 그래서 새로운 이름의 Collection을 만들고 기존 Collection의 Document 전체를 복사해야 한다. 이런 기능을 하는 툴을 만드는 건 어렵지 않지만 혼자서 북치고 장구치는 1인 기업을 하는 상황에 이런 툴까지 만드는 것은 쉬운 일이 아니다. 그리고 해서도 안된다. '이럴 때 사용하는 툴들이 있을거 같은데?' 하고 검색해보니 몇개가 나오는데 그 중 Firefoo가 괜찮아 보여 사용중이다. Collection이나 Docume..

ADA Staking Pool을 한달 조금 넘게 운영을 해보았습니다. 총 20K ADA 정도로 테스트를 몇 달 해보면 뭔가 답이 나오겠지 했는데 그렇게 길게 끌 일도 아니었습니다. 20K로는 절대 풀 운영이 안됩니다. 그럼 최소한 얼마를 가지고 있으면 스테이킹 풀 운영이 될까요? pooltool.io로 검색을 해보면 현재 카르다노 풀의 saturation은 약 66M ADA입니다. 이 이상 넘어가면 풀의 보상이 더 이상 늘어나지 않고 오히려 줄어듭니다. 이런 식으로 블록 생성자의 집중을 막는 것이죠. 하지만 66M ADA = 66,000,000 ADA, 한화로 170,280,000,000원 입니다. 1700억이 넘는 돈이죠. 이런 풀들은 굉장히 안정적으로 운영되고 있습니다. 위의 그래프로 보자면 4M A..