Showing posts with label vi. Show all posts
Showing posts with label vi. Show all posts

Wednesday, January 8, 2025

Using the vi Editor

It is not every day that I have to edit large blocks of code. Usually I will put together a few lines of SQL or Python and pretty much any text editor will do. Today I put together a 450-line SQL statement and so I pulled out my favorite code editor: vi.

A common mistake with vi is how it is pronounced. Technically it should be pronounced as the two letters "V" and "I" but some try to pronounce it as a single-syllable word that rhymes with hi. Another common mistake is that it is difficult to use. It does have a pretty ugly learning curve for beginners but once you learn how to use it, it is significantly faster than most other text editors. Why? Because you never have to take your fingers off the keyboard. If you know how to touch type, you know not having to pull you hands off the keyboard to use the mouse or cursor keys can be lightning fast.

The vi editor evolved with the Unix operating system and became the de facto editor back in the 1980's. That is when I started doing technical support for Oracle running on Unix systems. My boss sat me down and made me learn both Unix and vi. The main point of confusion is getting used to being in command mode or edit mode. In command mode, all the letters of the keyboard have a specific function. The letter "h" moves the cursor to the left, "j" moves the cursor down, "h" moves it up, and "l" moves it to the right. Once you get used to that, you never have to take your hands off the letters to use the cursor arrows to move the cursor. It does take a lot of practice though.

To get into edit mode, you just hit the "a" or "i" keys. The "a" stands for append which allows you to add more characters after the cursor where "i" is for insert and adds characters before the cursor. Then to get back to command mode, you just hit the "ESC" or escape key. Once you play around with vi for a bit, your left pinky finger can find the escape key fairly quickly.

There are some other quick shortcuts that make editing code very efficient. If you want to delete the current line, just double tap the "d" key. If you want to copy the line, double tap the "y" key, which is short for yank. Then to paste either what you have deleted or yanked, use the "p" key and vi pastes the line below your cursor. If you made a mistake with what you deleted or pasted, just hit the "u" key and it will undo your last command. Hit it a couple of times and it will undo the previous couple commands.

Up until now, nothing seems that groundbreaking. The real power comes from prefacing any command with a number. If you want to move the cursor down 5 lines, just type the "5" key followed by the "j". Want to copy or yank 10 lines, just type "1" followed by "0" followed by "y" and followed by "y" again. Then when you want to paste them, just go to the line above where you want the copied lines to be inserted and type "p".

Then there is my favorite vi command: the do-it-again key which is the period or "." If you copied something and want to paste it several places in your document, just copy the line and move the cursor to the line above where you want it to go and press "p". Then move to the line above the next place you want it to go and hit the period key. If you want 5 copies of the line, hit "5" followed by "." and you will see 5 identical lines below your cursor.

Now I recognize that vi would be horrible for creating a term paper for school or any document for that matter. So I don't recommend it for a general-purpose editor. It has evolved over time though to be a very efficient code editor and that is where it excels. It is available for Windows for free and comes installed on all Mac and Linux machines. Most people know it as Vim, which is just an enhanced version of vi with color coding and a few other goodies. If you need to create code, get familiar with it and you might learn to appreciate it. Just don't be turned off by the difficult learning curve.

Thursday, June 6, 2019

Building a Prototype Web Application

This past week I have been putting together a fairly simple prototype web application. Ultimately I will build it with a back-end database but right now it is about a dozen static HTML pages. This will allow others to look at the design and suggest changes or refinements before we spend a lot more time and money on the finished internal application.

Putting together static HTML pages is something I did many years ago while working as a consultant. Back then I would hand code all of the HTML as automated tools didn't really exist. Sure I could use something like Dreamweaver from Adobe but the underlying code was difficult to maintain in a non-Dreamweaver environment. That was close to 20 years ago and so I did a quick survey of HTML tools to see if there is something that would work for me.

I must have gone through 30 different tools and none really worked. Some had a steep learning curve and wouldn't quite create the look I wanted. Others were just plain awful. Ultimately I decided I didn't need anything too fancy and used a word processor to create my initial design. Then I had it save my file in an HTML format. That sort of worked, but not quite. Next I pulled out GIMP and did a lot of layout work with the graphics. Then I did an few Internet searches and brushed up on my cascading stylesheet (CSS) skills. Once I had a design I liked, I tweaked the look by hand editing the HTML using my favorite text editor: vi.

Now I am building out a few follow-up pages simply by copying the original page and making a few edits. I don't need to build more than a dozen pages to help my colleagues understand what I am trying to build and so this process works fine. If I needed to build a more complex prototype with a lot more pages, I might want to take the time to learn one of the more complicated tools. Until then, my current process seems to be working fine.