옵시디언 무료 퍼블리싱 방법과 사용법

이주영·2023년 1월 2일
3
post-thumbnail

계기

무료 퍼블리싱하게 된 계기 폐쇄적인 옵디시언의 치명적인 단점으로 인해 메모들을 공유하고 싶은 마음에서 시작됐습니다. 피드백을 받아 잘못된 부분은 고치고 지식도 공유하고 싶었습니다. 그래서 오픈 소스를 활용해서 블로그(모두의 지식 창고)를 만들어보려고 합니다.

기본적인 베포 과정

1. 깃허브(GitHub)에서 계정 생성하기

깃허브 계정이 있어야 오픈 소스 탬플릿을 불러올 수 있습니다.
깃허브 계정 생성하러 가기

2. Digital garden Jekyll template을 이용해 Repository 생성

깃허브에는 오픈소스라는 개념이 있습니다.

오픈 소스 문화
개발 분야에 있는 문화로써 모든 사람에게 소스 코드를 공개하고 무료로 사용할 수 있도록 공개하는 것을 말합니다.

여러 오픈 소스들을 찾아본 결과, 첫 페이지 로딩 속도는 리액트보다는 느렸지만, 페이지의 이동 시 전체 html을 받아오기 때문에 UX 차원에서 훨씬 좋은 성능을 보였습니다. 페이지가 많은 제 웹사이트에 가장 적합한 오픈소스는 jekyll,ruby이라고 판단했습니다. 추천합니다

3. 자신의 로컬에 오픈소스 repository clone

4. 넷틀리파이(Netlify) 사이트에서 계정 만들고 클론한 깃허브 Repository와 연동


깃허브 로고를 누르면 권한 요청을 하고 수락하면 자신의 깃 레포를 찾아서 연결해줄 수 있습니다.

이 단계에서는 변경할게 없습니다. 사이트 deploy click!

5. 노트를 퍼블리시(publish) 하기

첫화면

위의 과정을 통해서 쉽게 obsidian 앱에 있는 노트들을 베포할 수 있게 됩니다. 하지만 진짜 자신만의 블로그를 만들기 위해서는 어떻게 오픈소스가 설계됐는지를 알아야합니다.

로컬에서 서버 띄우기

기본적인 베포만 진행했을 경우 수정을 해서 master branch에 push를 할 경우 build를 거쳐 베포가 됩니다. 하지만 수정을 할때 마다 베포된 서버에서만 확인을 해야한다는 불편함 때문에 로컬 서버를 띄우려고 합니다.

우선 이 오픈소스 같은 경우, 언어는 Ruby이며 정적 페이지를 만들어주는 gernerater은 Jekyll이 사용됐습니다.

1. 오픈소스 README.md

자신만의 디지털 가든 README.md

위의 링크에 들어가 3번에 있는 로컬로 띄우기를 발견하고 바로 vscode에 들어가 bundle 명령어를 사용해보니

생전 보지도 못한 에러를 만났습니다. 구글링을 통해 해결한 과정을 정리해보자면

2. ruby 에러 해결

Mac에서 Ruby의 패키지 매니저인 gem을 통해 설치를 진행하다 다음과 같은 에러를 만납니다.

결론부터 말하면, 시스템 ruby를 이용하고 있기 때문에 권한이 없어 gem 설치가 안된 것입니다.

그래서 rbenv를 통해 문제를 해결해보겠습니다

출처 : https://jojoldu.tistory.com/288

먼저 brew를 통해 rbenv 를 설치합니다.

Mac에서 brew 설치하기

brew update
brew install rbenv ruby-build

rbenv가 잘 설치됐는지 확인해봅니다.

rbenv versions

여러분들 같은 경우는 위의 사진과 다르게 현재 system에 Ruby를 사용하고 있을 겁니다. 그래서 에러가 나타나는 것이었고 그래서 rbenv로 관리되는 Ruby를 설치해야합니다.

내면의 질문
왜지? 추가 예정

rbenv로 관리되는 Ruby를 설치해야 됩니다.
설치할 수 Ruby 버전은 다음 명령으로 확인할 수 있습니다.

rbenv install -l

여기서 우리 오픈소스가 사용하는 Nokogiri와 호환되는 Ruby 버젼은

nokogiri requires ruby version < 3.2.dev, >= 2.6

이라는 점 유의하시길 바랍니다. 그래서 3.1.3을 다운로드 해주시면 됩니다.

rbenv install 3.1.3

5 ~ 10분 후 완료가 되면 버젼을 확인해봅니다.

rbenv versions

여전히 system으로 되어있지만, 신규 추가된 3.1.3 버전도 함께 보입니다.

* system
  3.1.3 (set by /Users/leejuyoung/.rbenv/version)

rbenv로 글로벌 버전을 2.6.4로 변경합니다.

rbenv global 3.1.3

핵심
마지막으로 rbenv PATH를 추가하기 위해 본인의 쉘 설정 파일 (..zshrc, .bashrc) 을 열어 다음의 코드를 추가합니다.
저는 zsh를 사용하니 .zshrc에 추가합니다.

vim ~/.zshrc
[[ -d ~/.rbenv  ]] && \
  export PATH=${HOME}/.rbenv/bin:${PATH} && \
  eval "$(rbenv init -)"

위의 코드를 vim으로 들어간 터미널에서 I를 눌러 수정을 할 수 있도록 하고 그대로 붙여 넣어줍니다.

붙여넣기 후, ESC를 누르고 :wq를 통해 vim으로부터 나가줍니다.

source ~/.zshrc

이후 위의 코드를 작성하면 끝

그리고 다시 gem install을 수행해봅니다.

gem install bundler

아래와 같이 정상적으로 실행되는 것을 확인할 수 있습니다.

Fetching bundler-2.0.2.gem
Successfully installed bundler-2.0.2
Parsing documentation for bundler-2.0.2
Installing ri documentation for bundler-2.0.2
Done installing documentation for bundler after 2 seconds
1 gem installed

bundler를 설치 한 후

 bundle exec jekyll serve

을 통해 _note에 있는 md 파일이 _site 안에 html로 자동 생성되어 서버가 실행됩니다.

이런 오픈소스를 만들어준 개발자분들께 너무 감사하고 나도 이런 문화에 동참하고 싶다. 우선 이 오픈소스 그래프에 버그가 많다. PR 요청해야겠다. 그러기 위해서는 ruby를 먼저 찍먹해야겠다. 다음에 더 유익한 정보를 가지고 오겠습니다.

digitalGarden 보러 가기 : https://journeydev.netlify.app/

참고자료

  1. https://anpigon.tistory.com/203
  2. https://steemit.com/hive-101145/@anpigon/20220330t113002362z
  3. https://kr.analysisman.com/2022/05/obsidian-publish-free-git.html
  4. Gem이 설치가 안돼요
profile
https://danny-blog.vercel.app/ 문제 해결 과정을 정리하는 블로그입니다.

0개의 댓글