Visual studio code 를 markdown 에디터로 사용해 보자

visual studio code

비주얼 스튜디오 코드는 마이크로소프트에서 개발한 chrome 기반의 코드 에디터이다. 

가볍고, 플러그인 개발이 쉬운 장점이 있으며 마이크로소프트의 지원을 받고 있다는 장점이 있다.

링크

Visual Studio Code

마크다운 문서를 편집할 때 결과물이 어떻게 보일 것인지 확인하면서 작성하면 편한데, 비주얼 스튜디오 코드 1.9 버전에서 Sync Markdown Preview 기능을 지원하게 됨으로써 특별히 플러그인을 깔지 않아도 마크다운 문서가 변경될 때 마다 Preview 를 동기화하여 실시간으로 보여주는 기능이 추가되었다. 한번 사용해 보자.

화면 오른쪽 상단에 Open Preview 버튼을 누른다. 

그러면 Preview 가 열린다. 

이제 Preview 가 열린 탭을 VS code 창의 오른쪽 끝 쪽까지 드래그 하면 화면을 분할하여 사용할 수 있게 된다. 

짠

Copy Markdown as HTML : HTML 로 변환하기

작성한 마크다운 문서를 HTML 로 변환해야 할 필요가 있을 때가 있다. 가령, 티스토리 블로그에 마크다운으로 문서를 작성하고 싶을 때, 티스토리는 마크다운 문법으로 게시글을 쓰는것은 지원하지 않지만 HTML 편집을 지원 하므로 그러한 기능은 매우 유용할 것이다.

다음과 같이 플러그인을 설치한다.

위 플러그인을 설치하고 VS code 를 껏다 켠다. 

그리고 F1 을 눌러 바로가기 검색창을 열고 mark 나 copy 를 치게 되면 위와 같이 Markdown : Copy as HTML 항목이 보일 것이다. 

이것을 선택하게 되면 클립보드에 html 코드가 저장되게 되는데, 붙여넣고 싶은 곳에 가서 Ctrl + V 를 눌러주게 되면 ... 

위와 같이 Markdown 이 HTML 로 변환된 코드가 붙여넣어짐을 확인할 수 있다.