많은 기술이 웹사이트 구축에 사용됩니다. 콘텐츠 관리 시스템, 프레임워크, 다양한 스크립팅 및 프로그래밍 언어, 지불 시스템… 모든 종류의 것들!
즐겨찾는 웹사이트가 어떻게 작동하는지 궁금하거나 사이트에서 대략적인 내용을 사용하고 있는지 알고 싶다면 이 기사에서 내부를 살펴보고 어떻게 구축되었는지 확인할 수 있는 몇 가지 방법을 보여드릴 것입니다.
웹사이트의 코드 보기
개발자가 아니거나 이제 막 시작했다면 이제 더 나은 프로그래밍의 비결을 배우게 될 것입니다. 다른 사람의 코드를 보세요. 이를 위해 Chrome의 개발자 도구를 사용하는 방법을 보여 드렸습니다.
ChromeDevTools를 사용하면 사이트의 HTML, JavaScript 및 CSS 코드를 보고, 사용 중인 소스를 찾고, 브라우저에서 사이트의 로드 성능을 확인하는 방법을 알 수 있습니다. 모든 주요 웹 브라우저에는 일부 버전의 개발자 도구가 있습니다.
내장
BuiltWith.com은 사이트에서 사용하는 모든 기술을 볼 수 있도록 사이트를 자세히 살펴보는 전문가 수준의 리소스입니다. 현재 그들은 6억 7,300만 개 이상의 웹사이트를 커버하고 있습니다. 이 사이트의 주요 아이디어는 소프트웨어 영업 담당자를 위한 리드 생성을 돕는 것이었습니다.
고급 기능은 유료 구독을 통해서만 사용할 수 있지만 누구나 BuiltWith.com으로 이동하여 웹 사이트 주소, 기술 이름 또는 키워드를 입력하고 자세한 기술 프로필을 얻을 수 있습니다. 무료 계정에 가입하면 하루에 5번의 상세 조회가 가능합니다.
Netcraft 사이트 보고서
Netcraft는 1995년부터 웹 개발자를 위한 리소스였습니다. Netcraft의 무료 사이트 보고서 도구에는 25년 이상의 전문 지식이 나와 있습니다. 기술 보고서와 "사이트 소유자" 배경 보고서를 결합하여 사이트에 대한 철저한 개요를 얻을 수 있습니다. 호스팅 위치, 소유자 및 일부 도메인 기록을 알 수 있습니다.
Netcraft 사이트 보고서는 무제한 조회를 허용하는 것으로 보입니다. 그래도 정말 필요할 때만 사용하세요. 이는 무료 리소스이며 개발자 커뮤니티는 이러한 상태를 유지하기를 바랍니다.
W3Tech의 사이트 정보
W3Techs의 사이트 정보 도구는 다른 도구와 약간 다르게 작동합니다. 그들은 정보 데이터베이스를 유지하지만 도구를 통해 이미 검색된 사이트에만 있습니다. 이전에 확인되지 않은 사이트를 확인하는 경우 사이트를 즉시 크롤링합니다.
제공된 보고서는 다른 서비스가 제공하는 것보다 덜 심층적이지만 여전히 통찰력이 있습니다. 사이트에서 사용하는 CMS, 프로그래밍 언어, 웹 서버 및 호스팅 공급자를 알 수 있습니다. W3Tech는 Firefox 및 Chrome용 브라우저 확장 프로그램도 제공하므로 클릭 한 번으로 사이트를 확인할 수 있습니다.
와팔라이저
사이트의 기술을 확인하는 브라우저 플러그인을 선호하는 경우 Wappalyzer에는 Firefox, Chrome 및 Edge용 플러그인이 있습니다. 플러그인은 무료이며 사용하기 쉬우며 읽기 쉬운 디자인으로 구성되어 있습니다. 보고서에서 기술을 클릭하면 해당 기술에 대한 설명으로 이동합니다. 이전에 본 적이 없는 것을 발견할 때 유용합니다.
Wappalyzer는 웹사이트에 대한 경고를 생성할 수 있는 고유한 기능을 제공합니다. 그들은 매일 사이트를 확인하고 변경 사항을 감지하면 이메일을 보냅니다. 경고를 받으려면 Wappalyzer로 무료 계정을 만들고 매월 10크레딧을 지불해야 합니다.
그러나 매월 50크레딧이 무료로 제공되며 알림 비용은 30일마다 10크레딧입니다. 따라서 Wappalyzer Alerts는 5개 이하의 사이트를 모니터링하는 경우 기본적으로 무료입니다.
웹 스포터
Webspotter의 서비스 중 하나를 제외하고는 모두 유료 서비스이지만 괜찮습니다. 무료 Webspotter Chrome 확장 프로그램이 이를 보완합니다. Webspotter 확장은 Wappalyzer와 유사하지만 몇 가지 다른 기능이 있습니다. 나열된 각 기술 옆에는 해당 기술에 대한 통계, 해당 기술을 사용하는 웹 사이트 목록 및 해당 기술의 공식 웹 사이트에 대한 링크가 있습니다.
훨씬 더 흥미로운 기능은 이메일 연락처, 소셜 미디어 링크, SEO 분석 및 기타 회사 정보를 웹사이트에서 가져오는 Webspotter의 기능입니다. 사이트가 어떻게 만들어졌는지 알려주지는 않지만 온라인 마케팅 목적이나 구직 활동에 유용할 수 있습니다.
WordPress 테마 감지기
웹 개발에는 그다지 관심이 없지만 WordPress 사이트를 만들고 있고 다른 곳에서 본 기능을 포함하고 싶을 수도 있습니다. WordPress 테마 감지기 Chrome 브라우저 플러그인을 다운로드합니다.
WordPress 테마 감지기는 사이트에서 사용 중인 WordPress 테마를 알려줄 뿐만 아니라 사용 중인 WordPress 플러그인도 알려줍니다. 또한 테마 또는 플러그인을 만든 사람을 보여주고 받을 수 있는 링크를 제공합니다. 따라서 다른 사이트에서 감탄했던 요소를 WordPress 사이트에 쉽게 통합할 수 있습니다.
웹사이트 작동 방식 알아보기
예, 인터넷의 모든 웹 사이트에 뛰어들어 웹 사이트가 무엇으로 구성되어 있는지 확인하는 것은 쉽습니다. 이 도구 중 두 개 이상을 사용해 보십시오. 일부 도구는 다른 도구가 사용하지 않는 것을 선택합니다. 사이트에서 보는 대부분의 내용은 실제로 컴퓨터에서 렌더링됩니다. 쉽게 볼 수 있다는 점입니다. 웹사이트를 최대한 안전하게 만들어야 하는 이유이기도 합니다. 딥 다이빙을 즐기고 무엇을 찾거나 구축했는지 알려주십시오.