· 톺아보기

맥당이야기

Devonthink에 Markdown + code syntax 입히기

아마테리스 ·

조회 4,962 · 공감 5 · 댓글 12

혹시 비슷한 고민하시는 분이 계실지도 몰라서 올립니다.


저는 개발용 노트앱을 항상 고민해오고 있습니다.. 좀 변태스럽긴 하네요 ㅠㅠ

OneNote 4년 => Evernote 3년 => Quiver 완전잠깐.. => Scivener + Dropbox 2년 => Ulysses + Dropbox 1년...


최근 Ulysses가 워낙 Sync도 잘되고, 이쁘기도 하고 이래저래 맘에 들어 만족하고 쓰고 있었습니다.

근데 문제는 아무래도 개발자다 보니 log 같은것도 넣고 할일이 있는데, 글의 양이 많아지면 쓰기 힘들정도로 느려지는 문제가 있죠.

아마도 Bear나 비슷한 류의 editor들 (Markdown기반)이 그럴거 같습니다.


그래서 이번에 Devonthink에 Markdown으로 옮겨 타볼려고 이래 저래 알아봤습니다.

css 파일과 js 파일을 이용해서 ulysses까진 아니어도 비슷하게는 만들 수가 있네요.

css파일과 js파일을 절대 바꾸지 않을 웹서버 공간에만 넣으면 Devonthink To Go에서도 이쁘게 나오네요.


아래 두개의 사이트를 참고한 내용에, 개인적으로 색상이나 스타일 수정했습니다.

- prismjs.com 홈페이지

- css와 syntax입히기 논의 사이트


Markdown 파일의 최상단에 아래와 같은 두줄을 넣어야만 하는 번거로움(?)은 있습니다.

<link rel="stylesheet" href="http://192.168.180.91/prism_jason.css">

<script src="http://192.168.180.91/prism.js"></script>


맥북에서의 모습입니다.


아이폰에서의 모습입니다.


아이패드에서의 모습입니다.


댓글 12

  1. 꽐라꽐라아 ·
    정말 고민하고 솔루션 찾던 문제였는데 좋은 팁 감사합니다! 저도 한번 적용해봐야겠네요!!
    / clienkit3 beta
  2. 아마테리스 ·
    mirabilia79님// css랑 js파일 연결하는 구문을 넣어서 템플릿에 추가해서 쓰면 되긴하네요 문제는 나중에 경로를 바꿀일이 생기면 골치가 아플수 있어요 :)
    /Vollago
  3. jmjeong ·
    멋진데요. css, js를 github public page에 올리고 link 해도 되겠네요.
    상단에 두줄 넣는 것은 keyboard maestro나 typinator 같은 macro 도움을 받으면 편할것 같고요.
  4. 아마테리스 ·
    jmjeong님// 마크다운 파일을 만드셔서 미리 두줄만 넣은 파일을 ~/라이브러리/어플리케이션서폿/데본싱크/템플릿/위치에 넣으시면 편해요
    /Vollago
  5. 보렐칸텔리 ·
    수식 쓰려고
    <script src='https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-MML-AM_CHTML' async></script>를 맨 위에 넣곤 했는데 이렇게 css까지 넣을 수 있었군요..!
    혹시 위의 배경이나 폰트 흰색으로 하는 것은 다크모드 같은 기능을 사용하신 것인지, 아니면 직접 css 파일을 수정해서 사용하신 것인지 알려주실 수 있나요?
  6. 아마테리스 ·
    보렐칸텔리님//네 css를 직접 수정해서 원하는 색상으로 맞췄습니다~ css를 변경하면 Devonthink를 껐다 켜야만 적용되서 약간 노가다네요~ 쪽지로 메일주소 보내주시면 제가 작업해 놓은 css 보내드릴게요 수정해서 쓰셔요.
  7. 보렐칸텔리 ·
    @아마테리스님 헉 정말 감사합니다! 쪽지드리겠습니다!
  8. 아마테리스 ·
    @보렐칸텔리님 보내드렸어요~
  9. 케이K ·
    일전에 보내주신 css파일 잘쓰고 있습니다. ^^
    제 경우는 devon뿐 아니라 에디팅할 때, VScode도 사용하고 있는데요.
    로컬의 파일을 데본에서처럼 경로를 지정해서 넣으면 적용이 잘 안되네요.

    그래서 대신 생각해둔 것이 github에 css파일을 올리고, 해당 주소를 입력하니 데본과 vscode동시에 적용되네요.

    다시 한번 감사드립니다.
  10. 아마테리스 · · 공감 1
    @케이K님 이렇게 또 comment 남겨주셔서 감사합니다~ 맥당에서는 도움만 받고 지낸거 같은데 이렇게 도움이 되다니 기쁘네요 ^^
  11. 케이K ·
    @아마테리스님 저도 도움만 받아서 부끄럽습니다^^
    데본 마크다운을 쓰면서 한 가지 알게 된 것은...
    데본에서 지원하는 마크다운 언어는 multimarkdown인 것 같네요.
    GFM에 익숙해져 있는 가운데 가끔 안먹히는 문법이 있었는데 사용되는 언어가 달라서 였네요;;
  12. 어석 ·
    데본 찾다가 오래전 글 보게되었네요.
    저는 데본에다가 올려두고 copy to file link 형태로 붙여서 사용합니다.
    Global 은 항상 싱크에 둬서 큰 문제 없이 연동해서 사용하는 거 같아요.

MaClien 최근 글

MaClien 목록 더 보기