개시하다

자바스크립트가 포함된 HTML을 표시하기 위해 GiitHub로 창고GitHub Pages를 만드는 사람도 있지만 HTML이 조금이라도 있으면 일부러 창고를 만드는 것도 번거롭다.
Firefox의 Bugzilla를 봤는데 984796 – SVG path getTotalLength returns large incorrect number에서 우연히 발견bl.ocks.org - about해서 편리해서 소개할게요.

사용법

파일 이름index.html으로 Gist를 만듭니다.

이후 Gist의 URLhttps://gist.github.com을 http://bl.ocks.org로 바꾸어 방문했을 때 표시됩니다.

bl.ocks.org - about에서 언급한https://gist.github.com/mbostock/1353700의 예는http://bl.ocks.org/mbostock/1353700이다.
Gist의 제목 아래에 HTML의 내용을 표시하고 그 아래에 HTML의 원본 파일을 표시합니다.이런 느낌이에요.

제목과 HTML 소스를 표시하지 않고 HTML만 표시하는 URL도 있습니다.

https://gist.github.com/mbostock/1353700에서 "Open in a new window."링크할 때 다른 창에는 HTML만 표시됩니다.
바로 이 예입니다.
http://bl.ocks.org/mbostock/raw/1353700/
의 URL입니다.
즉
http://bl.ocks.org/{GiitHub 계정]/raw/{Gist ID}
의 URL입니다. HTML만 표시됩니다.
이 예의 캡처.

index.) 이외에도 JavaScript 파일을 사용할 수 있습니다.

bl.ocks.org - about의 지침에 따라 Gist에서 index가 사용됩니다.) 이외에 파일 index를 추가합니다.""부터 상대 경로를 참조하여 사용할 수 있습니다."

Block 요약 링크 및 Gist 링크

페이지 하단의 왼쪽 http://bl.ocks.org/mbostock/raw/1353700/
mbostock "s block#1353700"로 표시
계정 이름 부분은 Block 일람으로, Gist ID 부분은 Gist로 연결됩니다.

블록 목록의 축소판 이미지

bl.ocks.org - about에는 설명이 없지만 mbostock의 네모난 블록 일람와 Gist 중 하나를 보면 thumbnail.png의 파일 이름으로 축소판 그림을 놓으면 정보 블록 일람에 나타난다.

총결산

파일 수가 많으면 깃허브로 창고를 만드는 것GitHub Pages은 관리하기 쉽지만, 파일 수가 적은 소형 샘플이라면 지스트 bl.ocks에 보관한다.org로 접근하는 방법이 편리할 것 같습니다.