web developer

웹 개발자

Web Developer Extension은 브라우저에 다양한 웹 개발자 도구를 추가합니다. 이 확장은 Chrome, Edge, Firefox 및 Opera에서 사용할 수 있으며 Windows, OS X 및 Linux를 포함하여 이러한 브라우저가 지원하는 모든 플랫폼에서 실행됩니다.

확장자는 홈페이지에서 설치할 수 있습니다.

• 홈페이지 : https://chrispederick.com/work/web-developer/

또는 크롬, 에지, 파이어 폭스 또는 오페라 확장 리포지토리에서 직접 :

• Chrome : https://chromewebstore.google.com/detail/web-developer/bfbameneiokkgbdmiekhjnmfkcnldhhm
• 에지 : https://microsoftedge.microsoft.com/addons/detail/web-developer/ilbdhapjffldgngebmnkdodohjapjccm
• Firefox : https://addons.mozilla.org/en-us/firefox/addon/web-developer/
• 오페라 : https://addons.opera.com/en/extensions/details/web-developer/

공지 사항

베타 릴리스에 대한 뉴스 및 다가오는 버전의 미리보기를 포함하여 웹 개발자 확장에 대한 발표는 다음과 같습니다.

• 블로그 : https://chrispederick.com/blog/
• Mastodon : https://social.lol/@chrispederick

돕다

웹 개발자 확장에 대한 도움말은 홈페이지에서 찾을 수 있습니다.

• 도움말 : https://chrispederick.com/work/web-developer/help/
• 알려진 문제 : https://chrispederick.com/work/web-developer/issues/
• 할 일 목록 : https://chrispederick.com/work/web-developer/to-do/

새로운 문제를보고하거나 새로운 기능을 제안하려면 저에게 연락하십시오.

• 연락처 : https://chrispederick.com/contact/

개발자

기술

웹 개발자 확장자는 JavaScript, HTML 및 CSS로 작성되었습니다.

확장 문서

브라우저 확장 방법에 대한 정보는 Chrome, Firefox 및 Opera 문서를 확인하십시오.

• Chrome : https://developer.chrome.com/docs/extensions/
• 에지 : https://learn.microsoft.com/en-us/microsoft-edge/extensions-chromium/
• Firefox : https://developer.mozilla.org/en-us/docs/mozilla/add-ons
• 오페라 : https://dev.opera.com/extensions/

빌드 프로세스

확장자는 Gulp 빌드 시스템을 사용합니다.

Gulp가 설치되면 다음을 실행하여 확장 기능이 구축됩니다.

 gulp

Chrome, Edge, Firefox 또는 Opera의 확장을 구축하려면 gulp chrome , gulp edge , gulp firefox 또는 gulp opera 각각 실행합니다.

확장자가 구축되면 build/chrome , build/edge , build/firefox 및 build/opera 디렉토리뿐만 아니라 확장 버전 build/web-developer-chrome.zip , build/web-developer-edge.zip , build/web-developer-firefox.xpi build/web-developer-opera.nex .

크롬, 에지, 파이어 폭스 및 오페라 문서에 설명 된대로 각각 build/chrome , build/edge , build/firefox 또는 build/opera .

도서관 포함

다음 라이브러리는 다음 라이브러리를 사용하고 확장에 포함되어 있습니다.

• 부트 스트랩 : https://getbootstrap.com/
• Codemirror : https://codemirror.net/
• dompurify : https://github.com/cure53/dompurify
• Eric Meyer의 리셋 CSS : https://meyerweb.com/eric/tools/css/reset/
• JS Beautifier : https://github.com/beautify-web/js-beautify
• mustache.js : https://github.com/janl/mustache.js/ https://unpkg.com/browse/4.2.0/mustache.js에서 가져옵니다

유지 보수상의 이유로 최신 버전으로 업데이트하지 않고 변경해서는 안됩니다.

아이콘

확장에 사용 된 아이콘은 Nucleo에서 나오고 확장에 사용 된 새로운 아이콘도 일관성을 위해 제공되어야합니다.

편집기 구성

다른 편집자의 코딩 스타일을 통합하기 위해 EditorConfig 파일이 포함되어 있습니다.

감사의 말

지원 :

• Browserstack

작가

Chris Pederick

• https://chrispederick.com/
• https://social.lol/@chrispederick

특허

모든 파일은 GNU 일반 공개 라이센스의 조건에 따라 무료로 배포됩니다. 이는 자체 라이센스가있는 개발자 섹션에 언급 된 포함 라이브러리 또는 아이콘에는 적용되지 않습니다.