2026 · 10
try/finally 지옥 탈출 — JS using, 그런데 "3대 브라우저 지원"은 아직이다
블록을 빠져나갈 때 정리를 알아서 해주는 using 선언. 세 엔진이 구현을 마쳤다는 소식이 돌지만, 정식 사파리 기준으로는 아직이다. 문법을 정리하고, 퍼블리셔가 지원 소식을 읽는 법으로 다시 본다.
Writing
디자인·프론트엔드·백엔드·AI 도구를, 퍼블리셔의 시선으로 다시 읽습니다. Notes from a publisher learning to build.
2026 · 10
에이전트를 감시하는 린터가 나왔다 — shadcn/lint, 문제를 푸는가 증상을 관리하는가
AI 에이전트가 디자인 시스템을 어기면 잡아주는 shadcn/lint. 잘 만든 도구다. 그런데 이 도구가 필요해졌다는 사실 자체를, 플레인 CSS로 디자인 시스템을 짠 사람의 눈으로 비판적으로 읽는다.
2026 · 09
사용자 입력이 그대로 이미지가 될 때 — Next.js ImageResponse RCE로 다시 보는 이스케이프의 기본
next/og의 ImageResponse에서 CVSS 9.5짜리 원격 코드 실행(CVE-2026-94545)이 터졌다. 원인은 이스케이프 하나. 퍼블리셔가 XSS와 싸우며 기른 감각으로, 이 사고를 다시 읽는다.
2026 · 09
우리 블로그 댓글 API, 이대로 괜찮을까 — Supabase 9월 업데이트 점검기
스코프드 토큰·트레이스 컨텍스트·logs.all 폐지. Supabase의 9월 변경 세 가지를, 이 블로그가 직접 만든 댓글 시스템 기준으로 하나씩 점검하고 고칠 것만 골라낸다.
2026 · 09
설정 파일이 사라진 Tailwind — v4가 CSS로 돌아온 이유
tailwind.config.js를 지우고 @theme 한 블록으로 옮긴 Tailwind v4. Rust 엔진과 CSS-우선 설계가 무엇을 덜어냈는지, 플레인 CSS를 고집하는 사람의 시선으로 정리한다.
2026 · 09
스크롤에 맞춰 움직이는 걸, 이제 JS 없이 — 스크롤 기반 애니메이션
스크롤바를 따라 진행되는 애니메이션이나 "화면에 들어오면 나타나는" 연출을, 스크롤 이벤트를 듣지 않고 CSS만으로 만든다. animation-timeline을 퍼블리셔의 시선으로 정리한다.
2026 · 09
[배우는 중] 버벅임에 드디어 점수가 붙었다 — INP
Core Web Vitals에서 FID를 밀어낸 새 지표 INP. "눌렀는데 왜 늦게 반응하지"라는 오래된 답답함이, 이제 측정 가능한 숫자가 됐다.
2026 · 09
툴팁 위치를 JS로 계산하던 시절의 끝 — CSS 앵커 포지셔닝
드롭다운·툴팁·팝오버의 위치를 잡으려고 getBoundingClientRect를 부르던 일을, 이제 CSS가 대신한다. 앵커 포지셔닝을 퍼블리셔의 시선으로 정리한다.
2026 · 09
페이지 전환은 이제 브라우저의 일 — View Transitions API
화면이 부드럽게 넘어가려면 SPA가 필요하던 시절은 지났다. 브라우저가 옛 화면과 새 화면 사이를 알아서 이어주는 View Transitions를, 이 블로그가 실제로 쓰는 방식과 함께 정리한다.
2026 · 09
[배우는 중] 이 useEffect, 사실 필요 없었다
검색 결과를 상태에 담고 useEffect로 다시 계산했더니, 한 박자 늦은 화면이 깜빡였다. effect가 "그 다음 단계"가 아니라는 걸 그때 알았다.
2026 · 09
제일 사랑받는 CSS가 제일 안 깔린 CSS라면 — Interop 2027 제안이 열렸다
State of CSS 2026에서 개발자들이 가장 좋아한 새 기능은 앵커 포지셔닝. 그런데 아직 브라우저 지원이 가장 얕은 기능이기도 하다. 그 간극을 메우는 Interop 프로젝트와, 방금 열린 2027 제안을 퍼블리셔의 시선으로.
2026 · 09
격주로 새 버전이 나오는 브라우저 시대 — Chrome 153, 2주 릴리스 주기가 크로스브라우징 QA에 묻는 것
Chrome이 153부터 4주였던 메이저 릴리스 주기를 2주로 줄였다. Firefox도 같은 방향으로 움직이는 지금, 한 달에 한 번 보던 릴리스 노트를 격주로 봐야 하는 시대에 크로스브라우징 QA 루틴이 어떻게 달라져야 하는지 정리한다.
2026 · 09
브라우저에게 "너 어디야?"를 묻는 법 — Geolocation API
날씨앱을 만들면 제일 먼저 부딪히는 게 "사용자 위치 가져오기"다. navigator.geolocation의 기본 사용법과, HTTPS·권한·에러 처리·정확도 옵션 같은 실전에서 꼭 데이는 지점들을 퍼블리셔 시선으로 정리한다.
2026 · 09
10년 마크업하던 사람이 개발로 방향을 튼 이유
퍼블리셔로 10년. 화면을 잘 만들었지만 늘 "그다음"에서 남에게 넘겨야 했다. AI가 코드를 대신 짜주기 시작한 지금이, 오히려 그 경계를 넘기 가장 좋은 때라고 느낀 이야기.
2026 · 09
Essay 2026 · 09
CSS가 요즘 미쳤다 — 예전엔 JS로 하던 걸 이제 CSS로
몇 년 손 놓은 사이 CSS가 딴 세상이 됐다. :has()·container query·color-mix·@layer… 예전엔 JavaScript나 전처리기를 동원하던 걸 이제 순수 CSS가 해낸다. 디자인 시스템을 만들며 실제로 쓴 것들만 골라 소개한다.
2026 · 09
AI가 코드를 짜주는 시대, 퍼블리셔의 강점은 오히려 세진다
"AI가 다 짜주면 퍼블리셔·프론트엔드는 위험한 거 아냐?"를 자주 듣는다. 직접 에이전트로 개발하며 느낀 건 정반대였다. 짜는 일이 싸질수록, 읽고 검증하고 판단하는 눈이 비싸진다.
2026 · 09
React 19가 퍼블리셔에게 의미하는 것 — 손메모의 시대가 저문다
React 19와 컴파일러 소식은 보통 "성능"으로 이야기된다. 하지만 이제 막 React를 배우는 퍼블리셔 입장에서 더 큰 의미는 따로 있다 — 외워야 할 규칙이 줄고, "왜"에 집중할 수 있게 됐다는 것.
2026 · 09
퍼블리셔 → 개발자, 진짜 장벽은 문법이 아니라 용어였다
개발 공부를 시작하고 제일 막힌 건 코드가 아니라 단어였다. 빌드·번들·배포·상태·의존성… 다들 아는 척 넘어가는 이 말들을, 퍼블리셔의 언어로 하나씩 번역해봤다.
2026 · 09
내 개발 셋업 2026 — 덜어낸 도구들
에디터·터미널·에이전트·배포까지, 요즘 매일 쓰는 도구 한 바퀴. 화려한 풀패키지보다 "덜어낸 것"을 고르는 취향으로 꾸린 로컬 우선 셋업을 정리한다.
2026 · 09
에이전트 여러 개를 굴리는 하루 — 나는 검수하는 자리에 선다
이 블로그·디자인 시스템·날씨앱을 각각 다른 AI 에이전트 세션에 맡기고, 나는 조율하고 검수한다. 여러 에이전트를 병렬로 굴리는 실전 워크플로우와, 그때 사람이 붙잡아야 할 자리를 정리한다.
2026 · 09
작은 도구 예찬 — Hosts Editor 같은 것들
거창한 프레임워크만 도구가 아니다. hosts 파일을 편하게 만져주는 작은 앱 하나가 하루의 마찰을 줄인다. "덜어낸 도구"를 좋아하는 사람의, 작지만 매일 쓰는 것들에 대한 이야기.
2026 · 09
모노톤인데 왜 청자 한 방울인가 — 절제와 강조에 대하여
화면을 거의 무채색으로 두고 딱 한 색만 남긴다면, 그 한 색은 언제 나타나야 할까. 절제 속의 강조에 대한, 자개 빛에서 출발한 짧은 미학 에세이.
2026 · 09
코드에도 미니멀리즘 — "Less, but better"를 상태와 의존성에 적용하기
적게, 그러나 더 좋게. 디터 람스의 원칙은 물건 정리에만 쓰이는 게 아니었다. 개발을 배우며 만난 파생 상태·의존성·추상화에서, 같은 "덜어냄"의 감각이 그대로 통했다.
2026 · 09
매일 아침 "오늘의 공부" 한 조각을 쌓는 습관
개발 전환은 큰 결심 한 번이 아니라, 매일 아침 한 조각씩 쌓는 습관으로 굴러간다. 출근길에 개념 하나를 정리하고 아카이브에 누적하는 루틴이, 왜 나에게 맞았는지.
2026 · 09
React 폼은 "비제어"로 두고, 검증은 Zod 스키마 하나로
input마다 useState를 걸면 한 글자 칠 때마다 폼 전체가 리렌더링된다. React Hook Form은 반대로 간다 — ref로 비제어로 두고, zodResolver로 검증과 타입을 스키마 한 곳에서 뽑는다. 순수 HTML form의 감각과 이어진다.
2026 · 09
TypeScript 타입은 빌드되면 사라진다 — 그래서 Zod로 런타임에 검증한다
as User로 "이건 User야"라고 우겼더니, 서버가 다른 걸 줬을 때 엉뚱한 화면에서 터졌다. 타입은 컴파일하면 지워진다는 사실과, 경계(API·localStorage·폼)에서 Zod로 실제 확인하는 법을 정리한다.
2026 · 09
판별 유니온으로 "불가능한 상태"를 타입에서 없애기
isLoading·data·error를 각각 boolean으로 쪼갰더니, 로딩인데 데이터도 에러도 있는 "불가능한 조합"이 타입상 합법이 됐다. as나 ?.를 연달아 쓰게 된다면 타입이 아니라 상태 모델링이 덜 된 신호다.
2026 · 09
TypeScript 유틸리티 타입 — 원본 하나로 Partial·Pick·Omit·Record 뽑아 쓰기
같은 interface를 복붙해 두세 번 정의하다 원본이 바뀌면 조용히 낡았다. 유틸리티 타입으로 "원본 하나만 두고 필요한 모양으로 깎아 쓰는" 법을, SCSS mixin에 비유해 정리한다.
2026 · 09
TypeScript 제네릭 — 타입을 "매개변수"처럼 끼워 넣기
라이브러리 타입 정의에 나오는 <T>가 늘 벽이었다. 제네릭을 "로직은 하나로 두고 타입만 갈아 끼우는 빈칸"으로 이해하니, useQuery<User[]> 같은 문법이 읽히기 시작했다. 퍼블리셔 시선으로 정리한다.
2026 · 09
싱글 스레드인데 왜 안 멈출까 — 이벤트 루프와 이벤트 위임
JS는 한 번에 하나만 처리하는데 어떻게 여러 일이 동시에 도는 것처럼 보일까. 콜 스택·마이크로태스크·매크로태스크로 이벤트 루프를 정리하고, 리스너를 부모 하나에 다는 이벤트 위임까지 퍼블리셔 시선으로 엮는다.
2026 · 09
[배우는 중] 화면 숫자는 3인데 콘솔엔 0만 찍혔다 — 오래된 클로저
setInterval을 useEffect에 넣었더니 state가 바뀌어도 콜백은 계속 옛날 값만 봤다. "오래된 클로저(stale closure)"에 데이고, 왜 그런지와 빠져나온 길을 남긴다.
2026 · 09
[배우는 중] 서버 데이터를 useState에 담았다가 캐시 지옥을 봤다
API로 받아온 데이터를 useState·전역 스토어에 넣고 직접 동기화하다 매번 꼬였다. "상태에는 세 종류가 있고 서버 상태는 내 것이 아니다"를 배우며, TanStack Query로 넘어간 과정을 남긴다.
2026 · 09
[배우는 중] "성능 개선해주세요"가 사실은 숫자 세 개였다 — Core Web Vitals
막연히 "느리다"를 어떻게 손대야 할지 몰랐다. 구글이 매기는 LCP·INP·CLS 세 지표를 배우고 나니, 성능 작업이 "감"이 아니라 "숫자를 낮추는 일"로 바뀐 과정을 남긴다.
2026 · 09
서버가 2대가 되는 순간 깨지는 코드들 — 무상태(Stateless) 서버
서버 1대일 땐 멀쩡하던 로그인이 2대로 늘리자 3번에 1번꼴로 풀렸다. 원인은 서버가 자기 메모리에 상태를 들고 있던 것. 무상태 서버와 수평 확장을, 퍼블리셔의 인라인 스타일 비유로 정리한다.
2026 · 09
전부 성공 아니면 전부 취소 — 트랜잭션과 ACID
포인트 이체에서 차감만 되고 적립이 실패하면 데이터가 깨진다. "절반만 반영된 상태"가 아예 존재할 수 없게 만드는 트랜잭션과 ACID를, FTP로 파일 절반만 올라가던 그 아찔함에 빗대 정리한다.
2026 · 09
[배우는 중] useMemo를 일단 다 붙였다가 혼났다
파생 상태를 배우고 나니 "매 렌더 계산, 느리지 않나?" 걱정에 useMemo·useCallback을 반사적으로 다 붙였다. 그게 왜 틀린 접근이었는지, 메모이제이션 3종의 역할과 "언제 쓰나"를 공부하며 이해한 과정을 남긴다.
2026 · 09
앱 세 개를 하나의 결로: 플레인 CSS로 디자인 시스템을 만들었다
날씨앱·블로그·(예정)쇼핑몰. 스택이 다 다른데도 한 덩어리로 보이게 하려고, 빌드 도구 없이 순수 CSS와 custom property로 디자인 시스템 "Nacre"를 만든 이야기. 이름은 자개(螺鈿), 결은 수묵 — 한국의 정서를 화면에 심어봤습니다.
2026 · 09
[배우는 중] useState를 너무 많이 뒀다 — 파생 상태 이야기
React를 쓰긴 쓰는데 상태 설계에서 자꾸 꼬였다. 무엇을 state로 두고 무엇을 계산할지, 막혔던 지점과 이해한 과정을 그대로 남긴다.
2026 · 09
Orca를 써봤는데, codeme로 갈아탔다
여러 AI 코딩 에이전트를 병렬로 돌리는 ADE. Orca로 시작했지만 결국 codeme에 정착한 이유를, 퍼블리셔의 시선으로 정리했습니다.
2026 · 09
useMemo, 이제 지워도 될까? — Rust로 다시 태어난 React Compiler 직접 써보기
Oxc가 Rust로 새로 짠 React Compiler를 실제로 돌려보고, 코드가 어떻게 바뀌는지 직접 확인해봤습니다.
2026 · 08
Minimalism 2026 · 07
Design 2026 · 06
Habits