simonw/browser-compat-db — MDN 브라우저 호환성 데이터를 SQLite로 변환해 공개하기

이 요약은 AI가 원문을 분석해 생성했습니다. 정확한 내용은 원문 기준으로 확인하세요.

TL;DR

이 글은 MDN의 browser-compat-data 저장소를 단일 SQLite 파일로 변환해 공개적으로 호스팅한 작업을 소개한다. 소스 JSON을 sqlite-utils 기반의 스크립트로 테이블화해 약 66MB 크기의 browser-compat.db를 생성했고, 그 결과물을 GitHub 저장소의 일반 파일로 두어 CDN이 open CORS 헤더로 서빙하도록 구성했다.

코드 생성과 CI 워크플로 구성에는 AI 보조 도구가 활용되었는데, Claude Code가 웹용 변환 스크립트를 생성했고 별도 워크플로가 빌드 결과를 orphan 브랜치에 강제 푸시하도록 설정되어 자동 배포가 가능해졌다. 생성된 DB는 제공된 raw URL을 Datasette Lite에 연결해 브라우저에서 즉시 테이블 조회와 필터링을 수행할 수 있다.

따라서 별도 서버 인프라 없이도 정적 데이터 리포지터리를 쿼리 가능한 SQLite로 변환해 공개 탐색 환경을 제공할 수 있으며, AI 기반 코드 스캐폴딩은 초기 개발·CI 구성 시간을 단축하는 데 유용하다. 다만 본문은 프로젝트·배포 절차 중심으로 AI 기술 자체의 상세 원리나 성능 비교 같은 기술적 분석은 포함하지 않는다.

섹션별 상세

MDN의 방대한 browser-compat-data 저장소를 정적 쿼리용으로 변환하려는 필요가 있어 SQLite 단일 파일을 목표로 삼았다. 원본 JSON 리포지터리를 입력으로 sqlite-utils 기반의 build_db.py 스크립트를 실행해 테이블로 변환하고 인덱스를 생성해 약 66MB 크기의 browser-compat.db 파일을 출력했다. 결과물의 크기와 파일 형태는 배포·탐색 편의성을 고려한 결정이며, 파일 링크로 누구나 다운로드해 로컬이나 원격에서 바로 조회할 수 있다. 정적 파일로 제공하면 서버 없이도 빠르게 브라우저 기반 데이터 탐색이 가능해진다.

코드 생성과 CI 구성 작업에는 AI 보조 도구가 사용되었고, Claude Code가 웹용 변환 스크립트를 생성하는 데 활용되었다. 이 스크립트가 sqlite-utils를 호출해 JSON에서 스키마와 테이블을 만들고 데이터를 적재하는 일련의 처리 과정을 자동화하며, 생성된 GitHub Actions 워크플로우는 저장소에서 빌드를 수행해 결과 DB를 강제 푸시하는 방식으로 배포를 완성한다. 해당 워크플로와 스크립트 링크가 공개되어 있어 재현과 수정이 가능하다. AI로 스캐폴딩한 스크립트와 워크플로를 이용하면 반복적·보일러플레이트 작업을 빠르게 마련할 수 있다.

공개 호스팅 관점에서 GitHub의 일반 레포지토리에 파일을 두면 GitHub CDN이 open CORS 헤더로 서비스해 브라우저에서 직접 접근이 가능하다. GitHub Releases는 open CORS를 제공하지 않으므로 빌드 산출물을 db라는 orphan 브랜치로 강제 푸시해 raw 파일 URL을 통해 접근하도록 구성했고, 그 URL을 Datasette Lite에 전달해 웹 기반 인터페이스로 즉시 탐색할 수 있게 했다. 이 방식은 별도 서버 없이도 외부 도구에서 DB를 불러와 쿼리·검색하는 흐름을 단순화한다.

실무 Takeaway

정적 JSON 리포지터리를 조회·탐색하기 위해 sqlite-utils로 단일 SQLite 파일을 생성하면 로컬·원격에서 간편한 쿼리 환경을 제공해 데이터 접근성을 개선할 수 있다.
반복적 스크립트와 CI 설정을 빠르게 마련하려면 AI 보조 도구로 초기 코드를 생성하고 공개된 워크플로 예제를 기반으로 조정하면 개발 시간을 줄일 수 있다.
GitHub 저장소의 일반 파일은 CDN에서 open CORS로 제공되므로, 빌드 산출물을 orphan 브랜치에 배치해 raw URL로 노출하면 별도 배포 인프라 없이도 브라우저 기반 탐색 도구와 연동할 수 있다.

언급된 리소스

GitHubsimonw/browser-compat-db (GitHub)

GitHubbuild_db.py (generated script)

GitHubsqlite-utils

GitHubGitHub Actions workflow (build-db.yml)

GitHub다운로드: browser-compat.db

DemoDatasette Lite로 탐색 (데모)

문서MDN MCP 서비스 소개 (MDN 블로그)

GitHubmdn/browser-compat-data (원본 리포지터리)

이 요약은 AI가 원문을 분석해 생성했습니다. 정확한 내용은 원문 기준으로 확인하세요.

TL;DR

섹션별 상세

실무 Takeaway

정적 JSON 리포지터리를 조회·탐색하기 위해 sqlite-utils로 단일 SQLite 파일을 생성하면 로컬·원격에서 간편한 쿼리 환경을 제공해 데이터 접근성을 개선할 수 있다.
반복적 스크립트와 CI 설정을 빠르게 마련하려면 AI 보조 도구로 초기 코드를 생성하고 공개된 워크플로 예제를 기반으로 조정하면 개발 시간을 줄일 수 있다.
GitHub 저장소의 일반 파일은 CDN에서 open CORS로 제공되므로, 빌드 산출물을 orphan 브랜치에 배치해 raw URL로 노출하면 별도 배포 인프라 없이도 브라우저 기반 탐색 도구와 연동할 수 있다.