FE 최적화, 비즈니스로 시작해서 엔지니어링으로 끝내기
비즈니스 가치가 큰 지면부터 p75 LCP를 기준으로 성능 최적화를 진행했습니다. 이미지 경량화, 번들 분리, Preload, Skeleton 적용으로 체감 속도와 지표를 함께 개선했습니다.
#성능#LCP
235005분
필터 0
피그마 플러그인 만들어줘
피그마 플러그인 ‘커틀러리’를 직접 만들어 더미 데이터 주입과 레이어 매핑 작업을 자동화한 경험을 공유했습니다. CORS, 이미지 요청 한도, 협업 문서화 과정에서의 시행착오와 해결 과정을 정리했습니다.
#Figma#GCP
85005분
Kollus 안드로이드 라이브 인코더 소개
Kollus 안드로이드 라이브 인코더의 구조와 RTMP 송출 흐름을 소개했습니다. MediaCodec과 OpenGL을 활용한 인코딩, 필터, 운영 기능도 함께 정리했습니다.
#Android#RTMP
49005분
FE News 25년 9월 소식을 전해드립니다!
FE News 25년 9월 소식을 전해드립니다!
FE News 25년 9월호에서 프론트엔드와 AI 코딩 도구 관련 주요 소식을 정리했습니다. 코드 품질, 보안, 상호 운용성, 인지 부하 같은 이슈를 함께 다뤘습니다.
#Claude#CSS
110005분
올리브영, 블록 기반 CMS로 콘텐츠 제작 시간을 99% 줄이다
올리브영은 블록 기반 CMS로 콘텐츠 제작 시간을 7일에서 20분으로 줄였습니다. Vue 프로토타입 이후 Lit 웹 컴포넌트로 전환해 재사용성과 확장성도 높였습니다.
#Vue#Lit
149005분
Playwright로 하는 Component Test와 E2E Test Coverage
Playwright로 컴포넌트 테스트와 E2E 테스트를 병행해 고객센터 채팅의 핵심 사용자 여정을 검증했습니다. 80% 커버리지를 달성하며 크로스 브라우징과 모바일 환경 안정성을 확보했습니다.
#Playwright#E2E
132005분
프론트엔드 개발자를 위한 FEConf 2025 간단 후기
FEConf 2025에서 스벨트, 웹 접근성, 최신 CSS, Figma MCP와 Cursor 사례를 중심으로 프론트엔드 실무 인사이트를 정리했습니다. 실무에 바로 적용할 수 있는 기술과 자동화 흐름이 특히 인상적이었습니다.
#FEConf#Svelte
225005분
Compose에서 Stable을 가볍게 보면 안 되는 이유: 베드 케이스로 본 안정성의 법칙 Part 1
Compose Stability가 재구성과 성능에 미치는 영향을 여러 객체 유형으로 비교해 설명했습니다. @Stable과 @Immutable은 단순 최적화가 아니라 계약이므로 신중히 사용해야 합니다.
#Android#Jetpack Compose
55005분
데이터 자동 생성으로 생산성 향상 : Playwright로 3분 걸리던 계약 생성을 30초로!
Playwright로 계약 데이터 수동 생성 과정을 자동화해 2~3분 걸리던 작업을 30초로 줄였습니다. 반복 입력을 줄여 QA가 검증에 더 집중할 수 있도록 개선했습니다.
#Playwright#자동화
97005분
에이닷 웹서비스팀의 E2E 테스트 도입기
에이닷 웹서비스팀이 QA 자동화를 위해 E2E 테스트를 도입하고 Playwright와 Cursor로 효율을 높인 과정을 공유했습니다. 크로스 브라우저 지원, 셀렉터 전략, 코드 자동 생성과 디버깅 활용법도 함께 정리했습니다.
#Playwright#Cursor
97005분
팀 개발 속도 높이기: 피그마 컴포넌트 코드 자동 변환 플러그인 제작기
Figma Dev Mode의 Codegen Plugin API로 디자인 요소를 팀 규칙에 맞는 코드로 자동 변환하는 플러그인을 제작했습니다. 이를 통해 UI 작성 시간을 크게 줄이고 실수도 감소시켰습니다.
#Figma#API
141005분
카테노이드 VOD 콘솔 V2 로 이전하기
VOD 콘솔 V1과 V2 병행 운영 문제를 해결하기 위해 V2 단일 운영으로 이전하고 여러 기능을 개선했습니다. 낙관적 업데이트, 상태 동기화, CI/CD, 분석 도입으로 사용자 경험과 운영 효율을 높였습니다.
#Vue.js#CI/CD
31005분