Work Experience

DataSaker

Assertions

Intro

FlutterFlow

Intro 동적 라우팅은 현대 웹 애플리케이션에서 사용자 경험을 개선하고, 유지보수성을 높이는 데 자주 사용되는 기술 중 하나이다. 특히 Next.js에서는 파일 기반 라우팅 (App Router)을 제공하여 보다 쉽게 동적 라우팅을 구현할 수 있다. URL 쿼리와

Next.js는 next/image에서 이미지 최적화 기능을 제공하여 애플리케이션의 성능을 향상시킬 수 있다. 하지만, 외부 CDN (Amazon S3 등)에서 이미지를 가져올 때는 별도의 설정이 필요하다. 회사 프로젝트를 진행하면서 대다수의 이미지 파일이 S3에 배포

회사 프로젝트를 진행하면서 헤더의 드롭다운 부분 코드가 좀 수정이 필요함을 확인했다. 드롭다운을 렌더링하는 과정에서 불필요하게 useEffect를 호출하고 있어 렌더링 흐름에 맞지 않음을 발견하였고, useMemo를 활용하여 불필요한 렌더링을 방지하고자 했다.

회사 프로젝트를 수행하면서 동영상 파일을 백그라운드에 집어넣어야 하는 상황이 있었다. 크기가 1.3MB밖에 되지 않는 짧은 길이의 영상이라 assets/ 폴더에 직접 넣어도 무방하지만 권장하지 않는 방법이라고 한다. 그렇다고 AWS S3 버킷에 넣기에는 과도한 설정인거

회사 프로젝트에서 react-youtube 라이브러리를 활용하여 유튜브 동영상의 렌더링을 진행하였다. youtube의 iframe을 직접 주입하는 것보다 React의 선언적 프로그래밍에 더 적합하다고 하여 적용하게 되었고, 이 글을 작성하면서 정리를 하고자 한다.

저번 시간에 video-proxy API를 만들어 Vercel Blob에 저장된 비디오를 가져오는 로직을 구현하였다. 기획에 따라 여러 컴포넌트에서 동영상을 렌더링해야 하는 경우가 생겼고, 그때마다 동영상을 호출하는 과정을 줄이고자 IndexedDB에 동영상 파일을 저

LLM을 활용한 서비스에서 스트리밍은 사용자 경험 향상에 필수적인 기능으로 알고 있다.하지만, 단순히 텍스트를 넘겨주는 방법이 아닌, 중간에 사용자의 개입이 필요하거나 (Human-in-the-loop), 특정 조건에서 생성을 일시 정지해야하는 복잡한 비즈니스 로직이

LLM 기반 서비스에서 텍스트 위주의 응답은 사용자 경험 측면에서 한계가 존재한다.특히 최근들어 서비스 고도화를 위해 에이전트가 상황에 맞는 동적 UI (Form, Chart, Button...etc)를 직접 제공하는 기능이 요구되고 있다.다만, 서버에서 HTML이나

최근 팀 내 협업 과정에서 Claude Desktop 앱이 프로젝트 데이터를 관리하는 흥미로운 방식을 알게 되었습니다. 단순히 서버와 통신하는 것을 넘어, 로컬 환경에서 컨텍스트를 구조화하여 관리하고 있다는 점입니다.팀장님을 통해 확인한 결과, Claude Projec

프론트엔드 개발 과정에서 localhost 기반의 데스크톱 환경과 사설 IP를 통한 모바일 기기 환경은 네트워크 보안 모델 측면에서 근본적으로 다르다. 특히 구글 소셜 로그인과 같은 OAuth 2.0 기반 인증을 실제 기기에서 테스트할 때 발생하는 현상들은 브라우저 엔