material-web

Material Web은 material-components 조직에서 관리하는 웹 컴포넌트 라이브러리입니다. 이 라이브러리의 목적은 아름답고 접근성 높은 웹 애플리케이션 구축을 돕는 것이며, Google의 최신 오픈 소스 디자인 시스템인 Material 3를 구현합니다. 제공 기능 - md-checkbox, md-radio, md-outlined-text-field, md-outlined-button, md-icon-button와 같이 일반 HTML에서 사용할 수 있는 커스텀 엘리먼트(md- 접두사 사용) 모음입니다. - 전체 컴포넌트 세트를 가져오는 공유 "all.js" 진입점과 더불어, 선택적 로딩을 위한 개별 컴포넌트 모듈을 제공합니다. - typescale 스타일 모듈(md-typescale-styles.js)을 통한 타이포그래피 지원을 제공하며, 이는 document.adoptedStyleSheets에 추가할 수 있는 채택 가능한 스타일시트를 노출합니다. md-typescale-display-medium 및 md-typescale-body-medium과 같은 유틸리티 클래스는 Material typescale에 매핑됩니다. README에는 import map과 모듈 스크립트를 통해 CDN에서 라이브러리를 로드하고 Google Fonts에서 Roboto 웹폰트를 사용하는 빌드리스 퀵스타트 예제가 나와 있습니다. 문서의 별도 퀵스타트 가이드에서는 설치 및 프로덕션 빌드 방법을 다룹니다. 문서 및 리소스 - docs/intro.md - 소개 - docs/roadmap.md - 로드맵 - docs/components/ - 컴포넌트별 문서 - docs/size.md - 번들 크기 정보 - docs/support.md - 브라우저 지원 및 FAQ - docs/quick-start.md - 설치 및 프로덕션 빌드 안내 프로젝트 상태 - README에는 MWC(Material Web Components)가 새로운 유지 관리자를 기다리며 유지 관리 모드 상태임이 명시되어 있으며, GitHub 토론 링크가 제공됩니다. 장기 프로젝트를 위해 이를 검토하는 사용자는 이 점을 고려해야 합니다. - Angular 사용자의 경우, README에서는 Angular Material 컴포넌트 사용을 권장합니다. 배포 및 라이선스 컨텍스트 - npm에 @material/web로 게시되어 배지 형태로 버전 및 다운로드 통계가 표시되며, esm.run 및 jsDelivr와 같은 CDN 서비스를 통해서도 접근 가능합니다. - 지속적 통합(CI) 테스트 상태는 GitHub Actions 워크플로 배지를 통해 공개되며, 저장소는 커뮤니티 지원을 위해 Lit Discord 채팅으로 연결됩니다. 전형적인 사용 사례 이들은 표준 웹 컴포넌트이므로 프레임워크에 구애받지 않으며, 정적 사이트, 서버 렌더링 페이지, JavaScript 프레임워크를 포함하여 커스텀 엘리먼트를 지원하는 모든 페이지나 애플리케이션에 바로 적용할 수 있습니다. 스타일링과 테마는 Material 3 컨벤션을 따르며, 폼 관련 컨트롤은 네이티브 HTML 폼에 참여합니다.