初心者Vimmerによるvim+rails開発

5,697 views
5,693 views

Published on

社内勉強会で発表した内容です。

Published in: Technology
0 Comments
11 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
5,697
On SlideShare
0
From Embeds
0
Number of Embeds
10
Actions
Shares
0
Downloads
9
Comments
0
Likes
11
Embeds 0
No embeds

No notes for slide

初心者Vimmerによるvim+rails開発

  1. 1. 初心者Vimmerによる Vim + Rails開発 開発Gr. 菊池大輔 @d_hero
  2. 2. この勉強会の内容 • Vimってどんなエディタ? • Vimで便利なPlugin(主にRailsで)
  3. 3. このテーマのきっかけ その1 • 弊社のデザイナー I さん 「菊池さん、そのエディタ、 使いづらそっ すね!」 そう思ってた時期が僕にもありまし た。。。 でもちょっと待ってくれ!
  4. 4. このテーマのきっかけ その2 • パートナー I 社のFさん 菊池 「コマンドで、ぱぱっと開けるんです よー」 Fさん 「・・・ファッ!!?」
  5. 5. Vimとは • 「Vi」から派生したテキストエディタ – Vi:VIsual editor、Visual Interface • マウスを使わない! • カーソルキーを使わない! • コマンドによってテキスト編集を行う – Vim • 最初は「Vi IMitation(Viの模倣)」 • 後に「Vi IMproved(Viの改良)」
  6. 6. ViとVimの違い 設定ファイルを編集して自分好みに! • 「~/.vimrc」に書きこむ – 各種Pluginを導入可能! – キーマップの指定が可能! – 文字色を変更可能! • 「カラースキーマ」の導入
  7. 7. Vimを使うには • UNIX系OS – 「vi 」か「vim」コマンドを打つだけ。 • Windows – 仮想マシンでUNIX系OSを使う(僕はこ れ) • vagrantを使ってちゃちゃっと用意 – GVim • GUI用のVim
  8. 8. Vimの画面
  9. 9. 文字色を変えると・・・
  10. 10. Vimの「モード」 コマンドモード (起動時はここ) ESC i, a, o等 挿入モード 普通の入力 I等 行ごとのコピー 削除等 ESC v, V等 ビジュアルモー ド 切り取り、コピー
  11. 11. テキストを書き始めるには • コマンドモードで、以下のコマンド (挿入モードに移動) – i: カーソル位置から入力開始 – a:カーソル位置の後から入力開始 – o:1行挿入して、その行から入力開始 – R:上書き開始 • 挿入モードからコマンドモードに戻 る – ESCキー
  12. 12. カット、コピー、ペースト コマンドモードで • x: 入力位置の1文字切り取り • dd: 1行切り取り • yy:1行コピー • D:入力位置以降の切り取り • p:貼り付け [数字]x, [数字]dd, [数字]yyで、 複数文字、行で編集可能
  13. 13. コマンドモードで出来るこ と • u:アンドゥ • Ctrl+R:リドゥ • 全文検索 – 「/(スラッシュ)文字列」で • 保存、vimの終了 – 「:w」で保存 – 「:q」で終了(「:q!」で保存せず 強制終了) – 「:wq」で保存して終了(ZZでも可)
  14. 14. カーソルの移動 • コマンドモード、ビジュアルモード • カーソルキーも使える、けど・・・ 右手のホームポジションから 動かさなくてよい! 上:k 左:h 「^」、「$」:行頭、行末 下:j [数字]+[コマンド]で その数だけ移動 右:l(エル)
  15. 15. ビジュアルモード マウスのドラッグで選択するのと同じ 機能 • v:領域選択 • V:行選択 • Ctrl-V:矩形選択 選択した後 • d:切り取り • y:コピー
  16. 16. 他に・・・ • :new ファイル名 – 新しいウィンドウを開く!(水平方向) • :vnew ファイル名 – 新しいウィンドウを開く!(垂直方向) • Ctrl-wの後にk,j,h,l(エル)のいずれか – 上下左右のウィンドウへの移動 • 他のファイルを見ながらの編集が可 能
  17. 17. ウィンドウを開いた画面 Ctrl+wの後に j(下)入力
  18. 18. タブ機能 • :tabnew ファイル名 – 新しいタブでファイルを編集する • [数字]gtで、指定した番号のタブに移 動
  19. 19. タブの画面 1gtで移動 2gtで移動
  20. 20. メリットとデメリット • メリット – キーボードだけで編集が完結する – 慣れると編集が速くなる・・・かも。 • デメリット – 他のエディタで操作を間違う危険性 • 編集が終わってESCキーを押す (Excelのセルの修正が飛ぶ) • 保存しようとして「:w」と入力、など
  21. 21. Railsによる開発をするため に • VimにPluginを導入する! – ディレクトリツリーを表示 – 特定のモデルを指定して表示 • Pluginを管理するPlugin – vundler
  22. 22. vundlerのインストール • gitでcloneするだけ git clone https://gitbub.com/gmarik/vundle.git ~/.vim/vundle.git
  23. 23. 設定ファイルの編集 • 「~/.vimrc」に記述 filetype off set rtp+=~/.vim/vundle.git/ call vundle#rc() Bundle 'gmarik/vundle' Bundle 'tpope/vim-rails‘ filetype plugin indent on vundler 初期化 インストール するPlugin
  24. 24. Bundleコマンド • Bundle 'tpope/vim-rails‘ – Github上のリポジトリから取得 • Bundle ‘dbext.vim’ – vim-scripts上のリポジトリから取得 • Bundle ‘git://repository_url’ – それ以外のgitリポジトリから取得
  25. 25. Pluginのインストール • インストール – Vimを開いて「:BundleInstall」コマン ド実行 • 再インストール – 「:BundleInstall!」コマンド実行
  26. 26. Rails開発で使えるPlugin • rails.vim – MVC間を簡単に行き来する • unite-rails – 一覧表示をさせる • The-NERD-tree – ソースツリーを表示
  27. 27. rails.vim • .vimrcで「Bundle ‘tpope/vim-rails’」 • vimでrails開発をする、といったらコ レ! • controllerのアクションの場所で「: R」 – 関連するビューを開く • 「:Rmodel [モデル名]」 • 「:Rview [ビューのパス]」
  28. 28. unite-rails • ファイルを一覧表示&絞り込みしてく れる • 「:Unite rails/model」 • 「:Unite rails/controller」 • 「:Unite rails/view」 などなど
  29. 29. unite-railsの画面
  30. 30. The-NERD-tree • 「:NERDTree」コマンド – ソースツリーを表示
  31. 31. キーマップを変えておく • 「:Rmodel」 → 「:Rm」 • 「:NERDTree」 → 「:Rt」 • 「:Unite rails/model」 → Ctrl-Hを2回 入力 良く使うコマンドを簡単にしておくこと で、 更に効率が高まる!
  32. 32. その他にも • Vim上でGitと連携 – 「git status」や「git-blame」を見やすく – Vimからコミットもできる! • 入力補完 – 入力途中に候補を出す
  33. 33. まとめ • Vimのコマンドを覚えるのはちょっと 大変 – 作業効率面では良いのでは – 自分好みにカスタムしよう!! • Railsでの開発のための機能 – Pluginを入れる毎に新しい世界が。。。
  34. 34. ご静聴ありがとうございま した。

×