Web Frontend Developer

원문: https://hidde.blog/component-conformance/접근성을 고려해 UI 컴포넌트를 만들 수 있습니다. 개발하면서 컴포넌트와 함께 접근성 관련 사항을 문서화하거나, 명백한 장애물이 없는지 검토해도 됩니다. 모두 도움이 되고 권장할 만한 일입니다. 그렇다면 적합성을 주장하는 건 어떨까요? 이 글에서는 WCAG가 기술적으로 그것을 허용하지 않는 이유와, 그 판단이 옳다고 보는 이유를 이야기합니다.이 글의 일부는 제가 진행해 온 "내장 접근성: 축복인가 저주인가?"라는 발표 시리즈에서 비롯되었습니다. 이 발표에서는 "접근 가능한 웹 플랫폼 기능"과 저작 도구도 다룹니다. JS Heroes 2025 유튜브 영상을 확인하실 수 있습니다.평소와 같이, 이 글의 의견은 제 개인적인 견해이..

원문: https://www.viget.com/articles/fixing-typescript-performance-problems대규모 타입스크립트 모노레포(monorepo)에서 심각한 성능 문제를 디버깅한 경험을 소개합니다.최근 진행한 타입스크립트 프로젝트에서 에디터 성능이 점점 저하됐습니다. 타입스크립트 컴파일러(언어 서버 포함)가 코드베이스의 특정 영역에서 버벅이기 시작하면서 인텔리센스가 느려지고 타입 검사 시간이 길어졌습니다. 타입 정보가 오래된 상태로 남아 있는 일도 잦아졌고, 팀원들의 불만도 커졌습니다.이 프로젝트는 타입스크립트 패키지 7개로 구성된 모노레포입니다. 이전 개발자들이 프로젝트 참조(project references)(composite 설정 필수)와 증분 컴파일(increment..

원문: https://www.lorenstew.art/blog/react-won-by-default/React-by-default에는 숨겨진 비용이 있습니다. 이 글은 작업에 맞는 올바른 프레임워크를 선택하기 위해 의도적인 선택을 내려야 한다는 주장입니다.리액트는 더 이상 기술적 우위로 승리하고 있지 않습니다. 지금은 기본 선택지라는 이유만으로 승리하고 있습니다. 이 기본값이 프런트엔드 생태계 전반의 혁신을 늦추고 있습니다.팀이 새로운 프런트엔드를 만들어야 할 때, 대화는 좀처럼 "제약 조건이 무엇이고, 어떤 도구가 가장 적합한가?"로 시작하지 않습니다. 대부분 "리액트를 쓰자. 다들 리액트는 알잖아."로 시작합니다. 이 반사적인 선택은 기술적 적합성이 아닌 네트워크 효과가 아키텍처를 결정하는 자기 강화..

원문: https://philna.sh/blog/2026/01/11/javascript-date-calculation/문제2025년 1월, 저는 미국 캘리포니아주 산타클라라에서 보고서를 만들기 위한 자바스크립트를 작성하고 있었습니다. 한 달 동안 발생한 이벤트 수를 구하고 싶었기 때문에, 해당 월의 첫째 날로 날짜 객체를 만들고, 한 달을 더한 뒤, 하루를 빼서 마지막 날을 구하려 했습니다. 간단해 보이죠?그런데 정말 이상한 결과가 나왔습니다. 문제를 다음 코드로 재현할 수 있었습니다.const date = new Date("2024-01-01T00:00:00.000Z");date.toISOString();// => "2024-01-01T00:00:00.000Z" as expecteddate.setMon..

원문: https://blog.logrocket.com/css-in-2026/한동안 웹사이트를 만들어 왔다면, CSS에 대해 어느 정도 확고한 의견이 있을 겁니다. 디자인과 레이아웃에는 당연한 선택이지만, 기본 애니메이션을 넘어 더 인터랙티브한 기능이 필요해지면 대부분의 개발자는 본능적으로 자바스크립트에 손을 뻗습니다. 하지만 끊임없이 발전하는 플랫폼 덕분에 웹 기능을 구현할 때 "CSS는 디자인, 자바스크립트는 인터랙션"이 더 이상 기본값일 필요가 없어졌습니다.모던 CSS는 이제 커스텀 스크립트가 필요했던 복잡한 애니메이션과 사용자 인터렉션을 처리할 만큼 강력합니다. 이 글에서는 CSS에 새로 도입되는 최신 기능들을 살펴보고, 자바스크립트로 익숙하게 구현하던 수준의 인터랙티비티를 유지하면서도 개발 워크..

원문: https://www.jonoalderson.com/conjecture/its-time-for-modern-css-to-kill-the-spa/네이티브 CSS 트랜지션은 클라이언트 사이드 라우팅의 가장 강력한 근거를 조용히 무너뜨렸습니다. 그런데도 사람들은 성능 좋은 웹사이트 대신 끔찍한 앱을 계속 만들고 있습니다.앱처럼 보여야 한다는 착각"앱처럼 느껴지게 만들어 주세요."기획 단계 어딘가에서 누군가 이 말을 꺼냅니다. CMO일 수도, 디지털 리드일 수도, 브랜드 매니저일 수도 있습니다. 그리고 이 한마디로 아키텍처가 결정됩니다. SPA로 가겠다고요. 아마 리액트겠죠. 뷰일 수도 있습니다. 거의 확실히 Vercel이나 Netlify에 배포될 것이고, 헤드리스 CMS와 GraphQL API도 곁들여..

원문: What is a Design Engineer?디자인 엔지니어는 디자인과 프런트엔드 개발 사이를 연결하며, 훌륭하게 느껴지고 완벽하게 작동하는 인터페이스를 만듭니다. 디자인 엔지니어가 무엇을 하는지, 디자이너 및 개발자와 어떻게 다른지, 그리고 Vercel, Stripe, Linear 같은 회사들이 왜 이들을 채용하는지 알아보세요.디자인 엔지니어는 소프트웨어가 단순히 '작동'하는 것을 넘어, 실제로 좋게 느껴지도록 만드는 사람들입니다.이 역할은 최근 큰 주목을 받고 있습니다. Vercel, Stripe, Linear, Cursor가 모두 적극적으로 채용하고 있습니다. 디자인 엔지니어링 전용 구인 게시판이 생겨났습니다. 그리고 기술 트위터를 자주 본다면, 이에 대한 담론을 본 적이 있을 것입니다.그..

원문: Building a Toast Component저는 2023년에 토스트 라이브러리인 Sonner를 만들었습니다. 현재 주간 npm 다운로드가 800만 회를 넘어섰고, Cursor, X, Vercel 같은 회사에서 사용되고 있습니다. 또한 shadcn/ui의 기본 토스트 컴포넌트이기도 합니다.Sonner를 만들 당시, 토스트 "시장"은 이미 포화 상태였습니다. 그렇다면 무엇이 Sonner를 돋보이게 했을까요? 왜 사람들은 검증된 대안 대신 Sonner를 선택했을까요?이름부터 시작해봅시다.네이밍제 생각에 기능에 기반해서 이름을 짓는 건 너무 평범합니다. react-toast, react-snackbar, react-notifications 같은 이름은 모두 지루하고 일반적으로 느껴집니다. 더 독특하고..