WORKBOOK 06

개발 점검 링크모음,
다음 단계가 보이도록.

검색 결과의 코드 조각을 바로 붙이기보다 사양, 지원 범위, 재현 조건을 먼저 적습니다. “내 환경에서는 된다”와 “지원 대상에서 안전하다”를 분리해 검증합니다.

BEFORE YOU OPEN A LINK

먼저 준비할 것

  • 대상 브라우저·기기·접근성 수준을 프로젝트 문서에 적습니다.
  • 운영 데이터나 비밀키를 공개 검사 도구에 붙여 넣지 않습니다.
  • 자동 검사 통과와 실제 사용자 경험 검토를 별개로 진행합니다.
01

MDN Web Docs

HTML·CSS·JavaScript API의 사용법과 관련 사양을 확인합니다.

기능의 문법, 예제, 접근성 주의점과 브라우저 정보를 함께 탐색할 수 있습니다.

다음으로 가져갈 것

사용하려는 기능명을 Can I use에서 지원 범위와 대조합니다.

이용 조건 문서 열람은 로그인 불필요

02

Can I use

웹 기능의 브라우저·버전별 지원 상태를 확인합니다.

프로젝트 지원 범위에 맞는 대체 구현이 필요한지 판단합니다.

다음으로 가져갈 것

결정한 지원 전략과 폴백을 저장소 이슈나 문서에 기록합니다.

이용 조건 로그인 불필요

03

GitHub

코드, 이슈, 변경 검토와 릴리스 기록을 관리합니다.

결정 근거와 실제 변경을 같은 흐름에서 추적하기 좋습니다.

다음으로 가져갈 것

검토 가능한 배포 후보를 만든 뒤 성능과 문법을 별도로 검사합니다.

이용 조건 저장소 작업은 계정 필요

04

web.dev

성능·접근성·웹 플랫폼 권장사항과 측정 방법을 학습합니다.

점수만 보지 않고 지표가 사용자 경험에 미치는 의미를 확인합니다.

다음으로 가져갈 것

수정 후 HTML 문법 문제를 W3C 검사기로 분리 확인합니다.

이용 조건 콘텐츠 열람은 로그인 불필요

05

W3C Markup Validation Service

HTML 문법과 구조 오류를 검사합니다.

브라우저가 보정해 숨긴 마크업 문제를 배포 전에 발견하는 보조 수단입니다.

다음으로 가져갈 것

오류를 수정한 뒤 키보드·스크린리더·실기기 테스트 결과와 함께 기록합니다.

이용 조건 로그인 불필요 · 민감한 비공개 코드 입력 주의

WHY THIS ORDER

이 순서로 묶은 이유

개발 도구를 인기순으로 배열하지 않았습니다. 문서 확인, 호환성 판단, 버전 관리, 성능 학습, 문법 검사라는 서로 다른 책임을 순서대로 배치했습니다.

원문 사양

예제 블로그보다 표준 문서와 브라우저 지원표를 먼저 확인합니다.

재현 가능성

문제 상황, 기대 결과, 최소 코드와 환경을 저장소 이슈에 남깁니다.

검사 조합

문법·성능·접근성은 서로 다른 문제이므로 하나의 점수로 합치지 않습니다.

작업 구성 예시입니다. 각 사이트의 이용 조건은 원문에서 확인하세요. 기존 서비스 설명은 2026-09-04 편집 자료를 바탕으로 하며, 이후 확인한 주소 변경은 편집 기록에 따로 표시합니다.