Web Frontend Developer

원문: 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 같은 이름은 모두 지루하고 일반적으로 느껴집니다. 더 독특하고..

최근에 인프런에서 프론트엔드 테스트에 대한 강의를 들으면서 생각한 내용을 주절주절 적어보려고 한다.프론트엔드에서 테스트가 필요한지? 에 대해서는 과거에는 논쟁이 있었던 것으로 기억한다. 누군가는 필요하다, 누군가는 필요하지 않다.내가 이전에 다니던 회사는 프론트엔드 테스트 코드가 없었고, 지금 회사는 있다. 하지만 테스트 코드가 있다고 크게 더 나은 점이 있는지는 잘 모르겠다. 가끔씩 프론트엔드 측에서 코드만 수정했을 때 테스트를 수정해 주지 않아서 테스트 CI가 깨지는 일이 몇 번 있었는데 오히려 번거롭다는 생각이 들 때도 있었던 것 같다.그런데 이번에 강의를 들으면서 프론트엔드에서도 테스트 코드가 필요하다 는 생각이 강하게 들었다. 어떠한 이유들로 테스트 코드의 필요성에 대해 느끼게 되었는지 이번 글..

원문 : https://blog.val.town/gardening-dependenciesVal Town은 엄청나게 많은 의존성을 가진 리액트 애플리케이션입니다. 복잡하고 항상 의존성 업그레이드를 처리해야 합니다. 이 웹을 과도하게 복잡하게 만드는 중대한 죄를 저지르고 있습니다. 이 글을 쓰는 시점에서 node_modules 디렉토리가 863MB입니다. 휴!그런데 정말 그럴까요? 우리가 기술 부채를 이곳저곳에서 쌓아가며 마음대로 의존성을 설치하고 있는 걸까요? 저는 그렇지 않다고 말하고 싶습니다.사실 우리가 만들려는 것에는 본질적인 복잡성이 있습니다. 직접 타입스크립트 트랜스파일러를 만들거나 CodeMirror 설치를 피하고 코드 편집에 textarea를 사용하지는 않을 것입니다. 저는 매주 조금씩 시간을..

원문: https://www.jonoalderson.com/performance/http-caching/캐싱은 웹의 보이지 않는 중추입니다. 캐싱 덕분에 사이트는 빠르고 안정적이며 저렴하게 운영될 수 있습니다. 제대로 구현된 캐싱은 지연 시간을 대폭 줄이고, 서버 부하를 감소시키며, 취약한 인프라도 갑작스러운 트래픽 급증을 견딜 수 있게 합니다. 반면, 잘못 구현되거나 완전히 무시될 경우 웹사이트는 느리고 불안정하며, 유지보수 비용이 많이 들게 됩니다.근본적으로 캐싱은 불필요한 작업을 줄이는 것입니다. 브라우저, CDN 또는 프락시가 변경되지 않은 리소스를 서버에 요청해야 할 때마다 시간과 대역폭이 낭비됩니다. 서버가 동일한 콘텐츠를 다시 빌드하거나 재전송해야 할 때마다 부하와 비용이 추가됩니다. 블랙 ..

2025년 상반기에 피그마에서는 오픈 베타 버전을 발표하면서 새로운 기능을 추가했다. 바로 Figma MCP Server 기능이었다. 기능이 나온 이후 많은 개발자들이 이 기능을 써 보았고 이에 대한 후기가 나타나기 시작했다. 아직 베타 기능이라 부족한 부분도 있기는 하지만, 올해 가장 큰 흐름 중 하나인 MCP의 등장에 피그마도 뒤처지지 않기 위해서 해당 기능을 출시한 것으로 보인다. 이 글을 쓰는 시점인 2025년 10월에도 오픈 베타 버전이라 해당 기능이 정식 기능으로 출시될지 여부는 모르지만, 디자이너와 개발자가 일하는 방식에도 큰 영향을 끼칠 중요한 기능이기에 이번 글을 작성하게 되었다.1. 피그마 MCP에 대한 소개피그마 MCP가 무엇인지 먼저 살펴보자. 피그마 공식 홈페이지에는 피그마 MCP..

원문: https://webassembly.org/news/2025-09-17-wasm-3.03년 전, Wasm 표준 2.0 버전이 (사실상) 완성되었고, 벡터 명령어, 대용량 메모리 연산, 다중 반환 값, 그리고 간단한 참조 타입과 같은 여러 새로운 기능들이 도입되었습니다.그동안 Wasm W3C 커뮤니티 그룹과 워킹 그룹은 꾸준히 발전을 이어왔습니다. 오늘, 우리는 Wasm 3.0을 새로운 "라이브" 표준으로 출시하게 되었음을 기쁘게 발표합니다.이번 업데이트는 상당히 규모가 큽니다. 몇몇 주요 기능들은 6년 또는 8년 동안 개발되어 왔으며, 드디어 완성되어 출시될 수 있게 되었습니다.64비트 주소 공간: 이제 메모리와 테이블을 선언할 때 주소 타입으로 기존의 i32뿐만 아니라 i64를 사용할 수 있습니..

서론자바스크립트는 2025년 현재 웹, 모바일 앱, 서버 등 다양한 분야에서 활발하게 쓰이고 있는 언어 중 하나이다. 전 세계적으로 많이 쓰이는 만큼 개발을 할 때 필요한 도구들도 매해 새롭게 생겨나고 있으며, 유행이 빠르게 바뀌는 편에 속하기도 한다. 이번 글에서는 Rising Stars 라는 자바스크립트 트렌드와 생태계 설문조사 리포트를 바탕으로 2024년의 자바스크립트 트렌드를 살펴보려고 한다. 이를 바탕으로 2025년에 자바스크립트를 사용하는 개발자라면 어떠한 트렌드에 주목해야 하는지 인사이트도 도출해 보려고 한다. 2024 Rising Stars 자바스크립트 트렌드Rising Stars 리포트는 깃허브에 추가된 스타 숫자로 트렌드를 분석했다. 자바스크립트 언어가 일반적으로 웹 플랫폼 안에서 주로..