react

벌써 2025년의 4분의 1이 다되어간다🧐뭘 했다고 벌써 3월인가, 졸업을 하면서 빡센 취준을 하겠노라 다짐한 것이 무색하게 3개월동안 제자리걸음만 한 느낌이다.올해 목표를 되새길 겸, 24년 12월 말에 시작해서 25년 1월 1일에 배포한 개인 프로젝트 회고를 해보려고 한다.  💫@namespace올해 1월 1일, 간단하게 개인 프로젝트를 만들어서 배포를 했다. 서비스명은 @namespace, 사용자가 입력한 이름으로 고유 별자리를 만들어주는 서비스이다. 💫프로젝트의 시작사실 @namespace는 24년 7월 쯤, 파이썬으로 간단하게 코드를 짜고 '명로'라고 이름을 붙여놓은 상태였다.  명로 명로, 내 이름으로 만드는 나만의 심볼💫내 이름으로 만드는 심볼, 로고, 사인, 별자리.velog.io ..

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

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

프로젝트를 인수인계 받아서 작업 중인데, 작업 목록 중 이미지 수정 시 무한 렌더링 오류 발생 항목이 있었다. 이전부터 오류를 인지하고는 있었는데, 어떤 조건으로 발생하는 오류인지, 원인이 뭔지는 모른다고 하셨다. 내가 작업하기로 하여 일단 조건부터 찾아보려고 하였는데 찾을 것도 없이 이미지 수정만 하면 무조건 발생하는 오류였다. 오류 로그를 보니 useEffect 활용 관련해서 문제가 발생하는 같았다. 그런데 오류 발생 코드에 useEffect가 5개 이상 선언되어 있어서 찾기 너무 어려웠고..모든 useEffect 내에서 콘솔을 찍어 문제를 유발하는 useEffect를 찾아내었다.  콘솔을 찍어보니 문제 발생 컴포넌트에서 무한 렌더링 되어 일정 스택을 찍으면 아래 오류 메시지가 출력되는 구조였다. (..