pile·
최신
  1. 프론트엔드·LINE EngineeringLINE Engineering·

    AI로 웹 엔지니어 없이 LINE 앱 안에서 그룹 영상 통화 서비스 만들기

    LINE Planet 팀의 PM과 Android 엔지니어 두 명이 웹 전문 엔지니어 없이 LINE 앱 내에서 그룹 영상 통화 서비스를 개발한 과정을 다룬다. LIFF(LINE Front-end Framework)와 LINE Planet SDK를 활용해 React/Vite 기반 웹 앱을 구성했고, Firebase Cloud Functions로 별도 서버 인프라 없이 구현을 완료했다.

    #react#webrtc#firebase+2
  2. 프론트엔드·vercel-blogVercel Blog·

    Vercel과 Shopify의 Hydrogen 전면 재설계

    Vercel과 Shopify가 Hydrogen을 오픈소스·런타임 무관 프레임워크로 전면 재설계했다. 기존 Hydrogen은 빠른 헤드리스 스토어프런트 배포를 지원했지만 플랫폼 종속성이 있었고, 새 버전은 Svelte, Nuxt, Next.js 등 어느 JavaScript 프레임워크에서도 동작한다. 3레이어 아키텍처(코어/클라이언트/서버)로 재구성하면서 각 레이어가 명확한 역할을 분담한다.

    #react#nextjs#i18n+2
  3. 프론트엔드·토스 SLASH토스 SLASH·

    es-toolkit: 사내 소형 라이브러리에서 글로벌 프로젝트로

    토스 프론트엔드 팀이 사내 공유 유틸리티 라이브러리를 발전시켜 만든 es-toolkit이 주간 npm 다운로드 2,000만 건을 넘기며 글로벌 오픈소스 프로젝트로 자리 잡은 과정을 다룬다. lodash의 구조적 한계를 넘어 현대 웹 개발 환경에 최적화된 유틸리티 라이브러리를 처음부터 설계한 경험을 정리한다.

    #lodash#open-source#tree-shaking+2
  4. 프론트엔드·토스 SLASH토스 SLASH·

    es-toolkit, 사내 작은 라이브러리가 전세계적인 라이브러리가 되기까지

    토스팀이 lodash의 한계(ESM 미지원, 레거시 코드 비대)를 해결하기 위해 개발한 JavaScript 유틸리티 라이브러리 es-toolkit이 NPM 주간 다운로드 2천만 회를 돌파하며 전 세계 주요 오픈소스 프로젝트에 채택됐다. 사내 작은 프로젝트로 시작해 Storybook, Mermaid, Yarn Berry 등이 의존성을 전환한 과정과, lodash drop-in replacement인 es-toolkit/compat 전략을 최초 개발자 서진과 외부 기여자로 시작해 토스뱅크에 합류한 다용, 두 개발자의 시각으로 다룬다.

    #es-toolkit#lodash#open-source+2
  5. 프론트엔드·당근당근 테크블로그·

    디자인시스템 팀은 디자인시스템만 잘 만들면 될까

    AI 도구(Lovable, Bolt, v0)가 프롬프트 하나로 화면 초안을 생성하는 시대, 당근 프론트엔드 엔지니어가 디자인시스템 팀의 역할을 다시 정의한다. "컴포넌트와 토큰 제공"을 넘어, 경험에 대한 판단 기준을 쌓고 구조화하는 팀이어야 한다는 주장이다. AI가 80%의 화면을 빠르게 만들어주지만, 99% 수준의 제품 경험으로 끌어올리는 건 여전히 맥락(Context)과 판단의 문제다.

    #design-system#figma#component-library+2
  6. 프론트엔드·vercel-blogVercel Blog·

    단일 Next.js 앱으로 Webflow·ElevenLabs 멀티테넌트 문서 플랫폼 운영 — Fern 사례

    Fern이 단일 Next.js 애플리케이션으로 Webflow, ElevenLabs 등 여러 고객의 API 문서를 각자의 커스텀 도메인에서 제공하는 멀티테넌트 플랫폼을 운영한다. Pages Router에서 App Router로 마이그레이션하며 TTFB 3배 개선, 페이지 로드 80% 단축을 달성했으며, 월 600만 이상의 페이지뷰를 처리한다.

    #nextjs#performance#multi-tenant+2
  7. 프론트엔드·인프랩 (인프런)인프런 (인프랩)·

    AI로 디자인시스템 마이그레이션하기 (1): 여정의 시작

    인프랩 프론트엔드 팀이 20개 이상의 앱이 의존하는 Mantine 기반 디자인시스템을 v6에서 v8로 올리면서 AI 에이전트를 어떻게 활용했는지 다룬다. 단순 버전업이 아닌 스타일 기반 자체를 교체하는 작업이라 1차 시도가 실패했고, v6/v8 공존 격리 설계와 AI 에이전트 오케스트레이션으로 전사 규모 마이그레이션을 진행했다.

    #design-system#migration#ai-agent+2
  8. 프론트엔드·channel-talk채널톡·

    느려터진 에디터 좀 고쳐줘를 AI에게 시켜봤다

    채널톡이 1년간 미뤄둔 WYSIWYG 에디터 렌더링 끊김을, Andrej Karpathy 의 Auto Research 방식(점수 오르면 keep, 안 오르면 git revert)으로 AI 에게 맡겨 최적화한 실험기를 다룬다. 핵심 교훈은 "더 똑똑한 모델"보다 체감 성능을 제대로 반영하는 평가 루프(점수표)를 설계하는 게 관건이라는 점이다.

    #react#web-vitals#performance-optimization+5
  9. 프론트엔드·vercel-blogVercel Blog·

    GitBook이 30,000개 사이트에 준실시간 콘텐츠 업데이트를 제공하는 방법

    GitBook이 30,000개 문서 사이트를 운영하며 월 1.2억 페이지뷰를 처리하는 멀티테넌트 캐싱 아키텍처를 공개했다. Next.js의 use cache 지시문과 태그 기반 선택적 무효화로 일일 40,000건의 캐시 무효화를 300ms 이하로 처리하고, 2025년 5배 급증한 AI 트래픽(전체의 41%)도 흡수하고 있다.

    #nextjs#web-performance#multi-tenant+2