블로그에 소스코드 넣기, 깔끔하게 Gist로 하자!

수정

Gist 소스코드 삽입

GitHub Gist(깃허브 지스트)란
코드, 메모, 스니펫(작은 부분)을 즉시 공유할 수 있는 서비스입니다.
(instantly share code, notes, and snippets.)

마이크로소프트가 인수한 오픈소스 개발자 커뮤니티 GitHub에서 제공하는 서비스이기에 믿음이 갑니다.

여담으로 일명 마소 형님이 GitHub를 인수한 뒤로 비공개 저장소가 무료화되어 Git(깃) 국내 사용자가 늘었지만 아직 SVN(서브버전)에 익숙한 사용자가 많기에 Git에 대한 친근감이 상대적으로 낮고 Git의 진입장벽에 주저하는 사용자도 많은 듯 합니다.

Git과는 달리, Gist는 블로그에서 손쉽고 깔끔하게 소스코드를 공유할 수 있는 서비스입니다.
단계를 따라 블로그에서 소스코드를 공유해 봅시다.

1단계 GitHub Gist 로그인 또는 가입하기

여기로 이동한 후 GitHub 계정을 가지고 있다면 로그인 그렇지 않다면 가입을 진행합니다.


2단계 Gist 생성하기

상단 메뉴바에서 +(플러스) 버튼을 클릭해서 Gist 생성 페이지로 이동하고


①개요, 설명을 입력합니다.
②확장자를 포함한 파일명을 입력합니다.
③소스코드를 입력합니다.
④클릭하여 Gist를 생성합니다.
💡'Create secret gist'는
여기↓↓↓에서 검색되지 않지만 URL을 알고 있으면 누구나 접속할 수 있습니다.

💡'Create public gist'는 검색되고 URL을 알고 있으면 누구나 접속할 수 있습니다.


3단계 블로그에 소스코드를 삽입하기

Gist를 생성한 후 아래와 같은 페이지에서 '클립보드 복사 버튼'을 클릭하고

블로거(Blogger, 구글 블로그), 티스토리(TISTORY) 등등의 블로그 플랫폼에는 글 작성시, HTML 모드가 있는데 HTML 모드로 전환한 후 '붙여넣기'하면 완료입니다.


사용 예
#컴퓨터 도움말
다른 글

이 포스팅은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다.

댓글

  1. JinJin2020년 7월 3일 오전 7:06

    소스코드를 공유한다는 것은 무슨 뜻인가욥...ㅎㅎ

    답글삭제
    답글
    1. 수아2020년 7월 3일 오전 8:39

      '공유'라고 해서 어렵게 느끼시는 것 같은데, 조금 위에 [사용 예]라고 보이시죠? 코드의 일부를 블로그 글과 함께 같이 게시한 모습이에요. 블로그 글 쓸 때, 직접 코드를 적어 넣어도 되지만 'Gist'를 활용하면 좋다는 걸 소개하고 있습니다. 이 글은 블로그 운영과는 상관없는 프로그래밍 관련 글을 작성할 때, 간혹 필요한 코드 공유 팁같은 거니깐 헷갈리지 않았으면 하네요. 그리고 아침형 사람이신 듯합니다.

      삭제
  2. JinJin2020년 7월 4일 오전 10:15

    어제 하루종일 올려주신 글 따라서 하느라고 답글이 너무 늦었네요!
    오늘도 6시부터 일어나서 따라해보고 있는데 하면 할수록 조슈아님이 대단하신것 같아요 ㅎㅎ 아무래도 저는 깃허브지스트는 따로 쓸 일이 없을것 같네요.. 너무 고수의 세계인것...

    답글삭제
  3. 수아2020년 7월 17일 오후 4:49

    몇분이 헷갈리시는 건지 물어오셨는데,
    이 글은 '구글 블로그' 카테고리에 들어 있기는 한데
    '구글 블로그 꾸미기·커스터마이징'과는 관계없는 글입니다.
    프로그래밍(코드) 관련 분야의 글을 작성하고 게시하는 것이 아니라면
    필요없는 정보이며 무시하셔도 됩니다.

    답글삭제
  4. Unknown2020년 11월 21일 오후 12:21

    안녕하세요! 스니펫 정보를 얻고자 이곳저곳 돌아다니다 여기로 오게된 사람입니다.
    질문이 있어서요. 지스트 프로그램 을 사용해서 네이버 블로그도 사용이 가능한건가요??

    답글삭제
    답글
    1. 수아2020년 11월 21일 오후 12:27

      네이버 블로그에서 테스트해 보지는 않았지만, 안 될 이유는 없다고 생각합니다.

      삭제
    2. 수아2020년 11월 21일 오후 12:34

      일부러 막아 놓지만 않았다면 됩니다.
      GitHub Gist는 블로그 플랫폼과는 무관하며, 어떤 웹 페이지에서도 사용이 가능합니다.
      해당 블로그 플랫폼이 HTML 모드를 제공하지 않는다면 어렵겠지만요.

      삭제
  5. Unknown2020년 11월 21일 오후 12:35

    답변 정말 감사합니다!! 정말 죄송한데

    https://kin.naver.com/qna/detail.nhn?d1id=1&dirId=1060102&docId=373796182

    이것도 한번 봐 주시면 안될까요??

    이곳저곳 많은 정보를 찾아보려고 유튜브며 구글이며 네이버며 다 찾아봤지만 정보를 알수가 없었습니다. ㅜㅜ

    답글삭제
    답글
    1. 수아2020년 11월 21일 오후 12:55

      링크를 통해서 보여주신 글과 이 글에서 소개하고 있는 GitHub Gist는 전혀 무관합니다.

      '스니펫'이라는 용어 때문에 오해하시는 것 같아요.

      궁금해 하시는 '스니펫'과 이 글에서 사용하고 있는 '스니펫'은 사전적 의미만 같을 뿐, 서로 전혀 다른 범주에 속합니다.

      제가 알기론(전문가 아님), 궁금해 하시는 것에 관한 내용은 간단한 내용도 아니고 확실한 방법도 없습니다.

      구글 검색으로
      'SEO'
      '검색 엔진 최적화'
      'html meta description'
      등으로 검색하면 원하는 관련 정보가 나올 수도 있습니다.

      삭제
    2. 수아2020년 11월 21일 오후 12:59

      구글이 아니라 네이버를 타겟으로 하시는 것 같으니,
      '네이버 SEO'라고 해야 겠네요.

      삭제
  6. Unknown2020년 11월 21일 오후 1:01

    너무 감사합니다 조슈아님!! 행복한 주말 되세요!! ㅎㅎ한번 찾아보겠습니다^^

    답글삭제

댓글 쓰기