안녕하세요, 이상혁입니다

AI를 활용해 하드웨어, 백엔드, 데이터 등 낯선 분야를 빠르게 학습하며 다양한 자동화 시스템을 구축했지만, 정작 내 머릿속에 남는 경험치는 점점 줄어들고 있다는 사실을 깨달았습니다. AI가 제공하는 속도와 편리함을 누리면서도 진짜 실력을 쌓기 위해, 모르기 때문에 배우는 과정 자체를 기록하는 '몰라서 배웠습니다' 시리즈를 시작합니다.

AI 서비스를 사용하면서 실시간으로 답변이 생성되는 UX를 경험하게 되었고, 이를 구현하는 Stream 개념에 관심을 갖게 되었습니다. Stream은 거대한 데이터를 작은 청크로 쪼개어 연속적으로 전달하는 방식으로, 메모리 효율화와 응답 시간 단축의 이점을 제공합니다. Next.js 프로젝트에서 ReadableStream과 Fetch API를 활용해 직접 스트리밍 UI를 구현하고, 상태 업데이트 최적화와 불완전한 JSON 처리 같은 실무에서 고려해야 할 사항들을 정리했습니다.

토스의 useFunnel 훅을 알게 되고 직접 구현해 적용한 경험을 공유합니다. Funnel은 마케팅 용어에서 시작되어 소프트웨어 분야에서 사용자가 최종 단계까지 도달하는 과정을 의미하며, 여러 단계로 나뉜 화면을 효과적으로 처리할 수 있는 솔루션입니다. 직접 구현한 Funnel 코드를 분석하고, 공식 use-funnel과 @use-funnel의 차이점을 비교하며 데이터 상태 관리와 히스토리 처리에 대한 고민과 개선 방안을 탐구합니다.