Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
by
FREELessons:34Length:2.5 hours

Next lesson playing in 5 seconds

Cancel
  • Overview
  • Transcript

5.2 Vintage Mode

In this lesson, I want to go over Vintage mode, which is just vi mode implemented in Sublime Text 2. And if you really wanna take your speed to the next level, I highly recommend you do this. Just a word of caution, it will take you a while to memorize these things. I had to invest a good month, maybe even more before these keyboard shortcuts and commands had engrained themselves in my muscles. But now at this point, I could not imagine going back. So if that sounds good to you, let's continue on. The first thing we have to do is enable it in Sublime. If I go to Sublime > Preferences > Default Settings and I scroll down to the bottom, you'll see that there is an ignored package right here. So if we were to remove that, that would give us Vintage mode because it's no longer being ignored. However, this is the default preferences. So I shouldn't modify this file really and that's because as soon as Sublime is updated, this file will be over written. And once again, Vintage mode will be disabled. So a better decision is to add this to our User Settings file, like so. Now I'm going to remove it, because we're no longer ignoring Vintage mode. Great. So now at this point, nothing will seem to change. But as soon I hit Escape, you'll notice that the cursor has now changed. If I go back into insert mode, we have the standard cursor, Escape. Now we're out of insert mode and we can use the Vim syntax how we would like. So this course certainly isn't a Vim course. If you would like to learn more about Vi and Vim, then we do have a course on Tuts Premium called Venture and the Vim and that would be an excellent choice, if this picks your interest. I'm just gonna show you a little bit of the basics and how I use it. The first note is how you go up, down, left and right. Now because this is still Sublime, we're not in hardcore Vim. You can use the up, down, left and right arrow keys, but that's not really the Vi way. Instead, you're gonna use k to go up, j to go down. L to go right and h to go left. So the reason for this, there's lots of reasons for this. But the convenience here is that your fingers never need to leave the center of the keyboard. That's sort of like the golden zone. The less you can leave that center row, the more efficient that you can be. So notice that this lines up really nicely. My index is on h. My ring finger is on k. My middle finger is on j. Try to get in that habit. Each finger is responsible for a different task and it'll definitely take a little while. It certainly took me some time, but I promise it'll get to the point where you don't even think about it. Now what's cool about Sublime is that we can stack commands. So for example, if I hit j to go down, I could also say 5j and that's the same as saying, go down five times. 5j, 5j, 5j. And notice I can just keep doing that, the same thing to go up. So if I hit 9k, that's gonna go up nine lines. So many times when I'm in a project and I just wanna scan it, I'll hit 5j just a handful of times, like that. Now consider this section right here where we have application. If I wanted to select that word, I could hit Cmd+D in Sublime Text. Or I could also hit V and that's going to switch us into a different mode, called visual mode and I could say, visual, select the inner word. So V-I-W. Now I have selected that occurrence and I can change it. Or what if, rather than selecting it, because I admit Cmd+D is really easy. You've probably committed that to memory by now, but what if you wanted to change what is between these single quotes? Well, maybe you hit Cmd+D normally and delete. Is that what you do? But what about if there's more than one word? I'll just duplicate this, for example. Well, then you would have to do Cmd+D. Cmd+D again and then delete, but that gets a little messy and we're sort of cheating, because we're using Cmd+D to select the same word twice, which you probably won't have. In reality, what you probably end up doing is you grab the mouse and you just select the words and change it. I'll show you a better way. You place the cursor anywhere within the quotes. And now I'm going to write ci single quotes and that immediately changes it. So what is ci? Well, think of c as change. Think of i as inner, so that forms change inner. So when I do ci single quote, I'm saying, I wanna change everything between the single quotes. Ci quotes. Or if I were to do vi quotes, now we're saying visually select what's between the quotes. So as you can imagine, if we were instead dealing with double quotes. In that case, I would do ci double quote to change that text. And that alone will save you a tremendous amount of time. Let's open a public directory and let's create a New File, test.js and we'll say, var person equals an object. My name is Jeff and my age is 27. So what would you do if you wanted to change everything between these curly braces? Well, maybe you would just select it and delete it, like so. Once again, with Vintage mode turned on I could say, c, opening curly brace. Notice we're getting the same thing. And this is how it can be really flexible. Its sort of like a language. With other editors, you're just memorizing keystrokes that mean nothing. Shift+C+W means select word. But what if you want to change the word? What if you wanna select two words? Well, in those cases, you're kind of out of luck or you have to memorize countless keyboard shortcuts. I have years of experience to show, your brain just leaks. There's only so many shortcuts that we can remember across all of these programs and that's why I prefer Vi mode. Next, let's open up maybe index.html and I'd like some Lorem text. So I will type Lorem, Tab and that should paste some in for me. So now, if I hit Escape again to go back to normal mode. If I wanna change this first word, I hit cw, change word. Notice how readable that is. If I want to change two words, then I can either do 2cw or I could say, c2w, which is what I tend to do. Because it's a little easier for me to interpret in my mind, change two words. Or change four words, c4w or c5w. This will go on and on and this works across most of the commands in Vim or Vintage mode, in this case. So what I mean by that is if I say, v5w, now we have visually selected five words. Isn't that neat? Or what if I want to, maybe from the beginning, select until this comma. Well, in that case, we can do vt comma and think of t as till. Visually select till the comma. So vt, and now we select everything up to that comma. Or if I did vf, that's going to do the same thing, but it will also select the comma as well. Don't worry about that one too much. Keep it simple. So next, let's say, we wanna put these on their own lines. So I will just separate these, just so we have something to work with like this. Now if I want to go to the end of the line I hit A and that will take the cursor all the way to the end of the line. If I instead want to go to the beginning of the line, I hit capital I and now I'm typing. If I want to select an entire line, I can hit capital V and now I've visually selected the entire line like that. So many times, you will wanna select a handful of things. So I could hit capital V, I'll hit j to go down a few clicks and now I wanna copy it and I can use yank. So y for yank and p for paste, so p will paste it in. So let me give you a more practical example. Let's go back to test.js and we'll say var name equals jeff. Var age equals 27. If I wanted to delete one of these lines, I could either hit capital V and D for delete, that would work. Or I could DD and that would delete the line. If I want to copy a line, then I can hit y twice and that will yank it and I can paste it in where I need. If I want to duplicate a line, I could say, yank line and paste, yyp. Do do it again, yyp. And hopefully, you're following along. Otherwise, I couldn't imagine watching this because there are so many shortcuts. And that's why you really need to take a month or two and just pick one thing. I'm going to learn about yanking or I'm going to memorize how to change text in specific locations. So noticed how before I did yyp to duplicate a line? Well, once you run a command in Vi, I can hit period to repeat the last command. So if I hit capital V and k to go up a few strokes and d to delete that section. Now I can say yyp and then just period to keep repeating that. So I just can imagine that would be really helpful. Maybe you have name and you're grabbing something from in php the post super global, like that. Well, if we have a bunch of things that you need, like the age, the year of birth, things like that. Well, yyp period a few times and then you would change it. And then of course, you can still take advantage of multiple cursors. So for example, I will hit Cmd+D to select a word. One more time to select the next occurrence. And now I'm going to change that text, so I will hit c and we'll change that to A and now we're done. So I can hit Cmd+G to find the next occurrence of the word. Cmd+D and this isn't Vi at this point, this is just using Sublime Text. Now we're going to say, hometown, Cmd+G, Cmd+D, hobbies and then et cetera, et cetera. So you can definitely use both of these, you're not using one or the other. So that's all I want to cover, because that alone will take you through the first month just trying to remember all of that. So the main one I want you to learn immediately is change inner, ci single quotes. Now what's cool about this is imagine you're at the beginning of the line and you need to change a value. Well, normally, you might double-click on the word and change it. Well now, you never have to touch the mouse. Just hit ci single quotes. Ci single quotes, changed and you're done. Once you've wrapped that around your mind, then play around with selecting words. Vw for visual word and then I can keep hitting w to continue selecting words or the same thing with cw. Now I am changing a word. Or dw to delete a word. Or d4w to delete four words. So have a play with that. Don't get discouraged. I promise if you stick with it, you will absolutely love it. And if you want a full course on this, again stay tuned to a course called Venture and a Vim coming to Tuts Premium in October.

Back to the top