항상 배워보고 싶었던 프론트엔드 스택 1순위는 electron이다. PWA를 사용하면 PC에서도 어플리케이션처럼 접속 가능하지만, 그보다도 더 근본적으로 "PC 앱"인 것을 만들어 보고 싶었기 때문이다. Cursor IDE를 사용하여 뽀모도로 앱을 개발하면서 일렉트론을 체험해보았다.0️⃣Electron.js웹 기술(HTML, CSS, Javascript)을 사용하여 크로스 플랫폼 데스크톱 애플리케이션을 개발할 수 있는 오픈 소스 프레임워크 일렉트론의 핵심은 Chromium(Google Chrome 오픈 소스)와 Node.js를 하나의 런타임으로 통합했다는 것이다. Chromium은 웹 콘텐츠를 렌더링하고, Node.js는 파일 시스템, 네트워크 등 시스템 리소스에 접근할 수 있는 API를 제공한다. 이 ..

웹 개발을 공부하면서 점점 모바일 앱 개발에 흥미를 가지게 되었다. 주력 스택이 React여서 React Native를 공부해야하나 고민하던 차에, 네이티브 앱과 유사한 사용자 경험을 제공하면서도 웹 기술만으로 구현할 수 있는 PWA(Progressive Web App)을 알게 되었다.  개인적으로 여러 프로젝트에서 PWA를 적용해보았으며, 지금 진행중인 해커톤에서도 PWA를 적용해보았다. 이제는 어떤 프로젝트를 시작하든 PWA부터 적용하고 볼 정도로 PWA를 사랑하지만, 부끄럽게도 잘 알고 사용하지는 못했다. 일단 설치 버튼만 뜨면 만족하는 수준이었는데 이제는 PWA를 적용하는 것에 그치지 않고, 보다 깊이 이해하고 활용하기 위해 PWA의 전반적인 개념부터 핵심 기술까지 정리해보려고 한다. 1. PWA..

인계받은 프로젝트를 확인하던 중 재밌는 상황을 발견했습니다. 로그인 후 홈 화면에서 뒤로가기 버튼을 누르면, 다시 로그인 페이지로 돌아가는 문제였습니다. 상단의 GNB(글로벌 네비게이션 바)를 보면, 로그인 상태임이 분명한데, 콘텐츠 영역에서 로그인 페이지가 표시되는 부자연스러운 상황이었습니다. 생각해보면, 로그인 상태에서는 뒤로가기를 눌러도 로그인 페이지가 표시되지 않는 것이 자연스러운 흐름일텐데, 이 상황은 UX와 보안 측면에서 정상적인 서비스 플로우는 아니라고 판단하여 사용자가 뒤로가기를 눌러도 로그인 페이지로 돌아갈 수 없도록 로그인 페이지 접근 제한을 구현하기로 했습니다. 해결 방법처음에는 토큰 유무를 확인해 리다이렉트 처리하는 방법으로 접근했습니다.이전 프로젝트에서도 이런 방식으로 권한 별 접..

글또를 시작한 후, 쓰리제이에스해보자또 소모임에 가입하여 Three.js 스터디를 하게 되었다. 저번주 전체 온보딩에 이어 이번주 스터디조 오프라인 모임을 했는데, 2주간의 Three.js 스터디 기록을 해보려고한다.  쓰리제이에스해보자또, 첫 번째 오프라인 모임사실 쓰리제이에스해보자또 첫 회의는 온라인으로 진행되었는데, 깜빡 잠들어서 참여하지 못했다. 그래서 첫 번째 오프라인 모임은 무슨 일이 있어도 참여해야겠다고 생각했고, 시험 전날이지만 튜링의 사과까지의 왕복 3시간 모험을 감행했다. 오프라인 모임에서는 "Three.js란 무엇인가"에 대해서 스터디장님께서 발표해주셨다. 발표에서 가장 기억에 남는 내용은 CPU와 GPU의 차이에 대한 설명이었다. 왜 컴퓨터에서 그래픽을 다루기 위해 GPU를 써야 하..