이 게시물에서는 Chrome 확장 프로그램 시작 환경에 대한 몇 가지 중요한 개선사항과 이러한 꿈에 동참할 수 있는 몇 가지 방법을 공유하게 되어 기쁩니다.
이전 가이드
이전에는 Chrome 확장 프로그램 시작하기 튜토리얼이 사용자가 확장 프로그램 팝업에서 버튼을 클릭하면 현재 페이지의 배경색을 변경하는 기본 확장 프로그램 예시였습니다. 또한 네 가지 색상 중 하나를 선택할 수 있는 옵션 페이지도 포함되어 있습니다.
이 기본 예에서는 실제 확장 프로그램에 포함된 인기 기능을 추가하는 방법을 보여주지 않았습니다. 개편할 때가 되었습니다.
새로운 접근 방식
Google에서는 개발자가 Chrome 확장 프로그램 학습 여정을 시작할 때 이 문서를 참고한다는 점을 잘 알고 있으며, 접근성이 높고 초보자 친화적이며 관련성이 높은 경로를 제공하는 것을 목표로 삼고 있습니다. 우리는 기존 튜토리얼 예를 개선하기 위해 애쓰는 대신 처음부터 다시 시작하기로 했습니다.
새롭게 개선된 시작하기 컬렉션 소개:
- 확장 프로그램 101
- 웹 기술, 흔히 사용되는 확장 프로그램 구성요소 등 Chrome 확장 프로그램 개발의 기본 개념을 간략하게 소개합니다. 또한 Chrome 웹 스토어에서 확장 프로그램을 디자인하고 배포할 때 유의해야 할 사항도 포함되어 있습니다.
- 개발 기본사항
- Hello, Extensions 예시를 만들어 확장 프로그램 개발 워크플로를 소개합니다. 개발 중에 확장 프로그램을 로드하고, 로그와 오류를 찾고, 프로젝트 구조를 선택하고, Typescript를 사용하는 과정을 안내합니다.
- 읽기 시간 튜토리얼
- 기사 읽기를 완료하는 데 필요한 시간을 알면 유용합니다. Reading Time은 모든 확장 프로그램 문서 페이지에 예상 읽기 시간이 포함된 요소를 삽입하는 방법을 알려줍니다.
- 집중 모드 튜토리얼
- 한 페이지에서 불필요한 정보를 많이 쌓아갈수록 우리 마음도 가장 관련성 높은 정보에 집중할 수 있습니다. 집중 모드는 페이지의 스타일을 변경하고 주의를 분산시키는 몇 가지 요소를 숨기는 방법을 보여줍니다.
- 탭 관리자 가이드
- 확장 프로그램 개발을 연구하다 보면 여러 창에 걸쳐 다수의 문서 탭이 만들어질 수 있습니다. 탭 관리자를 통해 Chrome 확장 프로그램 및 Chrome 웹 스토어 문서 탭을 정리할 수 있습니다.
이 튜토리얼에서는 실제 확장 프로그램을 빌드하는 방법뿐만 아니라 개발 팁과 권장사항도 공유합니다. 또한 이러한 확장 프로그램을 사용하면 확장 프로그램의 도움말을 읽는 사용자 환경이 개선됩니다.
참고사항
각 튜토리얼에는 다음 섹션이 포함됩니다.
- 확장 프로그램이 수행할 작업입니다.
- 여기서 다룰 강의입니다.
- 시작하기 전에 알아야 할 사항
- 확장 프로그램 빌드에 대한 단계별 안내입니다.
- 확장 프로그램을 로드하고 테스트하는 방법
확장 프로그램에 다른 기능을 맞춤설정하거나 추가하는 방법에 대한 몇 가지 아이디어가 나와 있는 섹션을 통해 도전해 보시기 바랍니다.
여러분의 도움이 필요합니다
여러분의 소중한 의견을 기다리겠습니다. 이 가이드에서 잘못되거나 명확하지 않은 내용을 발견하면 GitHub 저장소에서 버그를 신고해 주세요.
이 새로운 시작 가이드는 이전 가이드에 비해 크게 개선되었다고 생각하지만, 여기서 멈추지 않습니다. 모든 확장 프로그램 개발자에게 더 나은 서비스를 제공할 수 있도록 문서를 계속 개선하고 확장하기 위해 계속 노력하겠습니다.
사진: 바르단 Papikyan(Unsplash 제공)