SPA 환경에서의 버전 업데이트를 위한 모두싸인의 최신 버전 업데이트 기능 구현기
SPA에서 구 버전 리소스가 계속 유지되는 문제를 해결하기 위해 최신 버전 업데이트 기능을 구현했습니다. version.json 폴링과 버전 비교로 강제·선택 업데이트를 분기하고 전환율까지 측정했습니다.
#React#Vite
65005분
필터 1
코파일럿 “열일”하게 만드는 방법
깃허브 코파일럿의 기본 기능과 VSCode에서의 활용법을 정리했습니다. 컨텍스트를 충분히 주고 슬래시 명령어와 챗 변수를 쓰면 더 유용하게 사용할 수 있습니다.
#GitHub Copilot#VSCode
45005분
FE News 25년 2월 소식을 전해드립니다!
FE News 25년 2월 소식을 전해드립니다!
25년 2월 프런트엔드 기술 소식을 큐레이션해 소개했습니다. CSS 지문 채취, AI 개발 워크플로우, 토스 가이드, 포털 대체 방법을 다뤘습니다.
#CSS#JavaScript
44005분
Vite를 이용한 FrontEnd프로젝트
Vite는 React뿐 아니라 여러 프레임워크를 지원하며 빠른 프로젝트 생성과 실행을 강점으로 소개했습니다. CRA보다 가볍고 구조가 익숙해 프런트엔드 개발에 효율적으로 활용할 수 있다고 설명했습니다.
#Vite#React
77005분
3단계로 완성하는 유연한 디자인 시스템
디자이너와 개발자의 리소스 관리를 일원화하기 위해 3단계 토큰 기반 디자인 시스템을 구축했습니다. Figma와 코드, Storybook을 연결해 테마 전환과 컴포넌트 커스터마이징을 유연하게 운영했습니다.
#design system#Figma
34005분
퍼블리셔와 개발자 협업을 위한 스토리북 깨짐 방지 방안
퍼블리셔와 개발자 협업에서 스토리북이 깨지는 원인을 분석하고 CIC 패턴으로 역할을 분리했습니다. 스토리북용 props와 실행 환경 분기를 정리해 무결성을 유지했습니다.
#React#Storybook
31005분
시각장애인을 위해 모달 컴포넌트 접근성 개선하기
시각장애인의 웹 탐색 방식에 맞춰 모달 접근성을 개선하는 방법을 소개했습니다. aria 속성, ESC 닫기, 포커스 트랩으로 키보드 탐색 경험을 보완했습니다.
#React#UI/UX
44005분
웹 접근성을 지켜라
웹 접근성의 기본 개념과 접근성 트리, ARIA 활용법을 정리했습니다. 또한 Radix UI Dialog 예시로 포커스 관리와 상태 전달 방식을 살펴보았습니다.
#웹 접근성#ARIA
31005분
‘Teleport 공식 기술 문서 한글판 by 인포그랩’ 개발 후기
GPT로 Teleport 기술 문서를 한글화하며 MDX 문법과 빌드 문제를 해결한 개발 후기였습니다. CI/CD와 서브모듈로 문서 배포와 버전 관리를 자동화한 과정도 소개했습니다.
#GPT#MDX
5005분
‘Teleport 공식 기술 문서 한글판 by 인포그랩’ 개발 후기
Teleport 공식 기술 문서를 GPT로 번역하고 MDX 문법 문제를 해결해 배포한 후기입니다. 번역 자동화와 CI/CD 적용 과정에서 겪은 빌드 이슈와 대응 방법을 공유했습니다.
#GPT#MDX
7005분
프론트엔드 서비스 최적화? 토스에서는 '이렇게' 합니다! 모닥불 | EP.9
프론트엔드 서비스 최적화의 본질과 실무 노하우를 토스 개발자 관점에서 다뤘습니다. 초기 로딩과 런타임 성능, React 리렌더링 최적화 사례를 소개했습니다.
#성능#React
30005분
프론트엔드 서비스 최적화? 토스에서는 '이렇게' 합니다! 모닥불 | EP.8
토스 개발자들이 프론트엔드 성능 최적화의 본질과 실무 노하우를 공유했습니다. 초기 로딩과 런타임, React 리렌더링 최적화 사례를 다뤘습니다.
#성능#최적화
29005분