Skip to content

Instantly share code, notes, and snippets.

@gappy-jp
Last active August 29, 2015 14:10
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save gappy-jp/ed8330d42b37bd1d91e9 to your computer and use it in GitHub Desktop.
Save gappy-jp/ed8330d42b37bd1d91e9 to your computer and use it in GitHub Desktop.
Markdown記法のススメ with Sublime Text

Markdown記法のススメ with Sublime Text

社内アドベント3日目担当のものです。

私が社内用資料作成時等に使用しているMarkdownについて、
環境導入~Markdown入門までに私が使用した資料を、まとめてみました。

あくまで資料をまとめただけですので、stfuawscの意義には反していますが、
導入した後に、みなさんもMarkdownでstfuawsc!すればいいかと。

これを機にみなさんにも使ってもらえるようになるといいなー
それでは始めます

なぜMarkdown

  • Wordとか不要
    • メモ帳でも編集可
    • だから軽い
  • 綺麗
    • HTMLはCSSのおかげで綺麗に
    • Sulbime Textなら専用のカラースキームを導入すると綺麗に
  • HTMLの軽量マークアップ言語
    • 読みやすい書きやすい
    • 簡単にHTMLファイル作れるよ
  • Webコンテンツとの親和性
    • GistとかQiitaとかはてなブログとかでもMarkdown記法!
    • この記事もMarkdownで書いてます

Markdown記法を学ぼう

1年近く使っていて大体のことは以下の3つで済む

記法 Markdown HTML
見出し # <h○> (#の数だけ数字が上がる)
改行 (半角スペース2つ) <BR>
リスト *(+半角スペース) <dl><dt></dt></dl>

その他の細かい記法については以下を見るといいかも

http://qiita.com/Qiita/items/c686397e4a0f4f11683d

Sublime Textとは?

超リッチなテキストエディタ
プラグイン入れればやりたいことなんでもできますよ
(簡単なコンパイルとかも)

簡単な紹介はこちら↓

http://liginc.co.jp/designer/archives/6774

Sublime TextでMarkdownしてみよう

Sublime TextでMarkdownしたらこんなに便利

  • 編集しやすいカラーに
    • Markdown Extendedを導入とかで
  • HTMLのプレビューが簡単
    • Alt+mで一発
  • CSSできれいなHTML作成
    • Ctrl + B で一発作成
    • github.cssできれいなhtmlファイルを

こんな感じで編集してます WS000005.JPG

Sublime Textを導入~Markdownできるようになるまで

以下の通りに進めれば楽

http://sonoshou.hatenablog.jp/entry/2013/12/20/Sublime_Text_%E3%81%A7_Markdown%EF%BC%8E

出来た!

所感

  • 社内の議事録とかメモレベルのものは勝手にMarkdownでメモして、HTMLを共有するようにしてます!

    • Sublimeの使いやすさも相まって編集もしやすいです
    • 出来上がったファイルは軽いし、綺麗だし、環境依存しないのもいい!
  • そういう文化がうちの会社にも根付くといいですね!

こちらからは以上です。
明日はntk1000さんです。
今日に続いてMarkdown関連のエントリーなので私も楽しみですぅー

参考

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment