File Under: Programming

VI Tutorial for Beginners

So you’ve graduated from webmonkey to mobile webmonkey. The good news is, you’ll be able to build Web sites for fun or profit nearly anywhere. The bad news is that no two computers are alike, so there’s no guarantee that your next location will have the HomeSite/CuteFTP or BBEdit/Fetch combo you’re used to.

Face it:You may not always be able to work in your usual comfortable environment. You may be someplace where your text editor won’t load, there’s no mouse, or you’re faced with a PC and you’re a diehard Mac user. How do you maintain your mobility without dragging your own computer with you everywhere? Learn a Unix text editor. You’ll be able to work with aplomb in a wide variety of situations – virtually anywhere, on any machine – and move on to a new level of Unix godliness.

There are three commonly used Unix text editors – pico, emacs, and vi. This week, I’ll walk you through the basics of vi.

Pronounced “vee-eye,” vi is a visual text editor for Unix, which means you can see the document you’re editing or adding to, and it’s the default editor for Unix systems. Since most telnet interfaces start off in a Unix shell, you can open and edit files without having to send them to your desktop and then back to the machine where they reside.

There are several things vi has going for it:Since it’s the default on most Unix systems, it’s ubiquitous. It’s also small, fast, extremely powerful, and keyboard-based. If you’re working with a slow connection or on a portable machine with no mouse and very little system memory, you’ll still be able to create and edit files with ease.

Contents

  1. Getting Started
  2. Moving Around
  3. Deleting Text
  4. Replacing Text
  5. Adding Text
  6. Undoing Mistakes
  7. Your Turn

Getting Started

Once you’re in a Unix shell, opening a file in vi is as easy as typing the command vi and the name of the file. Let’s say I want to open up the file commands.html, which is a list in HTML of vi commands. The file lives in my home directory (which is monkey:/usr/diva/), where I do all my Unix experimenting. After making sure I was in that directory, I’d type the following:

'''monkey:/usr/diva/>''' vi commands.html

and the file would be opened.

This is what I would see on the screen:


 <HTML>



 <HEAD><TITLE>vi is fun!</TITLE>



 </HEAD>







 <BODY bgcolor="#FFFFFF" text="#0000CC" link="#CC0000" vlink="#000000">





 This is a list of the crucial keys in vi.



 Remember:the escape key is your friend.



 O means to go into insert tect mode one character to the right



 r means to replace something



 x means to delete something



 x means to delete something



 E means to revert to the last saved version



 i means to insert text. This is what we use to begin typing



 these four keys are used in edit mode:h j k l



 w means to overwrite the last version



 q means to quit without changing anything



 </BODY>



 </HTML>







 "commands.html" 18 lines, 295 characters



Moving Around

You’ve got the file, now how do you edit it? Look a little more closely:The command prompt is probably highlighting the first character of the file. I’m going to move it down to “friend.” Here’s what it looks like again:


 <HTML>



 <HEAD><TITLE>vi is fun!</TITLE>

 </HEAD>



 <BODY bgcolor="#FFFFFF" text="#0000CC" link="#CC0000" vlink="#000000">



 This is a list of the crucial keys in vi.



 Remember:the escape key is your friend.



 O means to go into insert tect mode one character to the right



 r means to replace something



 x means to delete something



 x means to delete something



 E means to revert to the last saved version



 I means to insert text. This is what we use to begin typing



 these four keys are used in edit mode:h j k l



 w means to overwrite the last version



 q means to quit without changing anything



 </BODY>



 </HTML>







 "commands.html" 18 lines, 295 characters

You can move a vi prompt one of two ways:Use the arrow keys or use four letter keys in the keyboard. I recommend learning how to use the letter keys:It’s faster, and it doesn’t rely on a “properly” set terminal like the arrow keys do. So, using the arrow keys, we can move the cursor in four different directions:

  • to move down:press j
  • to move up:press k
  • to move to the left:press h
  • to move to the right:press l

You will have to tap each key for the number of lines or characters you want the cursor to move. In this case, I want to move down seven lines and then to the right. So I would hit j seven times, and hold down the l key until I got to the word “friend.”

Not every file you’re going to work in will be so small; some will be a couple hundred lines long. If you look at the last line of our file, you’ll see that the editor tells you how many lines there are in the file. If you want to jump down, you can type :(line number), where the line number is the actual numeral. So if I wanted to jump down to line 16 (the line beginning with “q”), I’d type:

:16

hit Enter, and there I’d be.

Deleting Text

The next thing I’m going to do is move back up from line 16 and delete an extra line of text. There’s a duplicate line reading “x means to delete something,” and I’ve decided it must go.

First, I’d move back up to that line, typing k until I got there. You can delete text one character at a time simply by pressing x. The character that gets deleted will be the one the cursor highlights.

If that seems too tedious, you can type dw, and delete the text a word at a time. Note that vi counts the spaces in between words as words too, so I’d have to type dw nine times to delete the line.

Or you can just wipe out the entire line of text. To do that, just type dd. Since this is the fastest way to do it, I’m going to type:

dd

and the line that my cursor sits in is gone.

Replacing Text

By now, my file looks like this:

 <HTML>

 <HEAD><TITLE>vi is fun!</TITLE>



 </HEAD>





 <BODY bgcolor="#FFFFFF" text="#0000CC" link="#CC0000" vlink="#000000">



 This is a list of the crucial keys in vi.



 Remember:the escape key is your friend.



 O means to go into insert tect mode one character to the right



 r means to replace something



 x means to delete something



 E means to revert to the last saved version



 i means to insert text. This is what we use to begin typing



 these four keys are used in edit mode:h j k l



 w means to overwrite the last version



 q means to quit without changing anything



 </BODY>

 </HTML>



 "commands.html" 17 lines, 279 characters

I’ve decided that the next thing I want to do is change the misspelled word “tect” into “text.” I’d move up two lines ( k again), and then to the right ( l all the way) until the cursor was on the character c in “tect” in the following sentence:

O means to go into insert tect mode one character to the right

I’d then type r (this tells the editor I want to replace the highlighted character), and then x (to make “text”). If I wanted to change the letter c to s, I’d type r, then s. If I wanted to change it to – well, you get the picture:Type r and then the replacing character.

Adding Text

So far, we’ve been working in edit mode. In this mode, we can move around the file with impunity, deleting or replacing existing text without worry. To add text, we have to switch to the insert mode. Fortunately, this isn’t hard:Just move the cursor to the spot in the document you want to edit, hit i, and begin typing.

The first thing you should know is that vi takes the insert command rather literally. Wherever your cursor is when you hit i will be the first point at which you can begin typing. So if you’re looking at a sentence like this:

w means to overwrite the last version

and the cursor is on the v in ” overwrite,” you’re going to start inserting text where the v used to be. So if you try to type the words “saved file” you’ll end up with a sentence that looks like this:

w means to osaved fileverwrite the last version

The easiest way around it is to position the cursor where you want it before you start typing. So, if I wanted to insert the phrase “saved file” after the word last, I would hit Escape to make sure I’m out of insert mode, move the cursor to the space between “last” and “version,” hit i for insert, and type in a space and then ” saved file.”

Note:You cannot move around using the h, j, k, and l keys, or edit anything, while you’re in insert mode! To snap out of insert mode and back into edit mode, hit the Escape key. Any time I’m in vi and forget which mode I’m in (it can happen), I hit Escape before I do anything else.

Undoing Mistakes

So let’s say you haven’t quite got the hang of inserting text and you’ve just typed something very wrong. Will you have to delete all the text and start over?

Nope – if you catch your errors quickly (like, right after you make them), you can always undo them. To undo any inserted text, hit the Escape key, then type u. It will undo the last action you did.

If you’re already in edit mode, just type u to undo your last action.

Your Turn

So today we’ve gone over how to open a file in vi, move around in a file, delete and insert text, and undo errors. Do you want some more vi tricks? Take the Advanced vi Tutorial and see how to create your own files, cut and paste chunks of text, search and replace, and other fun functions.