팀 개발 속도 높이기: 피그마 컴포넌트 코드 자동 변환 플러그인 제작기
Figma Dev Mode의 Codegen Plugin API로 디자인 요소를 팀 규칙에 맞는 코드로 자동 변환하는 플러그인을 제작했습니다. 이를 통해 UI 작성 시간을 크게 줄이고 실수도 감소시켰습니다.
#Figma#API
15800
프론트엔드 기술 블로그 최신 글
필터 0
카테노이드 VOD 콘솔 V2 로 이전하기
VOD 콘솔 V1과 V2 병행 운영 문제를 해결하기 위해 V2 단일 운영으로 이전하고 여러 기능을 개선했습니다. 낙관적 업데이트, 상태 동기화, CI/CD, 분석 도입으로 사용자 경험과 운영 효율을 높였습니다.
#Vue.js#CI/CD
3400
모두싸인 QA의 일 하는 방식 — E2E 테스트 자동화
모두싸인 QA가 Playwright와 POM, BDD를 활용해 E2E 테스트 자동화를 운영하는 방식을 소개했습니다. 핵심 시나리오 중심으로 범위를 정하고 CI/CD와 연계해 품질과 속도의 균형을 맞췄습니다.
#Playwright#TypeScript
7400
낡은 캔버스에서 새 캔버스로: Jetpack Compose와 함께한 마이그레이션 여정
Jetpack Compose 마이그레이션을 단계적으로 진행한 경험과 준비 과정을 공유했습니다. 하이브리드 전환, 스터디, 코딩 가이드로 안정성과 팀 표준을 확보했습니다.
#Jetpack Compose#Android
3900
Visual Studio Code를 Cursor처럼? Amazon Q로 AI 코딩 환경 업그레이드하기
Visual Studio Code에서 Amazon Q와 MCP, Rule을 활용해 Cursor 같은 AI 코딩 환경을 구성하는 방법을 소개했습니다. 자동 승인과 메모리 뱅크로 사용성과 정확도를 함께 높이는 흐름을 설명했습니다.
#Visual Studio Code#Cursor
27200
“왜 아무도 에러 메시지를 읽지 않을까?” | 언더커버 사일로 비하인드 3화: 페이스페이 사일로
페이스페이 사일로가 얼굴 인증의 어색함을 줄이기 위해 반복 노출과 즐거운 체험형 이벤트, 공공 디바이스에 맞는 UX를 고민한 과정을 다뤘습니다. 에러 메시지보다 사용자의 시선 위치를 고려한 안내 방식과 결제·입장 경험 단순화 방향도 소개했습니다.
#UI/UX#인증
18800
ChatGPT 질문 내역 바로보기 (익스텐션 개발기)
ChatGPT 질문 내역 바로보기 (익스텐션 개발기)
ChatGPT 대화가 길어질수록 이전 질문을 찾기 어려운 문제를 크롬 익스텐션으로 개선했습니다. 질문 모음 UI와 바로가기 기능으로 히스토리 탐색을 쉽게 만들었습니다.
#ChatGPT#Chrome Extension
11200
눈 대신 귀로 느낄 수 있는 챗봇 흐름 만들기 | 접근성 업무일지 #3
스크린리더 사용자도 챗봇 흐름을 자연스럽게 따라가도록 초점 이동과 안내를 개선했습니다. 부드러운 스크롤, 음성 안내, 효과음으로 접근성을 높인 사례입니다.
#접근성#스크린리더
14000
토스의 접근성 문서 A11y Fundamentals 을 소개합니다 (오픈 기념 이벤트 ~9/10)
토스가 실무에서 바로 적용할 수 있는 접근성 문서 A11y Fundamentals를 소개했습니다. 스크린리더 체험 이벤트와 함께 핵심 원칙과 실수하기 쉬운 패턴도 안내했습니다.
#접근성#스크린리더
16800
게임 회사에서 클라이언트 프로그래머가 하는 일
게임 클라이언트 프로그래머의 업무를 업데이트 제작 흐름에 맞춰 소개했습니다.툴 개발, 리소스 관리, QA 대응과 함께 신입에게 필요한 역량도 정리했습니다.
#Unity#모바일
16700
3년 차 앱 개발자가 일하는 순서를 공유합니다
앱 개발 작업을 작은 단위로 나누고 리뷰어를 배려하는 순서를 정리했습니다. 기획 리뷰부터 PR 작성, 시간 기록까지 실무에 바로 적용할 수 있는 팁을 공유했습니다.
#Jira#GitHub
58200
FE News 25년 8월
FE News 25년 8월
프런트엔드와 AI 중심의 2025년 8월 기술 소식을 모아 소개했습니다. 컨퍼런스, 튜토리얼, 도구, 읽을거리를 한눈에 볼 수 있습니다.
#JavaScript#prompt
14900
Next.js 개발 중 마주한 Hydration Error와 원인
Next.js SSR 환경에서 Hydration Error가 발생한 원인과 점검 방법을 정리했습니다. dayjs locale 불일치로 서버와 클라이언트 렌더 결과가 달라진 사례를 설명했습니다.
#Next.js#React
14300
버즈빌 프론트엔드 변천사
버즈빌은 AngularJS에서 Vue·React·Next.js로 전환하며 통합 어드민과 웹뷰 기반 배포 유연성을 확보했습니다. BFF, 모노레포, Server-Driven UI, Hybrid SDK로 개발·운영 복잡도를 개선했습니다.
#AngularJS#Vue.js
000