본문으로 건너뛰기

루프공방LoopLab

배우기 카탈로그 도구·모델 AI 질의 자료실 소식 챌린지 공유 방명록

페이지를 불러오는 중입니다.

루프공방

바이브코딩을 해 봤지만 아직 서툰 사람을 위해, 하네스·Skills·MCP·Hooks·실제 도구를 익히고 시행착오를 줄이는 학습 허브

검색 완전 초보 배우기 도구·모델 카탈로그 소식 자료실 챌린지 프로젝트 방명록 로그인

배우기
카탈로그
AI 질의
자료실
챌린지
공유

hook중급a11yUI

접근성 린트 훅

jsx-a11y 등

커뮤니티 · 공공·제품 UI 품질 훅

공식 문서 GitHub

무엇을 하나요

에이전트가 만든 UI의 alt, label, 키보드 이슈를 빠르게 지적.

어떻게 동작하나요

UI 변경 후 axe 등 a11y 검사를 돌려 명백한 접근성 회귀 차단.

이런 분께

공공·서비스 UI.

시작 방법

eslint-plugin-jsx-a11y를 lint 훅에 연결.

실전 팁

핵심 페이지만
색 대비·키보드 포커스 우선
장식 아이콘 aria-hidden

이럴 땐 쓰지 마세요

CLI 전용 도구.

주의 (보안·운영)

자동 수정이 의미를 깨지 않게.

막히기 쉬운 지점

아이콘 버튼 이름 없음.

같이 보면 좋은 항목

frontend-design / UI 미학 스킬 — AI 특유 ‘보라 그라데이션 UI’ 탈출
shadcn/ui — 복사해 쓰는 컴포넌트 시스템