こたつの勉強メモ

現役無職の技術勉強メモ

Atomを導入

エディタを変更しよう

今までサクラエディタ秀丸を使っていたのですが、 せっかくだから他のテキストエディタも利用してみようと思い検索。 開発は主にVisualStudioかStyleNote5を利用していました。
IDEを使っていたので主にサクラエディタはdiff取るのとGrep検索にしか使ってなかったです…。
サクラエディタ、かわいいし使いやすいんですがちょっとやっぱり前職を思い出すので違うのを導入してみたいと思います。

ATOMを使ってみよう

私が求めるのは以下の通り

  • 動作が軽い
  • grep検索が使える
  • ハイライト機能がある
  • diffが使える
  • ショートカットキーが登録できる
  • 前職で使っていない

検索した結果、ATOMというのが人気らしいので、今回はこれを導入してみます。
GitHubが開発したWEB開発者向けのエディターらしいです。
ATOMも若干重いかな…?どうかな?という感じなので開発のメインはATOMで、ちょっとしたメモはサクラエディタで、という形で落ち着きそうです。

ATOMのインストールと各種プラグイン

f:id:hansna:20180913082442p:plain ATOMは可愛い

インストールは簡単、インストーラダウンロードして起動するだけ。

  1. 日本語化 `file -> setting -> Install ->Japaneseで検索 -> japanese-menuをInstall ->日本語化完了

  2. フォントを変更 `ファイル -> 設定 -> エディタ設定 -> フォントにフォント名を入力 ※私は無難にRictyDiminishedゆたぽんが好きです。ゆたぽんかわいい。

  3. テーマを変更する 今回は人気のmonokaiを設定。
    やっぱり背景は黒字に白系文字が一番見やすい気がする…
    ファイル -> インストール -> テーマに変更し、検索
    ファイル ->テーマ -> インストールしたテーマをシンタックステーマからmonokaiを選択

  4. プラグインを設定する 基本的に、ファイル -> インストール -> パッケージ検索 -> インストールボタン押下

    1. show-ideographic-space【全角スペースをはっきりさせる】
      • 全角スペースは使いたくないけどたまに紛れ込むので…
    2. file-icons【ファイルアイコンを表示】
      • ツリー形式で表示されるのは便利なのですがパット見だと拡張子わからないのでアイコン変更
    3. highlight-selected【選んだ単語がハイライトされる】
      • これ便利ですよね。VisualStudioみたい。
    4. autocomplete-paths【パスのオートコンプリート】
    5. open recent【最近開いたファイルのメニューを追加する】
    6. dotinstall-pane【ドットインストールATOM上で開ける】
      • これ便利!ブラウザとATOMを横に並べて…をしなくて済む
    7. color-picker【カラーピッカーを表示】
      • VisualStudioにも欲しい機能…
    8. pigments【指定した色で表示される】
      • CSSとか書く時に便利そう。156,11,20とかが何色かがすぐに分かる
    9. tag【閉じタグを自動挿入】
      • あんまり楽するのもアレかなあ…と思いつつあると便利なやつ 1.highlight-column【インデント補正】
      • インデント揃えるのは大事 1.atom-beautify【字下げ補正】
      • ソースのきれいさは保守のしやすさ

他にもいろいろあるけどひとまず上記を導入。
こういうプラグイン(パッケージ)探すのって楽しい。

Atomで何する?

本題ですが、ひとまずHTMLを復習をしたいと思います。
ASP.NETJSPPHPの簡単な修正作業を通じてHTML、CSSJavascriptは触ったことはあるのですが、イマイチこれで正しいの…? という書き方なので、ドットインストールを中心にHTML,CSSJavascriptの復習を行います。
その後、RubyPHPで簡単ななにかを作りたい…Ruby on RailsスクレイピングPHPでGoogleAPIで画像から文字の抜き出しの簡単なコピペはやりましたが、 イマイチ書き方とか分かってないのでこれを期に勉強します。