요새 바빠서 Editor 업데이트를 자주 하진 못하고 있는데 그래도 매일 조금씩 뭔가를 하려고는 한다. 어제는 Quill 에디터를 snow로 바꾸는 작업을 마무리 하려고 했다. Quill에서 제공하는 code-block이 맘에 안들어서 이거저거 만져보다가 결국 delta to html을 만드는 것으로 결정하고 마지막으로 글 하나 쓰고 자려는 참이었다. 악몽 Quill에 Syntax 모듈을 적용하면서 겪은 일을 아주 소상히 적고 있었다. 예까지 들어가며 아주 소상히. 그러다 아무 생각없이 마우스로 왼쪽 글 리스트에서 글 하나를 클릭했다. 무슨 일이 벌어졌을까? 당연히 쓰던거 다 사라지고 선택한 글이 뷰어에 표시됐다. 그렇게 저렇게 빼곡히 쓴 글이 날아갔다. 되돌릴 방법이 없다는 것은 내가 제일 잘 알고 있..

TistoryEditor를 만들기 위해서는 html to markdown, markdown to html 변환을 해야한다. tistory api에서 당연하게도 content를 html로 주기 때문이다. 그래서 수정을 하려고 할때는 markdown으로 변환하고 다시 저장할 때는 html로 변환해야한다. makrdown to html markdown을 html로 변환하는 것은 수요가 많기도 하겠고, markdown의 규칙이 그리 어렵지 않아서 그런지 많은 라이브러리가 있다. 그 중에 제일 사용자가 많아보이는 marked를 사용하기로 했다. 이전에 티스토리에 markdown으로 글쓰려고 만든 툴에서도 이걸 쓰기도 했고 benchmark에서 가장 빠르다고 한다. (더 빠른 것으로 보이는 robotskirt는 C..

TistoryEditor가 거의 끝나간다. 쓸만해지니 어서 패키징해서 배포를 해보고 싶어졌다. 예전에 electron-packager로 한번 해봤는데 여러가지 설정을 추가로 해줘야해서 electron-builder를 써보기로 했다. get started 설정을 하는거나 시작하는건 packager에 비해서 쉽다. 일단 여러가지 옵션을 쓰지 않고 build만 실행하면 OS에 맞는 버전으로 빌드를 해준다. 다른 OS용 빌드를 할때만 옵션을 준다. 그리고 가장 좋았던 것은 앱 아이콘을 /build에 넣어두기만 하면되고 asar도 기본 옵션으로 들어가 있다. 맥의 경우는 dmg파일도 만들어주고 리눅스의 경우는 deb, rpm도 만들어준다. packager보다 이런 부분에서는 정말 좋은 것 같다. 그 외에도 기본 ..

티스토리에 markdown으로 글을 쓰기 위해 만든 에디터에 material-ui를 적용해보았다. material-ui는 react용으로 material.io에 정의된 component를 구현해놓은 것이다. meterial design light로 직접 만들어도 되겠지만 이미 잘 만들어진 것이 있는데 굳이 내가 또 만들 필요는 없다. (하지만 결국 typography 때문에 mdl도 import했다 ;;) 설정 Get started에 사용법은 잘 설명이 되어 있어 간단히 정리해보자면 material-ui, react-tab-event-plugin를 npm으로 설치하고 App을 MuiThemeProvider로 감싸주면 준비가 완료된다. react-tab-event-plugin은 onTouchTap이벤트를 ..

Electron은 오래전부터 알고 있었다. github에서 atom을 만들때 사용한 플랫폼을 공개한 것이다. nodejs에 그리 관심이 크진 않아서 무시하고 있었는데 한동안 react를 사용하다보니 자연스레 node에도 다시 관심이 생기고 그러다보니 electron에도 다시 관심이 생겼다. 시작 일단 시작은 몹시 쉽다.npm install --save electron으로 모듈을 불러오고 app을 위한 코드만 만들어두면 데스크탑앱이 떡하니 뜬다. 사실 처음 보이는 모습은 무슨 브라우저 같다. 예제가 'Hello, world!'를 말하는 index.html을 불러오는 거라 더 그렇다. 하지만 나에겐 react가 있지. 그리고 미리 만들어둔 editor 비스므레한 코드도 있다. 코드를 그대로 가..