ホーム > 開発環境 > PHPerのためのvi入門

PHPerのためのvi入門

viを使いこなしたいと思いませんか?

viを使いこなせればコーディング効率がアップします。
viのコマンドを考えずにコーディングできるようになれば最高!viは空気のような存在です。

そんなviですが、敷居が高いのも確か。
今回はPHPを題材にしてviで必須と思われるコマンドとその使い方をあげていきます。

なぜ、viか

まずは「なんで今更viなの?」という疑問に答えます。
ただし、私自身、様々なエディタを通してviにたどり着いた訳ではありません。
ですので、なぜ私がviを使うことにしたのか、使いたくなったのか、を書いておきます。

  • カッコいい
    • もう、8割ぐらいの理由がこれです。だって、ターミナル開いていろいろなコマンドを駆使しながらコーディングしている姿ってカッコいいじゃないですか。まさにハッカーです。GUIのエディタじゃ、ちょっと格好がつかない。ハッカーに憧れる人なら、こんな気持ちは持つでしょう?
  • 動作が速そう
    • ターミナル上で動いてるんだから、GUIと違って動作速度は断然、良いでしょう。コーディングは自分の頭の中を吐き出す作業だから、外部要因で止まってはいけない。エディタはキビキビ動かないといけないんです!

こんな単純な理由でviを使い始めました。

今では当初思い描いていた以上に、viは両方の欲望を叶えてくれています。

viのモード

vi入門といえば、まずはここから始まります。コマンドモードと入力モードです。

viには2種類の「モード」があります。
それぞれのモードには役割があり、これを切り替えて使います。

他にもありますが、切り替えるキーは”Esc”と”i”です。
viを開いた場合は自動的にコマンドモードになります。以下にモードの違いをまとめます。

モード できること
コマンドモード
  • カーソルの移動
  • 文字の削除
  • 文字の検索
  • 様々な編集機能
入力モード
  • 文字の挿入

viを開いて、”i”キーを押せば入力モードです。あなたの好きな文字を入力できます。

入力が終わったら、”Esc”キーを押してコマンドモードに戻します。各キーがコマンドとして認識されます。
キーを押してもファイルには入力されません。その代わりに、キーに割り当てられたコマンドが動作します。
試しに、”j”キーを押してみてください。カーソルが下に1つだけ下がります。

これがviの基本です。”Esc”と”i”を交互に押して感覚をつかんでください。
これを知らずにviを始めると、早速挫折します。なんたって、ファイルを開いても文字列を入力できないんだから!
(私はこれを理解せずにviを始めようとして2〜3度挫折しています。いくら習うより慣れろ、でも少しは調べてから始めましょうね…)

viでのコーディング作業

それでは早速コーディングに入ります。
ここでは白紙の状態からコードを書いていきます。
まずは作業ディレクトリを作り、その下に移動、viでファイルを開きます。

cd ~/
mkdir vi_project
cd vi_project
vi main.php

白紙の画面が開いたでしょうか?
環境によって違いますが、このようなイメージです。

screen01.png

ここで”i”キーを押します。そうすると入力モードになるので、どんどんコードを書いていきましょう。
今回書いたコードは以下の通り。

<?php
$persons = array(
  'John Lennon',
  'Poal MacCartnoy',
  'George Harrison',
  'Ringo Star',
);
foreach($persons as $person) {
  printf("Hello %s.\n", $person);
}

?>

余分なスペースやスペリングミスはそのままタイプしてください。
次の段階で修正します。

また、短いコードでもタイプミスはするでしょう。
そのときは何も気にせず、十字キーとバックスペースで修正してください。
慣れると入力モードとコマンドモードを行き来しながらコードを書いていくのですが、慣れないうちはこれで十分だと思います。

viでのコード修正作業

続いてコードを修正します。
コーディングしたソースコードはスペリングミスや余分なスペースがあり、美しくありません。
これをコマンドモードで修正します。

まずはスペリングミスから修正しましょう。このままではBeatlesファンに怒られてしまうので…。
スペリングミスがあるのは”Poal MacCartnoy”と”Ringo Star”です。
以下の手順で修正します。

  1. “Poal MacCartnoy”の”Mac”から”a”を取り除く。
  2. 修正された”Poal McCartnoy”の”o”を”e”に置き換える。
  3. “Ringo Star”の”r”の後ろにさらに”r”を加える。

これをviのコマンドで手順化するとこうなります。
(無駄なコマンドもありますが、練習ということでご了承ください。)

  1. “Esc”をタイプ
  2. “:”"0″をタイプ
  3. “j”をPoal MacCartnoyの行に来るまで連続タイプ
  4. “l”をMacCartnoyのaにカーソルが来るまで連続タイプ
  5. “x”をタイプ
  6. “l”をMacCartnoyのoにカーソルが来るまで連続タイプ
  7. “r”"e”をタイプ
  8. “j”をRingo Starの行に来るまで連続タイプ
  9. “l”を’Ringo Star’の最後のシングルクォーテーションに来るまで連続タイプ
  10. “i”をタイプ
  11. “r”をタイプ
  12. “Esc”をタイプ

これで修正は完了です。修正後はこのようになります。

<?php
$persons = array(
  'John Lennon',
  'Poal McCartney',
  'George Harrison',
  'Ringo Starr',
);
foreach($persons as $person) {
  printf("Hello %s.\n", $person);
}

?>

勘の良い人なら何をやったか、わかると思います。
viのコマンドには一定のルールと、GUIのショートカットキーと同じように単語の頭文字やキーボードの配置でコマンドが決められています。

今打ったコマンドの意味を以下にまとめます。

  • “Esc”
    • コマンドモードに戻る。
  • “:”"0″
    • 0行目にカーソルを移動する。
  • “j”
    • カーソルを下に移動する。
  • “l”
    • カーソルを右に移動する。
  • “r”"e”
    • カーソル位置の文字をeに置き換える。
  • “x”
    • カーソル位置の文字を1文字分、削除する
  • “i”
    • 入力モードに移る。

カーソルの移動

まずはカーソル移動系のコマンドです。ここで出てきているのは”j”(下に移動)と”l”(右に移動)だけですが、もちろん左と上にも移動できます。

移動系のコマンド

コマンド できること
h 左にカーソルを移動する。
j 下にカーソルを移動する。
k 上にカーソルを移動する。
l 右にカーソルを移動する。

これらの移動系コマンドはキーボードの位置で決められています。
このような形です。

vi_keyboard.png

viでも十字キーは使用できますが、頑張ってこのコマンドを覚えることをお勧めします。
カーソル移動をコマンドで出来ることがviの魅力の一つだからです。
手の位置を動かさずにカーソルの移動や編集が出来るのは気持ちいいですよ。
デメリットがあるとすれば、GUIでも間違ってコマンドを打ってしまうことでしょうか…(その場合は当然、jやらlやらがテキストとして入力される)。

指定された行への移動

次は、指定された行に移動するためのコマンドです。

“:”"行番号”

“:”キーを押すとexコマンドというコマンドが打てます。
exコマンドについてはググってもらうことにして、ここでは”:”と行番号を入力すると、特定の行に移動できることを覚えてください。
よく使うのは”0″(先頭)と”$”(末尾)です。
“$”は行番号と違うじゃないか!と思われるかもしれませんが、viでは”$”は末尾の行番号の代わりとして使われます。
いちいち、末尾の行番号を確認するのも面倒ですから、これは重宝します。

文字の削除

次は文字の削除です。

“x”

“x”を押すだけでカーソル位置の文字を1文字分、削除できます。
バックスペースに手を伸ばすよりも、早くタイプできるのでこれもよく使います。
手癖にしてしまってください。

文字の置き換え

次は文字の置き換えです。

“r”"置き換える文字”

“r”と”置き換える文字”をタイプするだけで、カーソル位置の文字を1文字分置き換えます。
typoしたときによく使用します。typoをtypeに直すのも”r”を使えば簡単です

viでの見栄えの調整

見栄えを調整します。先ほどのコードは最後に余分なスペースがあります。
これをコマンドで取り除きます。

  1. “Esc”キーをタイプ
  2. “j”キーで余分なスペースがある位置まで移動
  3. “d”"d”をタイプ
  4. もう一度、”d”"d”をタイプ

これだけです。これで下の2行分の余分なスペースが削除できました。

行の削除

行ごとを削除するには以下のコマンドを利用します。

“d”"d”

“d”を2度タイプすると、行の削除です。
GUIでは行を削除するために選択モードにして、バックスペースをタイプする、あるいはバックスペースを押しっぱなしにするしかありません。
しかし、viを使えばキーを2度タイプするだけで済んでしまいます。
これもviの魅力の一つです。

viでのコードの書き換え

最後にソースコードを書き換えます。”俺はジョンよりポール派だ!だからポールに先に挨拶したいんだ!”という人がいるかもしれません。
そんなときはviのカット&ペーストに相当する機能を使います。

  1. “Esc”キーをタイプ
  2. “j”キーでPoalの位置まで移動
  3. “d”"d”をタイプ
  4. “k”キーで$personsの行まで移動
  5. “p”キーをタイプ

これでJohnよりもPoalが先に来ます。

ペースト

viでペーストするには以下のコマンドを利用します。

“p”

“p”をタイプするとバッファに入った文字列がテキストにペーストされます。
バッファに文字列を入れる方法はいくつかありますが、”d”"d”の行の削除コマンドがその1つです。
削除時に入るバッファは1つだけです。つまり、最後に削除した行が”p”コマンドでペーストできます。

保存と終了

ここまでの編集を保存して終了しましょう。

保存

保存には次のコマンドを使います。

“:”"w”

終了

viを終了します。終了には次のコマンドを使います。

“:”"q”

これでviが終了して、コマンドを打ち込む画面が戻ってきたはずです。

最後に

ここまでのコマンドを覚えれば、とりあえずviを操作できるようになると思います。
viの世界はとにかく広いです。
そして、今回例としてあげた操作は、無駄が多すぎます。
viのコマンドを知り尽くせば、もっともっと早く編集できるはずです。

“とりあえずviを始めようという人”も、”viを極めたい!”という人も、次のステップに進むために、まずはオライリーのvi入門を読むと良いと思います。
この本を読まずにviを独学で始めたら大変苦労しました。

入門vi 第6版 vi入門

  • 著者: リンダラム
  • 出版社: オライリー
  • 発売日: 2002/05

私自身もviを使い始めて、1年経っていません。
まだまだ、勉強中の身です。もっともっとviのことを知りたいです。
一緒にviの世界を楽しみましょう。

[2010/09/02 追記]

viを使いたくなる良い記事を見つけました。
目を通してみてください。こんなエンジニアになりたいと思いますよ。

* ちなみにここでは全てviで統一していますが、実際に使うことが多いのはviを拡張したvimだと思います。操作はほとんど同じですが、vimはマルチビューに対応していたり、カラーリングしてくれたり、色々使い勝手の多い機能があります。
* “PHPerのための”とタイトルをつけましたが、なかなかチュートリアルを作るのが難しく、中途半端になってしまいました…。普通のvi入門じゃん!という苦情はご勘弁くださいorz

ちょっと一言

最近、毎日vimのコマンドを調べてスキルアップを目指しています。 "こんな操作出来ないかな?"って思ったらメモしてググって、スティッキーズに張りましょう。

blog comments powered by Disqus

ホーム > 開発環境 > PHPerのためのvi入門

スポンサードリンク
書いている人
つぶやき
RSS 気になるニュース
過去の記事

ページの上部に戻る