GamsGo Code 자료실은 글을 읽고 바로 확인해야 하는 공식 문서, 진단 도구, 실무 점검 기준을 한곳에 모아둔 페이지입니다. 단순 링크 모음이 아니라 React, TypeScript, CSS, 성능, 접근성 작업 중 필요한 자료를 빠르게 찾을 수 있도록 주제별로 나누었습니다.
공식 문서 빠른 링크
프론트엔드 기본
React / TypeScript
성능 / 디버깅
구조화 데이터 / 접근성
React 프로젝트 점검 자료
| 항목 | 확인 방법 | 함께 볼 기준 |
|---|---|---|
| 렌더링 성능 | React DevTools Profiler로 느린 컴포넌트와 반복 렌더링을 확인합니다. | 상태 위치, memo 적용, 목록 key 안정성 |
| 상태 관리 | 서버 상태와 UI 상태를 분리해 전역 상태가 과해지지 않았는지 봅니다. | TanStack Query, Zustand, Context 분리 |
| 빌드 결과 | 번들 크기와 동적 import 적용 구간을 확인합니다. | Vite build, Lighthouse, Coverage 탭 |
프론트엔드 품질 점검 자료
| 항목 | 확인 방법 | 함께 볼 기준 |
|---|---|---|
| HTML 구조 | 페이지마다 h1, section, article, table, button, link의 의미가 맞는지 확인합니다. | 의미 있는 마크업, 스크린 리더 흐름 |
| 접근성 | 키보드 이동, 포커스 표시, 폼 라벨, 이미지 대체 텍스트를 실제 화면에서 점검합니다. | WAI 기초, Lighthouse Accessibility |
| 성능 예산 | 초기 번들, 이미지 크기, LCP 후보 요소, 긴 작업을 배포 전에 확인합니다. | Coverage 탭, Performance 패널, PageSpeed |