DevTools 아키텍처 업데이트: 웹 구성요소로 마이그레이션

이 게시물은 DevTools 아키텍처에 적용되는 변경사항과 빌드 방법을 설명하는 블로그 게시물 시리즈의 일부입니다.

DevTools가 처음 만들어진 수년 전, 팀은 맞춤 UI 프레임워크를 빌드하기로 결정했습니다. 당시에는 합리적인 선택이었으며 DevTools에 잘 작동했습니다.

하지만 그 이후로 다양한 기능이 플랫폼에 도입되었으며 그중 하나인 웹 구성요소는 DevTools에서 새 UI 요소를 빌드하는 데 적합합니다. 플랫폼에서 제공하는 기능을 활용하면 맞춤 인프라를 지원하는 대신 유지해야 하는 맞춤 UI 코드의 양을 크게 줄이고 DevTools용 기능을 빌드하는 데 더 많은 투자를 할 수 있습니다.

전환을 돕기 위해 DevTools에서 UI 요소를 빌드하는 방법에 관한 가이드를 만들어 DevTools팀 전체와 공유했습니다. 가이드의 일부는 자체 제약 조건을 적용하는 DevTools 및 아키텍처에 맞게 맞춤설정되었지만 일부는 웹 구성요소를 빌드, 구성, 테스트하는 데 사용한 접근 방식에 관한 일반적인 가이드라인입니다.

이제 goo.gle/building-ui-devtools에서 이 문서를 공개적으로 사용할 수 있습니다. 대규모 실제 애플리케이션에서 웹 구성요소가 사용되는 방식이나 구성요소를 기존의 대규모 코드베이스에 통합할 때 발생하는 몇 가지 문제에 대해 자세히 알아보고자 하는 경우 이 문서가 도움이 될 수 있습니다. 가이드라인에 관해 궁금한 점이 있으면 언제든지 트윗해 주세요.

미리보기 채널 다운로드

Chrome Canary, Dev 또는 베타를 기본 개발 브라우저로 사용하는 것이 좋습니다. 이러한 미리보기 채널을 사용하면 최신 DevTools 기능에 액세스하고, 최신 웹 플랫폼 API를 테스트하고, 사용자가 문제를 발견하기 전에 사이트에서 문제를 찾을 수 있습니다.

Chrome DevTools팀에 문의하기

다음 옵션을 사용하여 DevTools와 관련된 새로운 기능, 업데이트 또는 기타 사항을 논의하세요.