ComitChu
1.[ComitChu 개발기] 버튼과 입력창을 원자화하다 – 재사용 가능한 UI 컴포넌트 설계기
ComitChu는 GitHub 커밋 활동을 기반으로 펫이 진화하는 재미있는 웹 서비스다. 서비스가 점점 커지면서 공통 UI 요소를 효율적으로 관리하는 구조의 필요성을 절감했고, 이를 해결하기 위해 버튼과 입력창을 컴포넌트화(원자화) 하는 작업을 진행했다.초기 코드베이스
2.[ComitChu 개발기] GitHub 소셜 로그인 구현
ComitChu 프로젝트에서는 GitHub 기반의 소셜 로그인을 OAuth 2.0 방식으로 구현했다.React + Spring Boot 기반 SPA 구조이며, 로그인 흐름은 Authorization Code Grant 방식에 따라 구성했다.이 글에서는 실제 프론트 코
3.[ComitChu 개발기] 비슷하지만 완전히 다르다 – TypeScript 선언문 심층 비교
TypeScript는 개발자에게 강력한 타입 시스템을 제공하지만, 겉으로 보기에 비슷한 여러 선언문들 때문에 혼동을 느끼기 쉽다. 특히 React와 같은 프레임워크를 사용하다 보면, 이러한 미묘한 차이를 제대로 이해하지 못해 런타임 오류, 타입 누락, 심지어는 불필요한
4.[ComitChu 개발기] TypeScript로 빈 객체를 표현하는 방법
TypeScript에서 빈 객체를 타입으로 표현할 때 가장 흔히 사용되는 표기는 {}이다.그러나 {}는 겉보기와 달리, 실제로는 빈 객체를 정확히 표현하는 타입이 아니다.이 글에서는 {}와 Record<string, never>의 차이점을 정리하고,정확하게 빈 객
5.[ComitChu 개발기] Vite에서 로컬은 되는데 배포하면 이미지가 안 보이는 문제와 해결 방법
React + Vite 프로젝트를 개발하던 중, 다음과 같이 이미지 경로를 설정했다.개발 서버(localhost)에서는 이미지가 정상 표시됐다.프로덕션 빌드(배포)에서는 이미지가 표시되지 않고 404가 발생했다.로컬에서는 됐지만, 배포 환경에서 경로가 깨지는 현상이 있