2014-05-13 00:10:10 -04:00
|
|
|
<!doctype html>
|
|
|
|
|
<html lang="en">
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="utf-8">
|
|
|
|
|
<title>Intro to Vim</title>
|
|
|
|
|
<link rel="stylesheet" href="bower_components/reveal.js/css/reveal.min.css">
|
|
|
|
|
<link rel="stylesheet" href="bower_components/reveal.js/css/theme/solarized.css">
|
2014-05-13 01:30:56 -04:00
|
|
|
<style>
|
|
|
|
|
blockquote {
|
|
|
|
|
text-align: left;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
2014-05-13 00:10:10 -04:00
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<div class="reveal">
|
|
|
|
|
<div class="slides">
|
|
|
|
|
<!-- Introduction Slide -->
|
|
|
|
|
<section>
|
|
|
|
|
<h1>Intro to Vim</h1>
|
2014-05-13 02:14:31 -04:00
|
|
|
<small>
|
|
|
|
|
Andrew Tomaka / <a href="https://twitter.com/atomaka">@atomaka</a>
|
|
|
|
|
</small>
|
2014-05-13 00:10:10 -04:00
|
|
|
</section>
|
|
|
|
|
|
2014-05-13 01:30:56 -04:00
|
|
|
<!---->
|
|
|
|
|
<section>
|
|
|
|
|
<h3>Why I use Vim</h3>
|
|
|
|
|
<ul>
|
|
|
|
|
<li>Desired a more seamless environment</li>
|
|
|
|
|
<li>Might as well be Vim
|
|
|
|
|
<ul>
|
|
|
|
|
<li>"nerd cred"</li>
|
|
|
|
|
<li>server administration</li>
|
2014-05-13 17:53:03 -04:00
|
|
|
<li>flexibility and options</li>
|
2014-05-13 01:30:56 -04:00
|
|
|
<li>RSI prevention</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</li>
|
|
|
|
|
<li><strong>BUT...</strong>It might not be for you</li>
|
2014-05-13 23:53:42 -04:00
|
|
|
<aside class="notes">
|
|
|
|
|
<ul>
|
|
|
|
|
<li>Too many tools: Sublime Text 2 for editing, Putty for SSH,
|
|
|
|
|
git bash for git, Cygwin for Rubt commands.</li>
|
|
|
|
|
<li>Can mostly be done in ST2 with time. Restart with Vim,
|
|
|
|
|
"nerd cred", More importantly, server administration Vim (or vi)
|
|
|
|
|
works everywhere, no matter how broken the machine is (emacs
|
|
|
|
|
does not)</li>
|
|
|
|
|
<li>
|
|
|
|
|
After 20 years, people are still finding new ways to use it
|
|
|
|
|
</li>
|
|
|
|
|
<li>
|
|
|
|
|
Repetitive Strain injury - vim helps enforce better habbits
|
|
|
|
|
</li>
|
|
|
|
|
<li>You have to decide what works for you</li>
|
|
|
|
|
</aside>
|
2014-05-13 01:30:56 -04:00
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
<!-- learning curve -->
|
|
|
|
|
<section>
|
|
|
|
|
<h3>Everyone's first Vim session</h3>
|
|
|
|
|
<blockquote>
|
|
|
|
|
^C^C^X^X^X^XquitqQ!qdammit[esc]qwerty
|
|
|
|
|
uiopasdfghjkl;:xwhat
|
|
|
|
|
</blockquote>
|
|
|
|
|
<a href="http://bash.org/7795779">Bash.org</a>
|
|
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
<section>
|
|
|
|
|
<h3>But how can we avoid this</h3>
|
|
|
|
|
<ul>
|
|
|
|
|
<li>vimtutor - command line tutorial</li>
|
|
|
|
|
<li><a href="http://vim-adventures.com/">VIM Adventures</a></li>
|
|
|
|
|
<li>
|
|
|
|
|
<a href="http://www.viemu.com/vi-vim-cheat-sheet.gif">
|
|
|
|
|
This Cheat Sheet
|
|
|
|
|
</a> - or
|
|
|
|
|
<a href="http://www.terminally-incoherent.com/blog/wp-content/uploads/2009/03/vimcheatsheet.pdf">
|
|
|
|
|
many
|
|
|
|
|
</a>
|
|
|
|
|
<a href="http://www2.cs.uidaho.edu/~rinker/ed03.pdf">others</a>.
|
|
|
|
|
</li>
|
|
|
|
|
<li>Focus on five commands a week</li>
|
|
|
|
|
</ul>
|
2014-05-13 23:53:42 -04:00
|
|
|
<aside class="notes">
|
|
|
|
|
<ul>
|
|
|
|
|
<li>vimtutor - 30-45 minutes is enough to gain usability</li>
|
|
|
|
|
<li>VIM Adventures - game that finally pushed me into learning</li>
|
|
|
|
|
<li>Cheat Sheet - I still keep one printed off on a wall</li>
|
|
|
|
|
<li>Focus on a small set - I picked five that I wrote down and learned
|
|
|
|
|
each week and still do from time to time</li>
|
|
|
|
|
</aside>
|
2014-05-13 01:30:56 -04:00
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
<section>
|
|
|
|
|
<h3>You will probably still struggle</h3>
|
|
|
|
|
<ul>
|
|
|
|
|
<li>Copy and paste</li>
|
|
|
|
|
<li>Not using the mouse</li>
|
|
|
|
|
<li>Getting to the end of the line</li>
|
|
|
|
|
</ul>
|
2014-05-13 23:53:42 -04:00
|
|
|
<aside class="notes">
|
|
|
|
|
My struggles
|
|
|
|
|
<ul>
|
|
|
|
|
<li>Copy and paste - different idea</li>
|
|
|
|
|
<li>Not using a mouse</li>
|
|
|
|
|
<li>Getting to the end of the line example: I used
|
|
|
|
|
shift+A<ESC> instead of $ for months</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</aside>
|
2014-05-13 01:30:56 -04:00
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
<!-- modes -->
|
|
|
|
|
<section>
|
2014-05-13 17:35:37 -04:00
|
|
|
<h3>Vim has modes</h3>
|
|
|
|
|
<ul>
|
|
|
|
|
<li>Such as:
|
|
|
|
|
<ul>
|
|
|
|
|
<li>normal</li>
|
|
|
|
|
<li>insert</li>
|
|
|
|
|
<li>visual</li>
|
|
|
|
|
<li>command-line</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</li>
|
|
|
|
|
<li>Higher complexity, but comes with incredible power</li>
|
2014-05-13 23:53:42 -04:00
|
|
|
<aside class="notes">
|
|
|
|
|
<ul>
|
|
|
|
|
<li>In the early days, all editors had modes. By programmers,
|
|
|
|
|
for programers.</li>
|
|
|
|
|
<li>Mid-1970s, Larry Tesler came up with the concept of modeless
|
|
|
|
|
editors.</li>
|
|
|
|
|
<li>But traded a lot of power in favor of this ease of use.</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</aside>
|
2014-05-13 17:35:37 -04:00
|
|
|
</ul>
|
2014-05-13 01:30:56 -04:00
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
<!-- movement -->
|
|
|
|
|
<section>
|
|
|
|
|
<h3>You can move around</h3>
|
|
|
|
|
<ul>
|
|
|
|
|
<li>The bare minimum
|
|
|
|
|
<ul>
|
|
|
|
|
<li>h, j, k, l</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</li>
|
|
|
|
|
<li>Do not use the arrow keys</li>
|
|
|
|
|
<li>get around the screen faster
|
|
|
|
|
<ul>
|
|
|
|
|
<li>H, M, L, gg, G, :50</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
2014-05-13 23:53:42 -04:00
|
|
|
<aside class="notes">
|
|
|
|
|
<ul>
|
|
|
|
|
<li>Focus on home row.</li>
|
|
|
|
|
<li>Move around screen: H, M, L</li>
|
|
|
|
|
<li>Move around document: gg, G, :50</li>
|
|
|
|
|
</aside>
|
2014-05-13 01:30:56 -04:00
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
<!-- actions -->
|
|
|
|
|
<section>
|
|
|
|
|
<h3>And do things</h3>
|
|
|
|
|
<ul>
|
|
|
|
|
<li>i - insert</li>
|
|
|
|
|
<li>d - delete</li>
|
|
|
|
|
<li>y - yank, p - paste
|
|
|
|
|
<ul>
|
|
|
|
|
<li>Copy and paste - sort of</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</li>
|
|
|
|
|
<li>c - change
|
|
|
|
|
<ul>
|
|
|
|
|
<li>like selecting text and typing over it</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
2014-05-13 23:53:42 -04:00
|
|
|
<aside class="notes">
|
|
|
|
|
<ul>
|
|
|
|
|
<li>insert is a complete mode switch to let you type text, leave
|
|
|
|
|
with <ESC></li>
|
|
|
|
|
<li>delete, change, yank act on things</li>
|
|
|
|
|
<li>All of them put affected text into a place that can be pasted
|
|
|
|
|
from</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</aside>
|
2014-05-13 01:30:56 -04:00
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
<!-- objects -->
|
|
|
|
|
<section>
|
|
|
|
|
<h3>On objects</h3>
|
|
|
|
|
<ul>
|
|
|
|
|
<li>obvious
|
|
|
|
|
<ul>
|
|
|
|
|
<li>w - word, line</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</li>
|
|
|
|
|
<li>logical
|
|
|
|
|
<ul>
|
|
|
|
|
<li>p - paragraph, s - sentence</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</li>
|
|
|
|
|
<li>useful
|
|
|
|
|
<ul>
|
|
|
|
|
<li>blocks of all sorts (t - html, various symbols)</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
2014-05-13 23:53:42 -04:00
|
|
|
<aside class="notes">
|
|
|
|
|
<ul>
|
|
|
|
|
<li>Everything is an object in Vim.</li>
|
|
|
|
|
<li>Learning to utilize these is the key to effective vim use</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</aside>
|
2014-05-13 01:30:56 -04:00
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
<!-- modified -->
|
|
|
|
|
<section>
|
|
|
|
|
<h3>That can be modified</h3>
|
|
|
|
|
<ul>
|
|
|
|
|
<li>i - inside</li>
|
|
|
|
|
<li>a - around</li>
|
|
|
|
|
<li>t - (un)till</li>
|
|
|
|
|
<li>f - find</li>
|
|
|
|
|
</ul>
|
2014-05-13 23:53:42 -04:00
|
|
|
<aside class="notes">
|
|
|
|
|
<ul>
|
|
|
|
|
<li>inside - excludes the surrounding part of the object</li>
|
|
|
|
|
<li>around - includes the surrounding part of the object</li>
|
|
|
|
|
<li>till - from cursor to the specific character</li>
|
|
|
|
|
<li>find - the same as till except for including the specific
|
|
|
|
|
character</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</aside>
|
2014-05-13 01:30:56 -04:00
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
<!-- combined -->
|
|
|
|
|
<section>
|
|
|
|
|
<h3>And finally combined into a language</h3>
|
|
|
|
|
<ul>
|
|
|
|
|
<li>Basic things
|
|
|
|
|
<ul>
|
|
|
|
|
<li>3j - down three lines</li>
|
2014-05-13 17:53:03 -04:00
|
|
|
<li>d3j - delete the current and the next three lines</li>
|
|
|
|
|
<li>d3k - delete the current and the previous three lines</li>
|
2014-05-13 01:30:56 -04:00
|
|
|
</ul>
|
|
|
|
|
</li>
|
|
|
|
|
<li>And more advanced ones
|
|
|
|
|
<ul>
|
|
|
|
|
<li>c$ - change until the end of the line</li>
|
|
|
|
|
<li>das - delete around sentence</li>
|
|
|
|
|
<li>ci" - change inside quotes</li>
|
2014-05-13 17:53:03 -04:00
|
|
|
<li>dit - delete inside html blocks (<b>test</b>)
|
2014-05-13 01:30:56 -04:00
|
|
|
</ul>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
2014-05-13 23:53:42 -04:00
|
|
|
<aside class="notes">
|
|
|
|
|
<ul>
|
|
|
|
|
<li>
|
|
|
|
|
das - includes the spaces. dis would not inclue space after.
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</aside>
|
2014-05-13 01:30:56 -04:00
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
<!-- example stuff -->
|
|
|
|
|
<section>
|
2014-05-13 18:08:26 -04:00
|
|
|
<h3>Demonstration</h3>
|
2014-05-13 01:30:56 -04:00
|
|
|
</section>
|
2014-05-13 00:10:10 -04:00
|
|
|
|
|
|
|
|
<!-- Resources Slide -->
|
|
|
|
|
<section>
|
|
|
|
|
<h3>Other Talks</h3>
|
2014-05-13 01:30:56 -04:00
|
|
|
<ul>
|
|
|
|
|
<li>
|
|
|
|
|
<a href="https://www.youtube.com/watch?v=SkdrYWhh-8s">
|
|
|
|
|
Write Code Faster: Expert-Level Vim
|
|
|
|
|
</a>
|
|
|
|
|
by Ben Orenstein
|
|
|
|
|
</li>
|
|
|
|
|
<li>
|
|
|
|
|
<a href="https://www.youtube.com/watch?v=aHm36-na4-4">
|
|
|
|
|
More Instantly Better Vim
|
|
|
|
|
</a>
|
|
|
|
|
by Damian Conway
|
|
|
|
|
</li>
|
|
|
|
|
<li>
|
|
|
|
|
<a href="https://www.youtube.com/watch?v=9jzWDr24UHQ">
|
|
|
|
|
Impressive Ruby Productivity With Vim and Tmux
|
|
|
|
|
</a>
|
|
|
|
|
by Chris Hunt
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
2014-05-13 23:53:42 -04:00
|
|
|
<aside class="notes">
|
|
|
|
|
<ul>
|
|
|
|
|
<li>Ben Orenstein - one of my favorite speakers</li>
|
|
|
|
|
<li>:w<CR> to ^s; thousands of key strokes per week</li>
|
|
|
|
|
<li>Damian Conway - more advanced with neat plugins</li>
|
|
|
|
|
<li>Chris Hunt - Basic tmux and Vim. I do this.</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</aside>
|
2014-05-13 01:30:56 -04:00
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
<!-- Repository slide -->
|
|
|
|
|
<section>
|
2014-05-13 17:53:03 -04:00
|
|
|
<h3>Resources</h3>
|
2014-05-13 01:30:56 -04:00
|
|
|
<ul>
|
|
|
|
|
<li>
|
|
|
|
|
<a href="https://www.github.com/atomaka/intro-to-vim">
|
|
|
|
|
These slides
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li>
|
|
|
|
|
<a href="https://github.com/atomaka/dotfiles/blob/master/.vimrc">
|
|
|
|
|
My vimrc
|
|
|
|
|
</a>
|
|
|
|
|
<ul>
|
|
|
|
|
<li>(but I recommend starting with a blank)</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
2014-05-13 23:53:42 -04:00
|
|
|
<aside class="notes">
|
|
|
|
|
<ul>
|
|
|
|
|
<li>Grow your vim file like a garden</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</aside>
|
2014-05-13 00:10:10 -04:00
|
|
|
</section>
|
2014-05-13 17:53:03 -04:00
|
|
|
|
|
|
|
|
<!-- Conclusion -->
|
|
|
|
|
<section>
|
|
|
|
|
<h1>Try Vim for yourself</h1>
|
|
|
|
|
</section>
|
2014-05-13 00:10:10 -04:00
|
|
|
</div>
|
|
|
|
|
</div>
|
2014-05-13 23:53:42 -04:00
|
|
|
<script src="bower_components/headjs/dist/1.0.0/head.min.js"></script>
|
2014-05-13 00:10:10 -04:00
|
|
|
<script src="bower_components/reveal.js/js/reveal.min.js"></script>
|
|
|
|
|
<script>
|
|
|
|
|
Reveal.initialize({
|
|
|
|
|
controls: false,
|
|
|
|
|
progress: true,
|
2014-05-13 23:53:42 -04:00
|
|
|
history: true,
|
|
|
|
|
dependencies: [
|
|
|
|
|
{
|
|
|
|
|
src: 'bower_components/reveal.js/plugin/notes/notes.js',
|
|
|
|
|
async: true,
|
|
|
|
|
condition: function() { return !!document.body.classList; }
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
src: 'bower_components/reveal.js/plugin/markdown/marked.js',
|
|
|
|
|
condition: function() {
|
|
|
|
|
return !!document.querySelector( '[data-markdown]' );
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
src: 'bower_components/reveal.js/plugin/markdown/markdown.js',
|
|
|
|
|
condition: function() {
|
|
|
|
|
return !!document.querySelector( '[data-markdown]' );
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
]
|
2014-05-13 00:10:10 -04:00
|
|
|
});
|
|
|
|
|
</script>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
