Blog

만들고, 배우고, 기록한 28편의 글

2026년 8월 20일사진 한 장이 서버를 멈춰 세운 날 — 맛도리 이미지 업로드 파이프라인 트러블슈팅HEIC 변환과 EXIF 회전, presigned 업로드 실패 처리, sharp 네이티브 모듈이 API 전체를 끌어내린 장애까지 — R2 직행 이미지 파이프라인을 운영하며 겪은 문제와 해결을 정리했습니다.Next.jsCloudflare R2이미지 처리트러블슈팅
2026년 8월 19일맛도리 개발기 — 동네 사람이 뽑은 맛집이라는 문제 정의광고와 협찬으로 오염된 지도 리뷰 대신, GPS로 동네 인증된 현지인에게 맛집을 묻는 앱 맛도리를 혼자 만들며 내린 문제 정의와 설계 결정들을 정리했습니다.Next.jsExpo모노레포사이드프로젝트
2026년 8월 17일모든 화면 위의 퀵바가 앱 전체를 느리게 했다 — React Native 전역 오버레이 성능 트러블슈팅모든 화면 위에 떠 있는 플로팅 퀵바가 전역 리렌더를 퍼뜨려 실기기에서 프레임 드랍을 만들던 문제를, 셀렉터 분리와 파생 상태 원시화, 애니메이션 정리로 해결한 기록입니다.React NativeExpo성능 최적화트러블슈팅
2026년 8월 16일GPS는 종종 거짓말을 한다 — 맛도리 동네 인증 정확도 트러블슈팅실내와 고층에서 틀어지는 GPS, 행정동 경계 오판, 며칠 묵은 캐시 좌표, 권한 거부와 타임아웃까지 — 좌표를 저장하지 않는 설계 안에서 동네 인증 정확도를 끌어올린 과정을 정리했습니다.React NativeExpo위치기반트러블슈팅
2026년 8월 15일Supabase Realtime은 조용히 끊긴다 — React Native 실시간 동기화 트러블슈팅데일리베이비에 Supabase Realtime을 도입한 뒤 겪은 조용한 연결 끊김, Android 수신 불가, 이벤트 유실 문제를 추적하고 재연결 정책과 보정 fetch로 해결한 과정을 정리했습니다.React NativeSupabaseRealtime트러블슈팅
2026년 8월 14일데일리베이비 출시 후 회고 — 1초 육아기록에 집착한 이유1초 육아기록에 집착하며 만든 데일리베이비를 출시하고 반년, v2.9까지 오면서 검증된 철학과 빗나간 예상, 임신모드와 광고 수익화에 대한 솔직한 회고를 정리했습니다.React NativeExpoSupabase사이드프로젝트
2026년 3월 6일앱의 완성도를 결정짓는 마지막 10% — i18n, 테마, 그리고 프로덕션 하드닝 (5/5)NeonBoard 2.0의 마무리 과정을 다룹니다. 커스텀 i18n, 4-Depth 다크 테마, OLED 번인 방지, Dynamic Island 대응까지 앱 완성도를 높인 디테일을 공유합니다.Flutteri18nThemeSystemDarkMode
광고
2026년 3월 5일인앱 결제 없이 수익화하기 — 보상형 광고 기반 프리미엄 콘텐츠 설계 (4/5)NeonBoard 2.0에서 인앱 결제 대신 보상형 광고를 선택한 이유, 프리미엄 콘텐츠 해금 흐름, 그리고 GoRouter ShellRoute를 활용한 배너 광고 구조를 공유합니다.FlutterAdMobMonetizationRewardAd
2026년 3월 4일Undo/Redo부터 자동 저장까지 — Flutter 에디터의 상태 관리 설계기 (3/5)Riverpod StateNotifier로 20단계 Undo/Redo, 30초 자동 저장, 실시간 프리뷰를 구현하면서 마주친 설계 결정과 트레이드오프를 공유합니다.FlutterRiverpodStateNotifierUndoRedo
2026년 3월 3일외부 패키지를 걷어내고 직접 만든 Flutter 네온 렌더링 엔진 — NeonBoard 2.0 (2/5)마키 패키지의 한계를 넘어 4방향 스크롤, 다중 레이어 네온 글로우, 테두리 발광까지 직접 구현한 커스텀 렌더링 엔진 개발기입니다.FlutterCustomWidgetAnimationTicker
2026년 3월 2일Flutter 앱을 통째로 갈아엎다 — NeonBoard 2.0 아키텍처 설계기 (1/5)단일 화면 LED 전광판 앱을 멀티보드 시스템으로 리뉴얼하면서 Riverpod, Hive, GoRouter를 도입한 아키텍처 설계 과정을 공유합니다.FlutterRiverpodHiveGoRouter
2026년 2월 18일React Native(Expo)에서 Universal Links & App Links 구현하기 — 가족 초대 딥링크 삽질 후기Expo 기반 React Native 앱에서 iOS Universal Links와 Android App Links를 구현하며 겪은 실전 경험을 공유합니다. 초대 코드 공유 → 앱 자동 실행 → 화면 이동까지의 전체 플로우를 다룹니다.React NativeExpoUniversal LinksApp Links
2026년 2월 10일앱인토스에 게임을 출시하기까지 — 5편: 광고 연동, 네이티브 브릿지, 그리고 심사 반려앱인토스 플랫폼에 차트예측게임을 배포하면서 겪은 광고 SDK 연동, WebView-네이티브 브릿지 통합, 심사 반려 대응까지의 실전 경험을 정리했습니다.앱인토스토스WebView광고SDK
2026년 2월 8일모바일 WebView에서 부드러운 캔들스틱 차트 구현하기 — 4편: 차트 렌더링과 애니메이션lightweight-charts로 전문가급 캔들스틱 차트를 구현하고, framer-motion으로 게임 피드백 애니메이션을 넣으면서 모바일 성능을 최적화한 과정을 정리했습니다.lightweight-chartsframer-motion캔들스틱차트모바일최적화
2026년 2월 6일게임의 4가지 상태를 Zustand로 관리하기 — 3편: 상태 관리와 아키텍처4-phase 게임 상태를 Zustand의 선택적 구독 패턴으로 설계하고, View/Logic 분리를 통해 리렌더링을 최소화한 아키텍처를 정리했습니다.Zustand상태관리React아키텍처
광고
2026년 2월 4일실제 주식 데이터로 차트 예측 게임 만들기 — 2편: 게임 로직 설계삼성전자, SK하이닉스 등 실제 한국 주식 데이터를 가공해 게임 시나리오로 만드는 과정과, 점수·콤보·하트 시스템의 설계 이유를 정리했습니다.ReactTypeScript게임로직주식데이터
2026년 2월 4일육아앱 직접 만든 개발자의 회고 (5) — 성능 최적화와 UX 디테일, 그리고 회고React Native에서 리스트 성능 최적화, 홈 화면 위젯, 예방접종 관리, 일과표 공유 기능의 구현 과정과 1인 사이드 프로젝트를 마무리하며 느낀 점을 정리했습니다.React Native성능 최적화위젯예방접종
2026년 2월 2일토스 앱 안에서 주식 차트 예측 게임을 만들어봤다 — 1편: 기획과 시작앱인토스(Apps in Toss) 플랫폼 위에 주식 차트 예측 게임을 만들게 된 계기와, 토스 생태계 안에서 미니앱을 개발한다는 것의 의미를 정리했습니다.ReactTypeScript앱인토스토스
2026년 1월 27일Flutter와 Riverpod으로 '나만의 타바타 타이머' 앱 개발기 (feat. 상태 머신 구현)Timer.periodic으로 1초씩 빼는 타이머는 20분짜리 운동에서 눈에 띄게 밀립니다. 상태 머신으로 사이클을 정리한 과정과, 아직 못 고친 시간 오차·백그라운드 문제를 함께 적었습니다.FlutterDartRiverpodSQLite
2026년 1월 25일육아앱 직접 만든 개발자의 회고 (4) — 가족 공유와 데이터 동기화Supabase의 Row-Level Security로 가족 간 역할별 접근 제어를 구현하고, 오프라인 퍼스트 아키텍처에서 증분 동기화를 설계한 과정을 정리했습니다.SupabaseRLS데이터 동기화오프라인 퍼스트
2026년 1월 18일육아앱 직접 만든 개발자의 회고 (3) — 야간모드와 테마 시스템 구현기새벽 수유를 위한 OLED 야간모드를 설계하고 구현한 과정입니다. 자동 전환 스케줄링, 기록 유형별 색상 매핑, 자정 경계 처리 등 실제 부딪힌 문제와 해결 과정을 다룹니다.React Native다크모드야간모드UX
2026년 1월 13일GitHub 팩트폭격기 'Code Truthbomb' 개발기: Next.js 16과 AI로 동료의 멘탈을 부숴보자테마 결정을 코드가 아니라 프롬프트에 맡겼다가, 같은 점수에 다른 테마가 나오는 걸 뒤늦게 알았습니다. LLM에게 맡길 것과 코드가 쥐어야 할 것의 경계에 대한 기록입니다.Next.js 16AIGroqVanilla Extract
2026년 1월 13일Next.js 16과 Zustand로 '신의 두뇌' 트레이딩 게임을 만든 후기 (feat. 부동소수점의 악몽)종가 하나로 승패를 가르면 실력이 아니라 운을 재는 게임이 됩니다. 판정 기준을 회귀 추세선으로 옮기고, BigInt로 부동소수점을 걷어내고, 타임스탬프를 2000년으로 옮겨 정답을 숨긴 과정을 정리했습니다.Next.jsTypeScriptGame DevFinancial Tech
2026년 1월 13일2026년 운세는 AI 무당에게? Next.js 16과 Groq로 만든 '팩트폭력' 운세 심판관 개발기Zod로 LLM 출력을 검증하는 것까지는 됐는데, 프롬프트로 'SSR은 10%만'이라고 지시한 건 끝내 지켜지지 않았습니다. 확률을 모델에게 맡기면 안 되는 이유와 생년월일을 일부러 받지 않은 이유를 적었습니다.Next.jsGroqGenerative AITypeScript
2026년 1월 13일육아앱 직접 만든 개발자의 회고 (2) — 실시간 기록 시스템과 퀵액션 UX새벽 3시에 졸린 상태에서도 쓸 수 있는 육아 기록 UX를 어떻게 설계했는지, 퀵액션 버튼, 경과 시간 추적, 실행취소 스낵바의 구현 과정을 정리했습니다.React NativeUX애니메이션Haptic Feedback
2026년 1월 13일합법적 월급 루팡을 위한 도구, Project Lupin 개발기 (feat. Next.js 16)연봉을 초 단위로 환산해 보여주는 계산기를 만들며, setInterval을 버린 이유와 250일이라는 임의의 숫자를 고른 근거, 그리고 금액 마일스톤에 광고를 걸었다가 후회한 이야기를 적었습니다.Next.jsTailwind CSSPWASide Project
2026년 1월 13일Next.js 16으로 나만의 주식 투자 비서 만들기 (터틀 트레이딩 알고리즘 구현기)20일 신고가 돌파만 구현했더니 휩소에 계속 걸렸습니다. 추세가 없으면 감점하는 3단계 점수 체계를 만들고, 신호를 내지 않는 것도 답이라고 인정하기까지의 기록입니다.Next.jsTypeScriptSide ProjectAlgorithm
2026년 1월 11일육아앱 직접 만든 개발자의 회고 (1) — 기획부터 기술 스택 선정까지아기를 키우면서 직접 육아 기록 앱을 만들기로 결심한 이유와, React Native(Expo), Zustand, Supabase를 선택하게 된 기술적 배경을 정리했습니다.React NativeExpoZustandSupabase