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

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

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

구버전 브라우저에서 PDF 뷰어 문제가 계속 발생해서 S3 + Lambda를 활용해 PDF를 이미지로 자동 변환하는 서버사이드 솔루션으로 근본적으로 해결했고, 프론트엔드 개발자도 백엔드/인프라까지 알아야 진짜 문제 해결이 가능하다는 걸 깨달았다는 이야기

이 글은 프론트엔드 공통 코드를 기존의 런타임 API 방식에서 빌드타임 코드 포함 방식으로 전환한 경험을 다룹니다. 빌드타임에 공통 코드를 객체로 변환해 타입 안정성과 자동완성을 높이고, 네트워크 의존성과 유지보수 부담을 크게 줄였습니다. 이로써 초기 화면 속도, 코드 관리 효율, 개발자 경험이 모두 개선되었습니다.