Atomを試してみることにした

１．長いはじめに：テキストを書くために

　大学ではレポートや論文やレジュメを作る機会がたくさんあるが、ではそのためのテキストを打っていくとき、何で作るかは考えるところだ。

　とにかく、文章を整理して打つことが出来て、その気になれば表や図を載せることができて、思うようなレイアウトで印刷できることが必須となる。別にデザイナーになりたいわけではないのでシンプルでいい。

　Microsoft OfficeのWordでええやんけとなるが、これがそうもいかない。Wordのデメリットをいくつか挙げる。

• Wordにはバージョンがあり古いバージョンの文書を新しいもので読み込めなかったり、レイアウトが変わったりしてしまう危険がある。
• そもそもOfficeを導入するのにはお金がかかる。デフォルトでOfficeが入っているSurfaceを買うにしても最近高いし。（まあ既にSurfaceは持っているのだが）
• 僕は文章の半分をiPadで書いているのだけれど、11インチ以上のタブレットを使う場合、Office365でないといけなくなった。365には永久ライセンスという概念が無く、月額あるいは年額の支払いが発生する。学生でいる間は大学のアカウントで登録出来るので無料で使用できるが、あと1年の命である。
• 印刷や原稿の最終チェック、がっつり腰を据えて書きたいときの固定砲台として使っているSurface3くんの調子が数年前からよくない。具体的にいえば、Wordがたまに落ちる。1時間かけて書いた数千字の文章が消えてしまった...みたいなことが何度かあった。今思い出しても殺意が沸いてくる。

　ということで、テキストエディタとしてWordは使いたくない。だとしたら、代わりを探さないといけない。できれば、先ほど挙げたWordの問題をクリアできるような。

　Microsoft Officeのパチモンみたいなもの（失礼）としてGoogleのオフィス系サービスや、高校生の時お世話になっていたOpen office、最近だったらき企業でもよく使うWPSやKINGSOFTなんかがある。

　まあ、正直それだっていつまで使えるか分からない。互換性が確保されていないと中々使いづらいところではある。

　なので、学部の途中から、Markdownを使っている。Markdownエディタは結構軽くてて使いやすいのも多いし、色々試しながら使っている。はてなを始めたのも、元々Markdown記法で投稿ができるからだ。この文章もMarkdown記法で書いている。使いやすさは微妙だが。

　Markdownファイルは全て、DropboxかGoogle Driveで共有して、各デバイスからアクセスできるようにしている。Google Driveは大学のおかげで容量を気にする必要が無いので、バックアップの一手段として用いる。

　iPadでは「1Writer」を使ってDropboxからアクセスできるようにしている。Dropboxは頻繁にアクセスするため、今受けている講義のレジュメや論文を放り込んでいる。iPad用のエディタは色々試したが、今のところこれが一番だと思う。

　問題はノートパソコンの方。学部生のころは「Haroopad」を使っていたが、なんというかデザインが合わなかった。大学院に入ってからは「Typora」を使っている。シンプルで使いやすい。htmlも打ち込めるので、細かなレイアウトの変更もそれなりに効く。

２．Atomに手を出してみる

　だったのだが、最近そろそろプログラミング言語を勉強した方が良いんじゃないか、という気持ちが出てきた。将来、自分が就くであろう職業を考えるとおそらく必要になるかもしれない、という見立てが半分、「なんかかっこええやん」という気持ちが半分。

　んで、とりあえずMarkdownで書くこともできつつ、気が向いたときに各プログラミング言語に触ることができそうなAtomをインストールしてみた。とりあえず、色々設定をいじって、パッケージをインストールして、Markdownで書くのに支障のない環境だけは作り上げた。

いい感じ

３．Markdownからpdfへ：いい感じのレイアウトの文書をつくるために

　AtomをMarkdownエディタとして整えたのはいいが、レジュメを印刷しようと思うとうまいこといかなかった。

　パッケージの「markdown-pdf」を試したが文字が小さすぎる。色々調べても（と言っても日本語の範囲でだが）どうやってうまいこと設定したらいいかが出てこない。

　こうなれば、「markdown-preview」をいじる方が速そうだ。

AtomエディタのMarkdown PreviewのCSSを実務書類的に調整する

　この記事のをstylesheetにコピペし、フォントや余白設定などをいじいじする。

いじいじ

pdfにしたときのレイアウトを見ながら、以下のように変更した。

.markdown-preview.markdown-preview {
  @c_border: #666; // border-color

  max-width: 900px;
  margin: 0 auto;
  padding: 30px;
  color: black;
  font-size: 13px;
  font-family: 'Meiryo';
  hr {
    margin: 50px 0;
    background-color: transparent;
    &:after{
      content: "";
      display: block;
      border-top-style: ridge;
    }
    &.pb {
      // <hr class="pb">を入れる事で、
      // プリント時の改ページを指定することができる。
      page-break-after: always;
      &:after {
        display: none;
      }
    }
  }
  h1, h2 {
    font-family: 'Meiryo';
    font-weight: normal;
    border-color: @c_border;
  }
  h3, h4, h5, h6 {
    font-family: 'Meiryo';
    font-weight: normal;
  }
  h1 {
    font-size: 17px;
    border: none;
    margin: 10px auto;
    text-align: center;
    letter-spacing: 4px
  }
  h2 {
    font-size: 15px;
    letter-spacing: 2px;
    margin: 10px auto 7px;
  }
  h3 {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 7px
  }
  h4 {
    font-size: 14px;
    margin-bottom: 8px
  }
  h5 {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 5px
  }
  h6 {
    font-size: 14px;
    margin-bottom: 5px
  }

  // 見出し以外のタグを字下げする
  // ぱっと思いつく、よく使うタグを指定
  p, table, ul, ol, dl, pre, blockquote {
    margin-left: 10px;
    ul, ol, dl {
      margin-left: 0px;
    }
  }
  table {
    border-collapse: collapse;
    border-spacing: 0;
    max-width: 800px;
    th {
      text-align: center;
      background-color: #eee;
      border-color: @c_border;
    }
    tr {
      border-top: #666;
    }
    td {
      border-color: @c_border;
    }
  }
  .margin-clear {
    margin-left: 0;
  }
  // テキストの中央揃え
  .center {
    text-align: center;
    &:extend(.margin-clear);
  }
  // テキストの右寄せ
  .right {
    text-align: right;
    &:extend(.margin-clear);
  }
}

　htmlに出力して、pdf印刷の画面を表示してみる。

印刷

　なかなかいい感じのレイアウトになった。あとは、pagebreakのタイミングとかが、previewの時点で分かればいいのだけれど...