iamian

blog
  • 에이전트 팀 디자인 패턴
  • 도메인을 샀다, 그래서 DNS를 공부했다
  • 프론트엔드 번들 캐시버스팅을 구현해봤다
  • Git의 3가지 분신술 — checkout, clone, worktree 시각 해부
  • Server-Sent Events (SSE): 간단하지만 강력한 실시간 통신
  • 테이블 셀 복사 시 공백이 포함되는 이유
  • tmux 핵심 사용법 — 터미널 하나로 다 하는 법
  • 라이브러리 코드 리딩: vaul의 모바일 최적화 트릭들

블로그 포스트

All writing

9 of 19 entries

2026
04 · April
#vaul#mobile

라이브러리 코드 리딩: vaul의 모바일 최적화 트릭들

iOS Safari의 동적 환경에서 드로어 하나가 어떻게 멀쩡히 버티는가. vaul 소스에서 읽어낸 표준 너머의 우회 트릭들을 정리한다.

APR 28
5분
#ui-ux#accessibility

프론트엔드 UI/UX 체크리스트 — 실전 가이드

접근성부터 애니메이션까지, 프론트엔드 개발자가 챙겨야 할 UI/UX 규칙을 코드 예시와 인터랙티브 데모로 정리했다.

APR 8
12분
#ui-ux#css

컬러 팔레트 & 타이포그래피 — 업종별 실전 레퍼런스 북

96개 업종별 컬러 팔레트와 57개 폰트 페어링 데이터를 기반으로, 컬러 이론부터 다크모드 변환, 한글 폰트 페어링까지 실전에서 바로 쓸 수 있는 디자인 레퍼런스.

APR 8
5분
#ui-ux#css

프론트엔드 UI 스타일 카탈로그 — 67개 스타일 실전 가이드

Glassmorphism부터 Neubrutalism까지, 67개 UI 스타일을 카테고리별로 정리하고 CSS 구현 핵심과 장단점을 비교했다.

APR 8
9분
#ui-ux#ux

UX 가이드라인 심화편 — 내비게이션부터 AI 인터랙션까지

내비게이션, 폼, 검색, 피드백, 온보딩, AI 인터랙션 등 프론트엔드 UX 가이드라인 12개 카테고리를 Do/Don't 코드 예시와 함께 정리했다.

APR 8
16분
02 · February
#gsap#scroll-trigger

GSAP + ScrollTrigger: 타임라인으로 정밀하게 제어하기

Motion과 GSAP는 어떻게 다른가? timeline, scrub, stagger, SplitText 플러그인으로 스크롤 기반 텍스트 애니메이션을 구현한다.

FEB 20
12분
#css#animation

CSS만으로 글리치 텍스트 만들기

JavaScript 없이 CSS keyframes, pseudo-elements, custom properties만으로 글리치 효과를 구현한다. CSS 애니메이션의 가능성과 한계를 탐구한다.

FEB 16
5분
2025
12 · December
#sse#real-time

Server-Sent Events (SSE): 간단하지만 강력한 실시간 통신

WebSocket보다 간단한 SSE로 실시간 알림과 스트리밍 구현하기. HTTP/2 기반 작동 원리부터 Next.js API Route 구현, TypeScript 커스텀 훅, 실전 데모 분석까지 완벽 가이드.

DEC 22
5분
#frontend#deployment

프론트엔드 번들 캐시버스팅을 구현해봤다

배포 후 사용자가 이전 버전을 보는 문제를 해결하기 위해 클라이언트 레벨 캐시버스팅과 CloudFront Function 기반 인프라를 구축한 과정

DEC 7
5분
iamian

개발과 기술에 대한 생각과 경험을 공유합니다.

BlogPostsBooksAbout

© 2026 ian. All rights reserved.