Permalink
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
751 lines (691 sloc) 27.8 KB
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Vim Talk</title>
<link rel="stylesheet" href="./css/bootstrap.min.css" />
<link href='http://fonts.googleapis.com/css?family=Inconsolata' rel='stylesheet' type='text/css'>
<link href="http://fonts.googleapis.com/css?family=Ubuntu+Mono:400,700,400italic,700italic" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="./css/slides.css" />
</head>
<body>
<div class="presentationcontainer" id="presentationcontainer">
<div class="presentation" id="presentation">
<!-- Slide -->
<div class='slide no_padding terminal'>
<div id="vim_terminal"></div>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide initial hide-counter' style="background: url('./img/background1.jpg');">
<center>
<div style="padding-top: 25px;">
<h1>Supercharging Vim</h1>
<h3>A Beginner's Guide to the Universe.</h3>
</div>
<div style="padding-top: 100px">
<p>Britt Gresham</p>
<p>http://brittg.com/vim</p>
</div>
</center>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Who am I?</h3>
</center>
<div class='container'>
<div class='row'>
<div class='span4'>
<ul>
<li>From Kansas City</li>
<li>
Primary Languages
<ul>
<li>Python</li>
<li>Javascript</li>
<li>Html</li>
</ul>
</li>
<li>Using Vim for about 2.5 years</li>
<li>Software Engineer at Puppet Labs</li>
</ul>
</div>
<div class='span3'>
<img src='https://fbcdn-sphotos-a-a.akamaihd.net/hphotos-ak-xpa1/t31.0-8/10562592_10154563871360651_2961928414955623494_o.jpg' alt='' />
</div>
</div>
</div>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>How are you using Vim?</h3>
</center>
<p>
Do you find yourself using the arrows a lot?<br>
<br>
Does it take more time traversing the file than editing?<br>
<br>
Every time you fire up Vim you are left wondering how your Ninja Vim friend can edit so efficiently?<br>
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide hide-counter' style="background: url('./img/background2.jpg');">
<div class='center-wrapper'>
<span class='center'>
<h1><center>WORRY NO MORE</center></h1>
</span>
</div>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Vim Modes</h3>
</center>
<p>
Vim has Three basic modes of operation.
</p>
<ul>
<li>&lt;ESC&gt; - Normal Mode. Lets you navigate the file. The
"Gateway Mode".</li>
<li>i - Insert Mode. Lets you edit the text.</li>
<li>v - Visual Mode. Lets you select text.</li>
</ul>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Vim Motions</h3>
</center>
<ul>
<li>h - Move <b>Left</b> one character</li>
<li>j - Move <b>Down</b> one character</li>
<li>k - Move <b>Up</b> one character</li>
<li>l - Move <b>Right</b> one character</li>
</ul>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Vim Motions</h3>
</center>
<ul>
<li>w - Move <b>Forwards</b> one <b>Word</b></li>
<li>b - Move <b>Backwards</b> one <b>Word</b></li>
<li>e - Move to <b>End</b> of next <b>Word</b></li>
</ul>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Vim Motions</h3>
</center>
<ul>
<li>W - Move <b>Forwards</b> one <b>Big Word</b></li>
<li>B - Move <b>Backwards</b> one <b>Big Word</b></li>
<li>E - Move to <b>End</b> of next <b>Big Word</b></li>
</ul>
<p>
What is a <b>Big Word</b><br>
Well... Big words are any non-whitespace character.
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Vim Motions</h3>
</center>
<ul>
<li>) - Move to <b>Forward</b> one <b>Sentence</b></li>
<li>( - Move to <b>Backward</b> one <b>Sentence</b></li>
<li>} - Move <b>Forward</b> one <b>Paragraph</b></li>
<li>{ - Move <b>Backward</b> one <b>Paragraph</b></li>
</ul>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Vim Motions</h3>
</center>
<p>
Remember: Any motion can be preceded by a number to let Vim
know how many times you would like to repeat the motion.
</p><br>
<p>
For example:<br>
<ul>
<li>3w - Move 3 words forward.</li>
<li>2{ - Move 2 paragraphs backward.</li>
<li>900e - Move to the end of 900 words.</li>
</ul>
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Vim Motions</h3>
</center>
<p>
You can also use the `.` command to rerun the last edit.
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Vim Operators</h3>
</center>
<ul>
<li>c - Change Text</li>
<li>d - Delete Text</li>
<li>y - Yank Text</li>
</ul>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Vim Operators</h3>
</center>
<p>
Vim operators can not be used alone. They must be paired
with a motion.<br>
If you think about it, that really makes sense. You cannot
just "change" or just "delete".<br>
You can however "change a word" or "delete a word".
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Vim Operators</h3>
</center>
<ul>
<li>cw - Change a word</li>
<li>dw - Delete a word</li>
<li>yw - Yank a word</li>
</ul>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Vim Operators</h3>
</center>
<p>
But wait... There is more than just those motions.
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Vim Operators</h3>
</center>
<ul>
<li>c) - Change a sentence</li>
<li>y} - Yank a paragraph</li>
<li>d4w - Delete 4 words</li>
</ul>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Vim Operators</h3>
</center>
<p>
Double up on an operator to perform the operation on a line.
</p>
<ul>
<li>cc - Change the current line</li>
<li>dd - Delete the current line</li>
<li>yy - Yank the current line</li>
</ul>
<p>
<small>This is typically the case for most actions in Vim.</small>
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Vim Operators</h3>
</center>
<p>
Uppercase variants perform the operation from your where your cursor is to end of the line
</p>
<ul>
<li>C - Change until end of current line</li>
<li>D - Delete until end of current line</li>
</ul>
<p>
<small>This is typically the case for most actions in Vim.</small>
</p>
<p>
<small><b>Note</b>, The exception is Y which yanks the current line.</small>
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Vim Text Objects</h3>
</center>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Vim Text Objects</h3>
</center>
<p>
Text objects bring even more power to your Vim editing.<br>
Now instead of needing to move to the beginning of a word
to perform an operation on it you can use a Text object.<br>
<br>
<ul>
<li>i - Inside of</li>
<li>a - Around</li>
</ul>
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Vim Text Objects</h3>
</center>
<p>
<ul>
<li>ciw - Change Inside of a Word.</li>
<li>caw - Change Around a Word.</li>
<li>diw - Delete Inside of a Word.</li>
<li>daw - Delete Around a Word.</li>
<li>yiw - Yank Inside of a Word.</li>
<li>yaw - Yank Around a Word.</li>
</ul>
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Vim Text Objects</h3>
<h4>Demo</h4>
</center>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Macros</h3>
</center>
<p>
Macros are a really great way for speeding up mundane tasks.
</p>
<p>
To start recording a macro press q and then a register to start recording to.
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Macros</h3>
</center>
<p>
To stop recording the macro press q again.
</p>
<p>
Run macros by pressing @ and then the register that you stored the macro in.
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Macros</h3>
</center>
<p>
<ul>
<li>qa - Start recording in register a</li>
<li>q - Stop the recording of a macro</li>
<li>@a - Playback the recording stored in register a</li>
</ul>
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Macros</h3>
</center>
<p>
Remember that Vim is recording keystrokes and not actions.
Make your macros repeatable by using more advanced motions.
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Macros</h3>
<h4>Demo</h4>
<p>
Surrounding lines with quotes.
</p>
</center>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Visual Mode</h3>
</center>
<p>
<ul>
<li>v - Enter visual mode in characterwise mode</li>
<li>V - Enter visual mode in linewise mode</li>
<li>c-v - Enter visual mode in blockwise mode</li>
<li>v - Exits visual mode when in visual mode</li>
</ul>
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Visual Mode</h3>
</center>
<p>
Use Blockwise visual mode or c-v for performing the same task on multiple lines.
</p>
<p>
Use I to insert on every line on the leading edge of the Blockwise Visual selection
</p>
<p>
Use A to insert on every line on the trailing edge of the Blockwise Visual selection
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Visual Mode</h3>
<h4>Demo</h4>
<p>
Surrounding lines with quotes.
</p>
</center>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Command mode</h3>
</center>
<p>
Perform substitutions with :s[ubstitute]
</p>
<p>
:s/&lt;search&gt;/&lt;replace&gt;/
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Command mode</h3>
</center>
<p>All of Vim's modes have commands associated with them.</p>
<p>
<ul>
<li>:norm[al] - Perform action in Normal mode with command mode</li>
<li>:i[nsert] - Perform action in Insert mode with command mode</li>
<li>:vi[sual] - Perform action in Visual mode with command mode</li>
</ul>
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Command mode</h3>
</center>
<p>All of Vim's operators also have commands associated with them.</p>
<p>
<ul>
<li>:c[hange] - Change text with command mode</li>
<li>:d[elete] - Delete text with command mode</li>
<li>:y[ank] - Yank text with command mode</li>
</ul>
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Command mode</h3>
</center>
<p>Why spend time learning these if we can just use the keys we learned before?</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Command mode</h3>
</center>
<p>
Super charge macros and visual mode with :g and :v
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Command mode</h3>
</center>
<p>
<ul>
<li>:g[lobal] - Perform an action on lines matching a regex</li>
<li>:g[lobal]! - Perform an action on lines not matching a regex</li>
<li>:v[global] - Same as :g!. Think of the in<b>v</b>erse of global</li>
</ul>
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Command mode</h3>
</center>
<p>
So how do I use :global??
</p>
<p>
:global/&lt;regex_pattern&gt;/&lt;command_to_perform&gt;
</p>
<p>
<ul>
<li>:global/^Remove me$/delete</li>
<li>:global/yank \w\+ me/yank</li>
</ul>
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Command mode</h3>
</center>
<p>
But wait there is more!
</p>
<p>
<ul>
<li>:g/Some regex/normal @a</li>
</ul>
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Command mode</h3>
</center>
<p>
But wait there is even more!!!
</p>
You can perform these actions over a specific range in your file
<p>
<ol>
<li>Visually select a region in your file</li>
<li>:g/run macro/normal @q</li>
</ol>
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Command mode</h3>
</center>
<p>
Notice how Vim automatically inserts :'&lt;,'&gt; before g.
</p>
<p>
Vim is telling this command what range to perform the command over.
By default the :global command runs over the entire file.
</p>
<p>
Most commands accept a range that you can use to perform that command over an area in a file.
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Command mode</h3>
</center>
<p>
Ranges come before a command and tell that command where to run.
</p>
<p>
<ul>
<li>:42 - Perform command on Line 42</li>
<li>:1 - Perform command on first line</li>
<li>:$ - Perform command on last line</li>
<li>:. - Perform command on current line</li>
<li>:% - Perform command on all lines</li>
<li>:+3 - Perform command on next 3 lines</li>
</ul>
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Command mode</h3>
</center>
<p>
Ranges come before a command and tell that command where to run.
</p>
<p>
<ul>
<li>:10,20 - Perform command on lines 10 to 20 (Inclusive)</li>
<li>:21,$ - Perform command on lines 21 to end of file</li>
<li>:70,+5 - Perform command on lines 70 to 75 (Inclusive)</li>
</ul>
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Command mode</h3>
</center>
<p>
<ul>
<li>:%s/search/replace/ - Search and replace over entire file</li>
<li>:21,$g/search/normal @a - Run macro from line 21 to end of file</li>
<li>:70,+5delete - Delete lines 70 through 75 (Inclusive)</li>
</ul>
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Command mode</h3>
</center>
<p>
Without a command Vim will move your cursor to that line
</p>
<p>
<ul>
<li>:10 - Move to line 10</li>
</ul>
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
<center>
<h3>Command mode</h3>
</center>
<p>
When in doubt :help is your best friend!
</p>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide hide-counter' style="background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.7)), url('./img/background3.jpg');">
<div class='center-wrapper'>
<span class='center'>
<h1><center>Questions?</center></h1>
</span>
</div>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide hide-counter' style="background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.9)), url('./img/background4.jpg');">
<center>
<h3>Thanks for Coming</h3>
<h4>Contact me</h4>
</center>
<ul>
<li>Website: http://brittg.com/</li>
<li>Email: brittcgresham@gmail.com</li>
<li>Twitter: @demophoon</li>
<li>Slides: https://github.com/demophoon/vim-talk</li>
<li>LinkedIn: http://brittg.com/linkedin</li>
</ul>
</div>
<!-- End of Slide -->
<!-- Slide -->
<div class='slide'>
</div>
<!-- End of Slide -->
</div>
</div>
<script src="./js/jquery-1.8.1.min.js"></script>
<script src="./js/presenteer-1.0.min.js"></script>
<script charset="utf-8" src="./js/term.js"></script>
<script charset="utf-8" src="./js/sockjs.min.js"></script>
<script charset="utf-8" src="./js/webterm.js"></script>
<script charset="utf-8" src="./js/presentation.js"></script>
</body>
</html>