분류 기타

웹 개발자를 위한 9 가지 Chrome 확장 프로그램

컨텐츠 정보

  • 조회 562 (작성일 )

본문

1. Web Developer

zumjZ75PvVSPDOsvmRznqr7oPMwqI4EjE1-ddStYtIDSAmC3Sfl0d5Gpo5kqDGNbbRPqzuQngg=w640-h400-e365 

웹 앱과 사이트를 만드는 사람들에게 가장 강력한 Chrome 확장 프로그램 중 하나는 Web Developer입니다.

HTML 및 CSS 작성 및 편집은 물론 쿠키를 비활성화 및 활성화하고 모든 링크를 방문했거나 방문하지 않은 것으로 표시하고 ALT 텍스트, 이미지 크기 및 이미지 경로를 비롯한 이미지에 대한 다양한 정보를 표시 할 수 있습니다.


2. JSONView

uPKJKDOJlIWGvDtXjRvhqg4NZLzFT_OZxiKlUZlcSJDdP3BZmv81MOpa2ufR4BwM9mqMCfpkhQ=w640-h400-e365 

이 확장 프로그램은 원래 Firefox 용으로 제작되었지만 Chrome으로 이식되었습니다.

이 확장 기능은 JSON 코드를 읽기 쉬운 방식으로 보여 주며 링크를 클릭하는 기능을 포함하며 기본 유효성 검사까지 포함합니다.

또한 XML을 볼 때와 마찬가지로 접을 수있는 배열과 객체를 제공하며, 구문 분석 메소드를 구성하고 오류가 있어도 코드를 표시 할 수 있습니다.


3. Stylebot

NTpRSrKPEQl2RAdCftT-a92BtPrbAovSMuPApJ0ITaYm7_H7dADgASVSRsc2_UDpmekvVNcXOBA=w640-h400-e365 

Stylebot을 사용하면 CSS를 쉽게 수정하고 테스트 할 수 있습니다.

저장된 스타일 시트를 로드 할 수 있을 뿐만 아니라 다른 사이트에서 스타일 시트를 가져 와서 이 확장을 사용하여 웹 페이지에 적용 할 수도 있습니다. 미리보기는 사이트를 만들 때 변경 사항을 표시하도록 설정할 수 있습니다.


4. Check My Links

ZcYp570S3U7xnDE-NX_Ed9fYKPOKiNk2ooaz2Zy0gWQA6KV7LAtRxyowSpOsjMmyG119ADDu67o=w640-h400-e365 

페이지가 깨진 링크로 가득 차면 방문자와 빈번한 사용자 모두에게 불편할 수 있습니다. 내 링크 확인을 사용하면 페이지에 깨진 링크가 있는지 몇 초 내에 확인할 수 있습니다.


5. Sonar

gXt67jdKqHLeQzwXrwJsZwMWA_PDua_-g-H1RIJleXqA-pVUNrMB6a3BHkTEoKrknhEHQ2EDgg=w640-h400-e365 


웹 사이트는 느린 서버, 캐싱 부족, 스크립팅 문제 및 대형 페이지 크기 등 다양한 이유로 인해 느리게 실행될 수 있습니다.

사람들이 컴퓨터와 스마트 폰에 웹 사이트를 2 ~ 3 초 내에 로드하지 않으면 웹 사이트를 떠날 것이라는 연구 결과가 있기 때문에 사이트가 느리게 돌아가는 이유를 찾는 것이 필수적입니다.

Sonar는 웹 페이지 연결에 대한 정보를 분석하고 로드하는 데 걸리는 시간을 보여줍니다. 총로드 시간을 밀리 초 단위로 표시하는 것과 함께 스크립트, CSS 및 이미지를 비롯하여 로드되는 미디어 및 파일 유형을 확인할 수도 있습니다.

또한 페이지를 로드하는 데 사용되는 도메인 수와 각 도메인에서 데이터가 도착하는 데 걸리는 시간을 볼 수 있습니다.


6. Wappalyzer

b3hdv8twlh1yW5ZuNk88XzGN9pPnBwlMyVnjIeDFa-nT47e7xQ4y2vhwgPeTIBs-aQ7LbSIJ=w640-h400-e365 

많은 웹 개발자는 다른 웹 사이트에서 아이디어를 얻습니다. 설계중인 사이트에 대한 기능이나 도구의 고유 한 버전을 만드는 방법을 찾는 가장 쉬운 방법 중 하나는 사이트가 실행되고 있는 플랫폼을 확인하는 것입니다.

Wappalyzer는 실행되고 있는 CMS, 사용중인 프로그래밍 언어 및 구현 된 데이터베이스 관리 시스템을 포함하여 사이트에 대한 막대한 양의 정보를 가져올 수 있습니다.

이 확장은 광고 네트워크, 자바 스크립트 프레임 워크 및 사이트에서 사용되는 네트워크 스토리지의 유형을 식별 할 수 있습니다.


7. Window Resizer

cbkn_HKEW024sSrwS8aLRlBxxeDx8z8Dm9SAjMwWAKgxQM6EYAw9TGKOvXp7lfBRFsXkydqq3A=w640-h400-e365 

웹 개발자와 앱 개발자는 다양한 화면 크기에서 애플리케이션이 어떻게 보이는지 파악하는 것이 중요합니다.

웹 사이트 또는 앱을 적응형 또는 반응형으로 디자인하는 경우에도 사이트 또는 앱이 다양한 화면에서 작동하는지 확인해야 합니다.

여러 장치에서 사이트를 테스트 할 수 있지만 상황이 제대로 맞는지 확인하는 가장 쉬운 방법은 Window Resizer를 사용하는 것입니다.

이 확장 프로그램을 사용하면 사전 프로그래밍 된 다수의 화면 크기 중에서 선택하거나 수동 너비 및 높이 설정을 입력 할 수 있습니다.


8. Clear Cache

_rjlM_Wxz-9p1KkAr3DxWL9B7DM9ORLS62X2QVDTPt3QH9bCRzkJ4juYLXF4JEOtpNWdWiOmHg=w640-h400-e365 


이 확장 프로그램은 Chrome에서 이미 사용할 수 있는 최신 버전입니다. Chrome의 Clear Browsing Data 옵션을 통해 이동할 수 있지만 이 확장 프로그램을 사용하면 삭제할 항목에 대한 더 많은 옵션을 제공하며 사용자 환경 설정을 저장합니다.

예를 들어 특정 도메인의 쿠키 만 지우고 싶다면 이 확장 프로그램에서 처리해야 합니다.

또한 로컬 저장소 데이터 및 플러그인 데이터를 WebSQL 데이터로 지울 수 있으므로 Chrome을 통해 WebSQL 데이터를 자동 또는 간편하게 지울 수 없기 때문에 매우 유용합니다.


9. OneTab

7fVHuOxe3dT4PRbasLrXKibcGIAEacupcRtxEM1fr4EggFxydsv5CpLFQyY6SgorOZAstp3zIQ=w640-h400-e365 

OneTab은 틀림없이 모든 유형의 사용자를 위한 최고의 Chrome 확장 프로그램 중 하나입니다. 많은 사람들과 같은 사람이라면 많은 크롬 탭을 열어야 합니다. 이렇게 하면 현재 필요한 탭으로 돌아가는 것이 어려워 질 수 있으며, 탭을 많이 열면 Chrome에서 컴퓨터 자원을 소비하기 시작하면서 더 많은 양의 메모리를 사용하기 시작할 수 있습니다.

이 확장 프로그램을 사용하면 사용 중이거나 방문한 탭을 계속 열어 두거나 북마크에 추가하거나 다시 돌아올 필요가 없어도 걱정할 필요가 없습니다.너무 많은 탭이 열려 있다는 것을 알게 되 자마자 OneTab 아이콘을 클릭하고 탭을 목록으로 변환하십시오. 이 확장 프로그램을 사용하면 Chrome 충돌에 대해 걱정할 필요 없이 모든 탭을 가져갈 수 있으므로 컴퓨터에서 멀리 이동할 수 있습니다.