FE News 26년 1월 소식을 전해드립니다!
FE News 26년 1월 소식을 전해드립니다!
React Server Components 시각화 도구와 클라이언트 사이드 AI 흐름, 디자인시스템 기반 마크업 자동화 사례를 소개했습니다. 프런트엔드 관점에서 AI와 브라우저 기술의 변화 지점을 함께 살펴볼 수 있습니다.
#React#LLM
131005분
필터 0
Building Event Center: Karrot’s User Event Management Platform
Building Event Center: Karrot’s User Event Management Platform
대규모 사용자 이벤트를 더 일관되고 안전하게 관리하기 위해 Event Center를 구축했습니다. 기존 Git 기반 스키마 관리의 복잡도와 명명 불일치를 UI 기반 플랫폼으로 해결했습니다.
#BigQuery#GCP
34005분
당근의 사용자 행동 로그 관리 플랫폼: 이벤트센터 개발기
당근의 사용자 행동 로그 관리 플랫폼: 이벤트센터 개발기
당근은 사용자 행동 로그가 커지며 코드 기반 스키마 관리의 한계를 겪었습니다. 이벤트센터를 만들어 전사 공통 규칙과 UI 기반 자동화로 로그 관리 효율을 높였습니다.
#BigQuery#GCP
97005분
쏘카프레임 - 블루투스 모듈
쏘카가 앱으로 차량과 이동수단을 제어하기 위해 공통 블루투스 추상화 계층인 쏘카프레임을 설계한 사례를 소개했습니다. iOS와 Android의 차이를 흡수해 확장성, 테스트 용이성, 재사용성을 높였습니다.
#Android#iOS
31005분
디자인 시스템 다시 생각해보기
디자인 시스템을 통제보다 제품의 관점에서 다시 바라본 글입니다. Flat과 Compound API를 함께 제공하는 하이브리드 전략으로 확장성과 사용성을 균형 있게 다루었습니다.
#design system#API
191005분
사용자가 페이지 로딩을 눈치채지 못하게 만들기 — RSC 도입 이야기
사용자가 페이지 로딩을 눈치채지 못하게 만들기 — RSC 도입 이야기
Next.js App Router에서 RSC와 TanStack Query prefetch를 결합해 이벤트 상세 페이지의 초기 로딩과 레이아웃 시프트를 개선했습니다. LCP는 약 38% 줄었고, 선택적 적용과 서버 부하 모니터링 전략도 함께 정리했습니다.
#Next.js#RSC
30005분
웹과 다른 세계: 이메일 템플릿 작업에서 겪은 시행착오
웹과 다른 세계: 이메일 템플릿 작업에서 겪은 시행착오
이메일 템플릿에서 웹식 반응형이 제대로 동작하지 않는 시행착오를 정리했습니다. table 레이아웃과 인라인 스타일로 클라이언트별 차이를 줄이는 방법을 소개했습니다.
#CSS#HTML
88005분
올리브영 타입스크립트로 알아보는 제네릭과 매개변수 다형성
제네릭과 매개변수 다형성으로 서로 다른 타입에 같은 로직을 재사용하는 방법을 설명했습니다. 타입 추론, 제네릭 제약, 변성까지 함께 살펴보며 실무 활용 예시를 정리했습니다.
#TypeScript#제네릭
198005분
텍스트 접근성을 개선했더니 거래액이 올랐습니다.
기기 글자 크기 설정을 반영해 텍스트 접근성을 개선한 사례를 소개했습니다. SSR, SSG, CSR 모두에서 FOUT를 줄이고 거래액과 탐색성 개선까지 확인했습니다.
#React Native#Next.js
46005분
1년 동안의 iOS 모듈화 진행기 - 2. Component 모듈
iOS 공통 UI 컴포넌트를 ZComponent 모듈로 분리한 과정을 공유했습니다. 데모앱과 스냅샷 테스트로 가시성과 QA 범위를 개선했습니다.
#iOS#module
21005분
올리브영 타입스크립트로 알아보는 제네릭과 매개변수 다형성
제네릭으로 타입을 추상화해 서로 다른 도메인의 로직을 하나로 묶는 방법을 설명했습니다. 또한 변성과 유틸리티 타입을 통해 타입 안전성과 실용성의 균형을 살펴보았습니다.
#TypeScript#generics
134005분
끊김 없는 사용 경험을 위하여 : 카카오톡 선물함 속 교환권을 배달의민족 주문으로 연결한 여정
끊김 없는 사용 경험을 위하여 : 카카오톡 선물함 속 교환권을 배달의민족 주문으로 연결한 여정
카카오톡 선물 교환권을 배민 주문에 연결하는 과정과 바코드 인식 문제를 다뤘습니다. 노란 테두리 이미지로 인한 이진화 실패를 분석하고 직접 이진화로 개선했습니다.
#바코드#JavaScript
14005분