Jupyter Notebook 문서 워드프레스 게재 방법

Jupiter Notebook(이하 쥬피터 노트북)은 문서와 파이썬 코드를 같이 작성할 수 있어 유용하다. 특히 보고서, 교육 문서 등을 작성하면 코드, 그림, 글, 표 등을 모두 포함한 우수한 문서를 만들 수 있다. 다양한 포멧의 파일 출력이 가능한 장점 또한 가지고 있다. 인터넷 웹 페이지에 게시 가능한 html 형식의 문서로도 생성할 수 있다. 하지만 이 html 파일을 그대로 워드프레스 홈페이지에 올리는 것은 불가능하다.

본 홈페이지에 주식 분석 글이나 파이썬 코드 설명 글을 작성할 때, 쥬피터 는 매우 좋은 툴이다. 본 글에서는 쥬피터 노트북의 글을 GitHub GIST를 사용하여 워드프레스에 올리는 방법을 설명한다.

절차

  1. 쥬피터 노트북 문서 파일을 text로 읽는다.
  2. Github GIST에 업로드한다.
  3. Github GIST의 결과 주소를 워드프레스에 올린다.

쥬피터 노트북 문서 파일을 Text로 읽기

업로드 하기 위한 쥬피터 노트북 파일을 먼저 Text로 읽어야 한다. 웹브라우저 쥬피터 노트북 페이지 상에서 편집이 완성된 쥬피터 노트북 파일을 저장하고 그 저장된 경로와 파일 이름을 기억하자.

메모장 등의 text 에디터로 쥬피터 노트북 파일을 선택
메모장 등의 text 에디터로 쥬피터 노트북 파일을 선택

위의 그림과 같이 text에디터로 쥬피터 노트북의 파일을 선택한다. 다음과 비슷한 형식의 문서를 읽을 수 있다. 이를 모두 선택하여 클립보드에 복사하자.(cntl+A, cntl+C)

{
“cells”: [
{
“cell_type”: “markdown”,
“metadata”: {},
“source”: [
“# RSI 분석”
]
},
{
“cell_type”: “markdown”,
“metadata”: {},
“source”: [

……. 중략

Github GIST에 업로드

다음 절차는 위에서 복사한 쥬피터 노트북의 코드를 Github GIST에 업로드하는 것이다. GitHub GIST 페이지를 방문하자.

https://gist.github.com

Github에 로그인하고 화면 상단의 New gist를 클릭하면 다음 그림과 같은 화면을 확인 할 수 있다. 아래와 같이 가운데 입력창에 복사한 코드를 붙여넣자.

Github GIST 화면, 코드 입력 상태
Github GIST 화면, 코드 입력 상태

코드를 붙여 넣으면 우측 하단의 버튼 2개가 활성화 된다. Create secret gist로 누르면 본인의 git에 저장되어 본인과 본인이 게시하는 글에서만 확인 가능하다. 이 버튼을 누르면 다음 그림과 같은 화면이 나온다.

GitHub GIST 코드입력 결과
GitHub GIST 코드입력 결과

화면에서 노란색으로 칠해진 부분이 우리가 워드프레스에 임베드 해야 할 내용이다. 우측의 버튼을 눌러서 내용을 클립보드에 복사하자.

워드프레스 업로드

마지막 절차는 위의 복사한 내용을 워드프레스에 올리는 일이다. 쥬피터 노트북 파일을 올리려는 글을 생성하고 편집기를 열자. 최신 워드프레스 버전에서는 블록 단위로 글을 편집하게 되어있다. 새 블록을 만들고 포멧 항목에서 사용자 정의 HTML을 열자.

블록, 포멧, 사용자 정의 HTML
블록, 포멧, 사용자 정의 HTML

html 입력창이 나오면 Github GIST에서 복사한 링크를 붙여넣자.

GitHub GIST 링크 붙여넣기
GitHub GIST 링크 붙여넣기

여기까지 수행하고 글을 공개하자. 다음과 같이 결과를 확인 할 수 있다. 쥬피터 노트북의 내용을 확인 할 수 있는 박스가 하나 뜬다. 글 전체에 나오는 것은 아니지만 이 정도면 확인 하는데 큰 문제는 없다.

참고문헌

댓글 남기기

이메일은 공개되지 않습니다. 필수 입력창은 * 로 표시되어 있습니다