iamian

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

블로그 포스트

All writing

7 of 19 entries

2026
04 · April
#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분
03 · March
#browser#dom

테이블 셀 복사 시 공백이 포함되는 이유

테이블에서 텍스트를 복사할 때 앞에 공백이 붙는 현상의 원인을 Selection API, Range, Clipboard 직렬화 알고리즘으로 추적한 기록

MAR 31
3분
02 · February
#variable-font#svg

Variable Font & SVG: 브라우저 내장 기술의 가능성

font-variation-settings로 마우스 근접도에 반응하는 텍스트, SVG textPath로 곡선 위를 흐르는 텍스트를 구현한다.

FEB 23
10분
#css#hover

CSS로 만드는 호버 & 커서 이펙트

CSS custom properties와 마우스 좌표만으로 GlareHover, StarBorder, Magnet 효과를 구현한다. JavaScript 최소화 전략과 CSS의 실제 한계를 탐구한다.

FEB 21
13분
#css#animation

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

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

FEB 16
5분
iamian

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

BlogPostsBooksAbout

© 2026 ian. All rights reserved.