Intro to VI Text Edior
In this lesson you will learn all about vi / vim. I will give you
a breif background and show you some basic commands. Then we will use
vi text editor to create a PHP Hello World program.
If you do not have a Linux environment set up,
visit: Setting up LAMP Lessons
Vi is a powerful text editor that was written for Unix. In 1976 Bill Joy wrote the first version.
Vim is like an upgraded version of vi. Most Unix family operating systems come standard with vim. Vi has evolved and improved a lot since 1976.
Many programmers, including myself, say 'vi', but mean the modern improved
version (vim).
The terms 'vi' and 'vim' are like the terms 'burger' and
'cheese burger'. If your buddy says "I am going to a get a burger",
he may be getting his burger with cheese. In fact, I have
found people usually do get cheese on their "burger". But, if your
buddy says, "I am going to get a cheese burger", he is surely intending
to order a burger with cheese.
If someone says
'vim' they mean 'vim'. If someone says 'vi', they are also probably
talking about vim (unless it is an old story).
Power up your VirtualBoxes (VMs or computer) and get ready to learn about vi!
To open or create a new file in your current directory type vi followed by the file name, like this:
➼ ~ - If
you see a ~ before the $
you know you are in your home directory.
➼ vi - the application we are using
➼ performance_reviews.php - If no file named
performance_reviews.php exits in your home directory,
you will create one and open it with vi. If performance_reviews.php does
exists in your home directory, you will open it with vi and be able to
modify the file.
Remember to use ls to see what is in your directory. To learn more basic Linux commands that will be used in this lesson, visit Intro to Linux.
Today we are going to create a file called cherry.php. Using vi, we write PHP code to display "Hello World! Good-bye Cherry!". Where do you want to put it?
Do you remember the deleting the Apache default page? /var/www/html is where we want it. As long as it is somewhere in that directory (including subdirectories), we will be able to to see our applications in the web browser.
Let's go to /var/www/html
$ cd /var/www/html
Next, let's create a directory named projects We will put all of our work in that directory.
$ mkdir projects
Change to the projects directory
$ cd projects
Now that we are there, let's create our file!
To create a file named cherry.php:
$ vi cherry.php
There are two modes:
1. insert mode (i)
2. command mode (esc)
insert mode allows you to edit the file.
To enter insert mode type: i
Once in insert mode, you will be able to type inside the document.
command mode allows you to type commands.
To go back to command mode press the escape key:
esc
While in command mode, you will be able to execute commands such
as saving a file or exiting the application.
You may want to save and continue editing or save and quit. Either way, first make sure you are in command mode.
If you type ZZ while in command mode, you will save the file and exit vi.
If you type :w while in command mode, you will save the file and you WILL NOT close vi. Remember to type i to go back to insert mode.
To quit without saving the file, while in command mode type: q!
Command Mode
When you are
in command mode, you can move the cursor by typing
the keys list below.
Insert Mode
If you are in insert mode, you can move the cursor around
using your arrow keys.
Command Mode
Move the cursor directly below the character you
want to delete, then type x
In the picture above, the cursor is under the
first
'a'.
If you want to delete more than one character (in command mode),
enter the number
of characters you want to delete followed up x. So, if you want
to delete 4 characters you would type
4x.
Look at the image above. If you wanted to delete all 9 numbers,
you would place the curser below the 1 then type
9x
Here are some other useful deleting commands:
You can add a number before each of the above commands to
delete multiple lines, rows ect.
Insert Mode
Put the cursor under what character you want to delete and
press the delete button.
Command Mode
u - undo last edit
U - undo all edits option
the line.
Command Mode
REPLACE CHARACTER (r)
✶ Place the cursor on the character you want to replace.
✶ Type r .
✶ Type the new character.
REPLACE WORD (cw)
✶ Place the cursor on the first letter of the word
you want to replace.
✶ Type cw .
✶ The last character of your selected word should turn into
$
✶ You will automatically be brought back to insert mode
and will be able to type the new word.
When you are done typing, you will remain in insert
mode until you press the esc
button.
REPLACE LINE (C)
✶ Place the curser on the first charcter of the line that
you want deleted.
✶ Type a capital C
✶ Type the new text
✶ press esc button.
Command Mode
Select Text:
1) Place the curser under the first character you want to
copy.
2) Character: v
Single Line: V
Code block / Multiple Lines: Ctrl + v
3) move the cursor until all the code you want is selected.
Copy:
y
Cut:
y
Paste:
1) Place the curor where you want paste.
2) To paste before the cursor: P
3) To paste after the cursor: p
a Append text (after the cursor )
A A Append text (end of line)
I Insert before the first line
that isn't blank
o Insert text into a new line below
the cursor
O Insert text into a new line above
the cursor
X Delete before the curser
x Delete after the curser
If you have a Linux environment set up, preform these tasks in Linux. If you do not have a Linux environment set up, you can follow my tutorials to install Oracle VirtualBox, Ubuntu and Apach + MySQL + PHP. To view your code in the web browser visit Delete the Apache Default Page
Background: You were just hired to write and maintain
a programming blog.
Assignment: Your boss has given you a list of tasks.
Complete each task using VI / VIM text editor.
Tasks:
1) Create a directory called Practice.
Put Practice in this directory: /var/www/html/projects
2) Inside the Practice directory (/var/www/html/projects/practice)
create a file named blog_1
3) Using vi, write a paragraph about either why you love coding or why
you want to learn code.
4) ONLY USE COMMAND MODE NAVIGATION! Do not use your
arrow keys.
5) After you write the paragraph, proofread and edit it in command mode.
Make sure to make at least 5 changes/corrections/improvements.
