📝 성장을 위한 기록
-
Electron 배포 및 자동 업데이트 (feat. AWS S3 & electron-updater)Study/Frontend 2023. 9. 4. 16:10
Electron Build Lifecycle 데스크탑 애플리케이션을 빌드하고 배포하는 과정에서 주목해야 할 부분은 배포 가능한 파일을 생성하는 단계이다. 웹과 달리 패키징 단계에서 생성된 번들을 가지고 OS별 설치 프로그램을 생성해야 한다. 이 단계에서 대응하고자 하는 OS별, 플랫폼별로 모두 빌드해줘야 한다. electron-builder를 선택한 이유 electron 앱을 패키징하고 배포하기 위해 사용하는 대표적인 도구는 Electron Forge로 문서에서 소개되어 있다. Electron Forge의 가장 큰 장점은 분산되어 있는 배포 작업용 패키지들을 통합해서 빌드 파이프라인을 최소한의 구성으로 생성할 수 있다는 것이다. electron-builder 역시 분산되어 있는 패키지들을 어느 정도 통합..
-
Electron Code Signing (코드 서명)Study/Frontend 2023. 8. 25. 16:10
내 맥북에서는 잘 되는데 다른 사람 맥북에서는 실행이 안되네? 윈도우에서 실행은 가능한데 SmartScreen filter에 걸리네? 데스크탑 앱을 처음 만들어 보는 사람이라면 위와 같은 상황을 모두 한 번 쯤은 겪어봤을 것이다. 나 역시 그랬다 🥲 이번에 Electron으로 데스크탑 앱을 만들어야했는데, 데스크탑 앱 개발에 대한 기본 지식이 부족한 상황이었다. electron-vite를 사용해서 개발 환경을 구축하는데는 무리가 없었지만, 역시나 예상대로 빌드와 배포를 하는데 엄청난 시간과 노력이 필요했다. 위 문제를 해결하는데도 며칠 동안 리서치하며 해결방안을 찾아냈다. 위 문제의 정답은 코드 서명에 있었다. 코드 서명이란? 코드 서명(Code Signing)은 실행 파일과 스크립트에 디지털 서명을 하..
-
Storybook과 Vitest에서 MSW 모킹 핸들러 재사용하기Study/Frontend 2023. 8. 18. 12:03
프론트엔드 개발자의 작업 능률은 Storybook과 MSW를 만나기 전과 후로 나뉜다고 할 수 있다. 프론트엔드 개발을 하면서 가장 불편한 점 중 하나가 백엔드 개발에 대한 의존성이 높다는 점이다. 백엔드 API가 완성되어야 데이터 처리를 진행할 수 있는데, 보통 UI 작업을 먼저 진행해도 백엔드 작업이 끝나기 전까지 대기하는 상황이 종종 있었다. 물론 Mocking 데이터를 직접 만들어서 UI가 제대로 렌더링 되는지 확인할 수는 있었지만 꽤나 번거로운 일이었다. 하지만 Storybook을 만나면서 백엔드 API 없이도 데이터에 대한 다양한 케이스를 만들어서 미리 정확한 UI를 만들어 보며 시각적 테스트를 진행할 수 있게 됐다. 그리고 MSW를 도입하면서 API가 완성되지 않아도 백엔드팀에서 Schema..
-
React 프로젝트 구조 설계를 넘어서 프론트엔드 아키텍처 설계에 대한 고찰Study/Frontend 2023. 5. 19. 17:52
React 폴더 구조를 어떻게 구성할까? 비즈니스 로직은 어떻게 분리할까? React와 같은 라이브러리로 신규 서비스를 개발하게 되면 프론트엔드 팀에서 가장 첫 번째로 고민해야 할 요소는 프로젝트의 폴더 구조라고 생각한다. Next.js와 같은 프레임워크로 개발을 하게 되면 폴더 구조가 어느 정도는 정해져있기 때문에 고민해야 할 부분이 비교적 적다. 하지만 React의 경우에는 정해진 폴더 구조는 없고 일반적인 접근 방식만을 제안하고 있다. 따라서 개발자에 따라서 프로젝트 설계 방법이 천차만별일 것이고 설계에 정답은 없다. 1년 차때는 프론트엔드 프로젝트 구조 설계에 대해 깊은 고민을 하지 않고 내가 자주 쓰고 익숙한 패턴을 그대로 가져다가 새로운 서비스에 적용하곤 했다. 하지만 10년 차 동료 개발자가..
-
[컨퍼런스 리뷰 / 고퍼런스] Onboard your Life to the Web3Record/review 2023. 4. 4. 12:12
Web3 업계에 종사하면서 프로젝트의 성공 요인 중에 하나는 커뮤니티라는 것을 크게 느끼고 있다. 이번 고퍼런스 역시 고스트 프로젝트의 커뮤니티를 좀 더 탄탄하게 만드는 동시에 더 확장할 수 있는 것을 목표로 한 것 같다. 고스트 프로젝트 홀더뿐만 아니라 비홀더까지 초청한 점이 눈에 띄었다. 강연과 네트워킹 시간을 적절히 섞어서 시간 분배를 잘 한 점도 눈에 띄었다. 그리고 단순한 친목 모임이 아니라 블록체인 지식을 쉽게 더 전파하기 위해 훌륭한 연사까지 초청했다! 그 모든 것을 NFT 홀더들이 직접 준비한 것도 정말 멋있었다. 고퍼런스와 같은 밋업이 많아져서 Web3 세상에 많은 사람들이 관심을 조금이라도 가진다면 Mass Adoption이 가능할 수 있다고 본다! 이번 고퍼런스에 대한 상세 내용은 아..