Peter's hardware & software

2022.07.04 - [Startup!!] - Start up 법인 만들기 #1 사무실 임대 Start up 법인 만들기 #1 사무실 임대 회사 잘 다니다가 정신나가서 때려치운지 1년하고 몇 개월이 훌쩍 넘어버렸어. 원래 계획은 년초에 정부 지원 사업인 예비창업자패키지로 멋지게 창업하는 거였는데 똑!하고 떨어져버렸지 뭐야 engschool.tistory.com 3일 전 가계약을 하고 👆👆👆 오늘 계약을 완료했어. 이제 빼박이지 으하하하... 저번에 이야기한 것처럼 법인 설립이 완료되면 계약당사자를 법인으로 바꿔야 한다는 특약을 넣어야 하는데 부동산에 이야기만 해주면 알아서 넣어주니까 크게 신경쓸 필요는 없어. 법인 설립/등기가 완료되면 부동산에 연락해서 계약서에 도장만 다시 찍으면 끝나. 아직 사무실에..

회사 잘 다니다가 정신나가서 때려치운지 1년하고 몇 개월이 훌쩍 넘어버렸어. 원래 계획은 년초에 정부 지원 사업인 예비창업자패키지로 멋지게 창업하는 거였는데 똑!하고 떨어져버렸지 뭐야 ㅎㅎㅎ 최대 1억이나 지원해주고 년초에 신청하는 거니까 하고 싶은 사람은 👇👇👇 https://www.k-startup.go.kr/ K-Startup 창업지원포털 K-Startup에서 알리는 공지사항, 이슈&트랜드, 창업성공사례, 창업소식 등 많은 정보를 보실 수 있습니다. www.k-startup.go.kr ㅎ 누가 그러더라고 예창패도 통과 못하면 사업할 생각하지 말라고 ㅋㅋㅋ 그런데 응~ 엿이나 먹으라 그래~ 망해도 내가 망해 ㅋ 걱정해주는 척은 ㅋㅋ 암튼 이래저래 준비가 끝나서 이제는 법인을 설립하려고 위치는 동탄이고..

gltf 오브젝트를 여러 개 로딩해볼려구. 화면 하나에 object 하나만 로딩하라는 법은 없잖아? 음 혹시나 서로 다른 형식의 object를 한 Scene에 로드할 수도 있고. 암튼 그래서 일단 똑같은 gltf 두개 로딩해볼거야. 특별한 건 없고 load() 대신 loadasync()를 Promiss.All에서 사용하면 간단하게 끝나. 아래 코드처럼. import React, { useEffect, useRef } from "react"; import * as THREE from "three"; import { GLTF, GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader"; import { OrbitControls } from "three/exampl..

2022.06.18 - [임베디드 하드웨어/Kicad] - kicad 적응 프로젝트! #3, kicad symbol & footprint 추가하기 kicad 적응 프로젝트! #3, kicad symbol & footprint 추가하기 2022.06.17 - [임베디드/Kicad] - kicad 적응 프로젝트! #2. kicad sch 살펴보기! 소자 선정하기! kicad 적응 프로젝트! #2. kicad sch 살펴보기! 소자 선정하기! 난 mac os 기준이니까 윈도우는 알아서 하자. ㅋ.. engschool.tistory.com 저번에 이어서 계속 해봅시다. 이번에는 지난번에 결정한 소자들로 Zero crossing 회로를 그려볼거야. 회로는 엄청 간단한데 kicad는 처음 이니까 ㅎㅎ 살살 해보자구..

중요!) 2022년 6월 23일 현재 next-auth 소셜 로그인에 약간 문제가 있어. 어휴 지친다. cognito로 소셜 로그인을 하면 cognito에서는 정상적으로 로그인되지만 next-auth의 하위 모듈인 openid-client에서 nonce mismatch error를 뱉어. 이 때문에 next-auth 세션이 로그인 상태로 안가고 error 페이지로 리디렉션! 이 상태에서 한번 더 로그인을 시도하면 cognito는 이미 로그인이 되어 있는 상태여서 그런지 ㅎㅎㅎ 에러 없이 로그인 상태로 넘어가. 유저가 로그인 두번 눌러야 한다는 거지 -_-;; 암튼 그래서 현재 PR을 기다리고 있어. 👉 #4100 PR이 완료되기 전까지 사람들이 임시방편으로 patch-package를 사용해서 버티고는 있..

2022.06.06 - [Next.js] - Next.js + three.js = 3d object 표현 Next.js + three.js = 3d object 표현 web page도 트렌드가 변할 것 같아서 미리 좀 공부해두는 건데.. 미리인건지는 잘 몰름 ㅋ 암튼 next.js 같은 웹 프레임워크 위에 three.js 사용하는 걸 좀 해보고 싶어서 시도해봤어. 물론 시작하기 전 engschool.tistory.com nextjs위에 3d object 표현하는 거 해봤는데 👆👆👆 왠지 마우스로 휘리릭 휘리릭 돌려보고 싶더라고 그래서 해봤지 ㅋ stack overflow를 헤매다가 이런 동작은 controls 라는 카테고리로 분류되어 있다는 걸 알았어. 그러면 고민하지 말고 threejs.org를 가보자..

next.js에다가 aws amplify auth로 로그인을 구현해보자구. google부터 해볼거야. 나머지는 뭐 똑같겠지. 난 새로운 이메일 계정으로 aws 새로 가입해서 처음부터 시작했어. 새로 만들고 amplify 들어가면 누를 수 있는게 -_- 시작하기 두개 뿐이 없어. 지금 호스팅을 할건 아니니까 amplify studio 시작하기 버튼 클릭. 이제 앱 이름 각자 넣고 confirm deployment 클릭. 그리고 나면 몇분 동안 amplify 설정을 해. 조금 기다려주자 ㅋ 완료가 되면 아래와 같이 대쉬보드가 나오는데.. 이것 저것 살펴보자 ㅋㅋ 하지만 당신이 누를 수 있는 건 backend environments의 studio 시작 버튼 뿐이 없어 ㅋㅋㅋ 의심하지 말고 눌러보자. 이제 am..

난 사실 react-native 프로젝트를 하고 있었어 firebase 사용해서 말이지. 생각보다 쉬워서 괜찮았어 firestore 쿼리하는 것도 그렇게 나쁘지 않았고(typescript로 자료형 정의하는게 약간 더럽긴 했지만.) 그러다 어드민 사이트가 필요해서 next.js를 시작했는데 firebase에는 없는 next.js 호스팅 기능이 AWS amplify에는 있더라고 정확히는 SSR 기능을 지원한다는 거지. 그렇다고 gcp app engine을 쓰자니 무료 구간도 없고 요금도 쌔고 참. aws amplify에다가 firebase 기능(auth, firestore)을 가진 어드민 사이트를 넣자니 끔찍한 혼종같잖어.. 물론 firebase에도 next.js 호스팅을 지원하는 기능을 추가하고 있어. 그..

2022.06.17 - [임베디드/Kicad] - kicad 적응 프로젝트! #2. kicad sch 살펴보기! 소자 선정하기! kicad 적응 프로젝트! #2. kicad sch 살펴보기! 소자 선정하기! 난 mac os 기준이니까 윈도우는 알아서 하자. ㅋ 맥 스튜디오~~~ 크아아아아 ㅋㅋㅋㅋ kicad 처음 실행하면 아래와 같은 화면 나온는데 Create new blank project 눌러서 새 프로젝트를 만들어. 적당한 곳에 engschool.tistory.com 저번에 https://componentsearchengine.com/ 라는 사이트에서 symbol이랑 footprint 다운받을 수 있다고 했잖아? 그거 한번 해보자고. 기본 kicad library에는 bt137이 없으니까 이걸 im..

난 mac os 기준이니까 윈도우는 알아서 하자. ㅋ 맥 스튜디오~~~ 크아아아아 ㅋㅋㅋㅋ kicad 처음 실행하면 아래와 같은 화면 나온는데 Create new blank project 눌러서 새 프로젝트를 만들어. 적당한 곳에 폴더 만들고 프로젝트 이름 입력한 후에 Save 클릭하면 완료! 그리고 나면 아래와 같이 project 파일 하나랑 그 아래로 pcb 파일 하나 sch 파일 하나 생성이 되네. 뻔하겠지만 sch가 회로도 파일이고 pcb가 pcb cad 파일이겠지. 우선은 회로를 그려야 하니까 sch 파일을 열어보자구. 딱히 다른 다른 회로 툴이랑 다른건 모르겠어. part 툴, footprint 툴도 보이고 회로 그리는데 필요한 툴들이 쫙 있네. 특이한 건 python console 정도? p..

이것 저것 하려다 보니 기본적으로 들어가야 하는 것들이 더 필요한 것 같아. 1. 기본 Layout 설정해두는 거랑 2. Mui appbar랑 footer정도 만들어서 스토리북에 넣어두고(나중에 지우더라도) 3. storybook에 mui addon이 있네? 그것도 설치해볼거야. 해봤는데 뭐가 문제인지 잘 안되는 거 같더라구 ㅎㅎ next.js하려면 기본적으로 layout이 있어야겠지? 그치? 아닌가? ㅎㅎ 몰라 난 처음해보는 거라 ㅎ 그런데 뭐 세상에 정답이 어디있겠어? ㅋㅋㅋ next.js 문서 정독했는데 졸면서 읽었으니 다 까먹었겠지? ㅎ 그래서 layout 파트를 다시 읽어봤어. next.js 문서에서 소개하는 layout 방식은 두 가지가 있네. 하나는 _app.tsx에서 header foote..

kicad에 적응하기 위한 프로젝트를 시작한다고 했지! 우리 우선 뭐 만들지부터 대~충 생각해보자고~ 보니까 AC 장비 파워 컨트롤하는 거에 관심이 있는 거 같으니 이걸 해보자구. 그런데 AC 컨트롤 파트랑 MCU 파트랑 분리하고 싶어. 왜냐면 MCU 파트는 거기서 거기라 또 해봐야 무의미. 그러니까 AC 장비 컨트롤 보드랑 MCU 보트 이렇게 두 개를 떠보자고. 대충 다이어그램으로 그리면 아래처럼 말이지. AC 장비는 2 channel 컨트롤 가능하고 220v AC는 당연 AC Control 보드로 들어가겠지? DC 소스는 AC Control 보드에 파워 서플라이 넣어서 MCU보드로 빼줄까 했는데.. 음 어차피 MCU 보드는 다른 곳에서도 재사용이 가능해야 하니까... 암튼 함 보자고 ㅋㅋㅋ 어쨌든 M..

next.js 기본 템플릿 만들기 계속해봅시당 2022.06.14 - [Next.js] - Next.JS 프로젝트 기본 템플릿 만들기#1 Next.JS 프로젝트 기본 템플릿 만들기#1 nextjs 말고도 이런 저런 것들이 많이 필요한 것 같아. 기본적으로 ui framwork도 하나 있어야 할 것 같고 tailwindcss도 사용하고 싶고 storybook도 사용하면 좋을 것 같고 .env.local, .npmrc, .nvmrc 파일도 만.. engschool.tistory.com 저번에 .nvmrc, .npmrc 만들고 package.json 수정했어. 그리고 mui 설치하고 SSR을 위한 _app.tsx, _document.tsx 도 생성/수정 했고 이제 tailwindcss 설치만 하면 내가 원하는..

nextjs 말고도 이런 저런 것들이 많이 필요한 것 같아. 기본적으로 ui framwork도 하나 있어야 할 것 같고 tailwindcss도 사용하고 싶고 storybook도 사용하면 좋을 것 같고 .env.local, .npmrc, .nvmrc 파일도 만들어놔야 하잖아. 또 package.json도 이리저리 만져놔야 하고.. next.js 프로젝트 할 때마다 하기 귀찮으니까 나님용 기본 템플릿 하나 만들어서 github repository 하나 파놔야겠다~ 싶더라고 ㅋㅋ 먼저 스토리북 설정은 끝냈고 👇 2022.06.10 - [Next.js] - Next.js에 StoryBook 설정하기! Next.js에 StoryBook 설정하기! 아니 이게 뭐야! 이것저것 검색하다보니... 현업에서 스토리북이라는..

공부하자고 하면 안되잖아? ㅋㅋㅋ 나도 그래 실제로 해봐야 알겠더라고 똥인지 된장인지 ㅋㅋㅋ 내가 모자라서 그렇겠지 ㅋㅋㅋ 뭐 인정할건 쿨하게 인정하고 ㅋㅋㅋㅋ 그래서 뭐할까?? kicad로 하드웨어 감 살리기 좋은 프로젝트가 뭐가 있을까.. 음.. 이왕이면 나한테도 좋고 하드웨어 처음 해보는 사람들도 좋은 뭐 그런거 해봐야겠지? 그냥.. 그냥 겁나 일반적인거 하면 될 것 같은데? 그래 그냥 현업에서 그래도 써먹을 만한거...... ......... ......... ................ 이런 저런 생각 많이 해봤는데 일단 MCU보드랑 interface 보드랑 나눠 보자구. 그게 좋을 것 같네. 쓸모없는 거 만들기 싫잖아? 그러니까 다른 회사들 다 만드는 MCU 보드부터 만들어 보는게 좋을 듯해..

이전 Storybook 설정하기에서 대부분 다 했는데 👇 2022.06.10 - [Next.js] - Next.js에 StoryBook 설정하기! Next.js에 StoryBook 설정하기! 아니 이게 뭐야! 이것저것 검색하다보니... 현업에서 스토리북이라는 걸 사용하고 있네.. 역시 등신 에휴.. 또 나만 몰랐네. 역시 사람은 다른 사람들이랑 어울려야 해 ㅋㅋ 혼자 이러고 있으니 engschool.tistory.com 아직 server side props는 설정하지 않았어. getServerSideProps 사용하면 서버에서 컴포넌트의 props를 준비하는데 ui 툴인 스토리북에서 될리가 없지. 그렇다고 그냥 놔두면 완벽한 기능 테스트가 안되고 팀원간에 miscommunication이 발생하게 되겠지!..

아니 이게 뭐야! 이것저것 검색하다보니... 현업에서 스토리북이라는 걸 사용하고 있네.. 역시 등신 에휴.. 또 나만 몰랐네. 역시 사람은 다른 사람들이랑 어울려야 해 ㅋㅋ 혼자 이러고 있으니 참. 스토리북은 ui 컴포넌트랑 page 빌드 툴인데 앱(웹)이랑 분리해서 따로 따로 개발할 수 있도록 돕는 아이래. 결국 ui 컴포넌트 빌딩, 테스트, documentaion의 기능을 제공해준다~ 하는 것이지. 홈페이지 슬로건에 다 나와 있는 말! 컴포넌트 드리븐이 뭐시여!? https://www.componentdriven.org/ 에 설명이 잘 나와 있어. 간단히 설명하자면 버튼이나 아바타 툴팁 같은 매우 작은 컴포넌트들 독립적으로 만들고 그 조합으로 form, header, list, table 같은 조금..

Kicad 왜 쓰냐고? 공짜잖어. 난 혼자 사업하려니까 Altium에 몇백 쓰는게 여간 부담이 아냐. 그렇다고 크랙같은거 쓰는 것도 싫고. 당당한 거지가 되고 싶은게지 ㅋㅋㅋㅋㅋ 게다가 난 orcad, pads 세대라 ㅋㅋㅋ Altium 써본 적도 없음 ㅋㅋㅋ 어차피 처음쓰는 건데 kicad면 어떻고 Altium이면 어뗘 ㅋㅋ 그리고 kicad가 공짜더라고 mac os에서도 돌아가고 그래서 사용하기로 결정! 다운로드는 👇 에 가서 운영체제 맞춰서 설치. https://www.kicad.org/download/ Download A Cross Platform and Open Source Electronics Design Automation Suite www.kicad.org 다운로드 하면 아래처럼 기부 페이..

난 여러 가지를 해. 임베디드 보드 하드웨어 캐드로 해고 펌웨어도 짜고.. 가끔은 스케치업(3D 모델링)도 하고.. react native도 하고 서버도 하고 뭐 개판 오분전인 개발자야. 암튼 대부분 컴퓨터 가지고 하는 일들이라 컴퓨터가 느리면 매우 빡이 치지! 당연히 다니던 회사에서도 좋은 PC를 사용했고. 하지만 회사를 관둘 때 "윈도우도 관두고 맥으로 새로 시작하는 거야! 그거 들면 이제 스벅도 당당하게 갈 수 있어!!" 하면서 맥북 에어 M1을 샀지. -_- 음.. 사실은 서브용으로 샀지만 예상외로 엄청난 성능에 반해버리고 만 것이야! 룰루랄라 react native 하려고 x-code와 simulator를 다운로드 받고 개발을 시작했어. 처음에는 괜찮았는데.. 뭔가 조금씩 느려지더라고? 앱이....

next.js 전용 ui framework이 있나? 궁금해서 검색해보니 ㅋㅋ 있네? 물론 회사 다니면서 실무 진행하는 개발자들은 디자인 팀이나 담당이 별도로 있으니까 큰 의미 없겠지만 난 혼자니깐 ㅋ 사실은 혼자 프론트 앤드, 벡엔드, 디자인까지 몽땅 다 해버리고 싶어 욕심을 부리고 있는데 ㅋㅋㅋ 대중이 좋아할만한 디자인 감각은 없으니까 ㅋㅋ 이런 건 framework! 링크는 아래에 https://nextui.org/ 👇 NextUI - Beautiful, fast and modern React UI Library Make beautiful websites regardless of your design experience. nextui.org 사실 nextui.org 말고도 mui라던지 react-bo..