added a blog post

This commit is contained in:
2019-07-30 16:55:20 +02:00
parent c578e74922
commit 9442b1202c
4 changed files with 334 additions and 0 deletions

127
blog/index.html Normal file
View File

@@ -0,0 +1,127 @@
<!DOCTYPE html>
<html>
<head>
<title>Zev Averbach</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/basscss/7.0.0/css/basscss.css" />
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
<style>
h1 {font-family: "Open Sans", sans-serif;}
p {
font-size: 16px }
.h0 {font-size: 30pt;
font-weight: 800}
nav a[target="_blank"]:after {content: url("./static/_external_link.png");
filter: invert(100%)}
.current-page {opacity: .3}
#content { width: 400px }
p, ul {text-align: left}
</style>
<script src="./static/_nav.js"></script>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-123137342-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-123137342-1');
</script>
</head>
<body class="center">
<header class="mt4 m2 clearfix">
<img style="margin-bottom: .8em; border-radius: 20%" src="https://www.gravatar.com/avatar/fe783e04644862c30823614f31b9a996/?s=360" />
<div class="h0 bold" style="line-height: 1.2em">
<a id="title" href="/" style="text-decoration: none; color: inherit;">Zev Averbach</a>
</div>
<div class="h2 mb2">
Full Stack Developer
</div>
<nav class="white bg-white">
<div id="nav">
<a href="/"
class="btn btn-primary not-rounded py2"
style="color: #222; background: #ded5d1;">About</a>
<a href="projects"
class="btn btn-primary not-rounded py2"
style="color: #222; background: #d4c8c4;">Projects</a>
<a href="blog/" class="btn btn-primary not-rounded py2 bg-white black border">Blog</a>
<a href="https://www.dropbox.com/s/w57srsvmuhufqrv/Zev%20Averbach%20Full%20Stack%20Developer%20Resume%202019.pdf?dl=0"
class="btn btn-primary not-rounded py2"
target="_blank"
style="color: #222; background: #cabbb7;">Resume</a>
<a href="https://www.linkedin.com/in/zev-averbach-964572156/"
class="btn btn-primary not-rounded py2"
target="_blank"
style="color: #222; background: #bdb0ac;">LinkedIn</a>
<a href="https://github.com/zevaverbach/"
class="btn btn-primary not-rounded py2"
target="_blank"
style="color: #222; background: #8c8080;">Github</a>
</div>
</nav>
</header>
<div id='content' style="margin: 0 auto">
<div class="h1">Blog Posts</div>
<ul>
<li><a href="vim_and_ctags">How I Got &#34;Go To Definition&#34; Working in Vim in 2019</a></li>
</ul>
</div>
</body>
</html>

197
blog/vim_and_ctags.html Normal file
View File

@@ -0,0 +1,197 @@
<!DOCTYPE html>
<html>
<head>
<title>Zev Averbach</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/basscss/7.0.0/css/basscss.css" />
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
<style>
h1 {font-family: "Open Sans", sans-serif;}
p {
font-size: 16px }
.h0 {font-size: 30pt;
font-weight: 800}
nav a[target="_blank"]:after {content: url("./static/_external_link.png");
filter: invert(100%)}
.current-page {opacity: .3}
#content { width: 400px }
p, ul {text-align: left}
</style>
<script src="./static/_nav.js"></script>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-123137342-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-123137342-1');
</script>
</head>
<body class="center mb4">
<header class="mt4 m2 clearfix">
<img style="margin-bottom: .8em; border-radius: 20%" src="https://www.gravatar.com/avatar/fe783e04644862c30823614f31b9a996/?s=360" />
<div class="h0 bold" style="line-height: 1.2em">
<a id="title" href="/" style="text-decoration: none; color: inherit;">Zev Averbach</a>
</div>
<div class="h2 mb2">
Full Stack Developer
</div>
<nav class="white bg-white">
<div id="nav">
<a href="/"
class="btn btn-primary not-rounded py2"
style="color: #222; background: #ded5d1;">About</a>
<a href="projects"
class="btn btn-primary not-rounded py2"
style="color: #222; background: #d4c8c4;">Projects</a>
<a href="blog/" class="btn btn-primary not-rounded py2 bg-white black border">Blog</a>
<a href="https://www.dropbox.com/s/w57srsvmuhufqrv/Zev%20Averbach%20Full%20Stack%20Developer%20Resume%202019.pdf?dl=0"
class="btn btn-primary not-rounded py2"
target="_blank"
style="color: #222; background: #cabbb7;">Resume</a>
<a href="https://www.linkedin.com/in/zev-averbach-964572156/"
class="btn btn-primary not-rounded py2"
target="_blank"
style="color: #222; background: #bdb0ac;">LinkedIn</a>
<a href="https://github.com/zevaverbach/"
class="btn btn-primary not-rounded py2"
target="_blank"
style="color: #222; background: #8c8080;">Github</a>
</div>
</nav>
</header>
<div id="blog-content" class="clear h2 m2" style="margin: 0 auto; width: 600px;">
<a href="/blog">&lt;&lt; back to blog index</a>
<div id="blog-title" class="h1 m3">How I Got "Go To Definition" Working in Vim in 2019</div>
<p>
<code>
<pre class="h6" align=left>
👇👇👇tl;dr
# .vimrc
set tags=tags
autocmd BufWritePost *.py silent! !ctags -R --python-kinds=-i --languages=python 2&gt; /dev/null &amp;
$ brew install ctags
</pre>
</code>
</p>
<p>
In the last two years I've spent a significant amount of time in PyCharm and a somewhat shorter
time with Visual Studio Code, both with vim keyboard bindings, writing mostly Python and JS. Ultimately, I came back to some
flavor of terminal-based vim: First Vim 8, now Neovim. There were too many missing features in
"vim mode" in both of the IDEs, and the speed difference—brain-to-screen—was noticeable
compared to vim.
</p>
<div class="h2 m3">What I Miss From IDEs</div>
<p>
Because I'm not yet a <code>sed</code>/<code>grep</code> expert in the context of search and replace, I still miss the
refactoring tools in PyCharm for renaming and reorganizing code. Automatic imports is also
something I haven't replicated in vim.
</p>
<p>
However, what I was missing most was "go to definition", which I had mapped in VSC and PyCharm to
<code>C-]</code> as it is by default in vim.
</p>
<div class="h2 m3">Getting It To Work + Timesucks to Avoid</div>
<p>
As with most of my efforts to make vim more ergonomic/IDE-like, getting "go to definition" working took
longer than I had hoped.
The low-hanging options didn't work as advertised: I tried to <a
href="https://tbaggery.com/2011/08/08/effortless-ctags-with-git.html">set up git hooks like Mr.
Pope suggested</a>,
but for whatever reason the tags file never refreshed on commit. Avoid this timesuck! And
anyway, don't you want "go to definition" to work between commits too?
</p>
<p>
What ended up working to refresh the tags file *on every save* was a modified version of something I found in the comments of <a
href="https://stackoverflow.com/a/155515/4386191">a StackOverflow answer</a>.
I was only interested to start out with in tagging my Python projects, so I
modified it accordingly.
</p>
<p>
Then, interestingly, without <code>python-kinds=-i</code> "go to definition"
didn't work as expected on MacOS (it was fine on an Ubuntu droplet). Inspecting my
<code>tags</code> file,
it was including imports, which caused by <code>C-]</code> invocations to only jump to the top of the current
module, where the import was, not to the definition of the function/module/constant/class.
</p>
<div class="h2 m3">Final Product + User Experience</div>
<p>
What's nice about this usage of ctags is 1) it runs in the background and never
interrupts you, 2) it's fast, and 3) it runs every time you save.
I haven't tried this at all with JS yet, and Mr. Pope alludes to that <code>ctags</code> might not be as
helpful there, but it is lightning fast and accurate for jumping around in large Python-based
projects.
</p>
<div class="h2 m3">Bonus: <code>gf</code></div>
<p>
<code>gf</code> bridges a significant gap that ctags don't cover:
It stands for "go to file". Type <code>gf</code> when your cursor over a filename, and it opens it!
</p>
</div>
</body>
</html>

View File

@@ -64,6 +64,11 @@
<a href="blog/" class="btn btn-primary not-rounded py2 bg-white black border">Blog</a>
<a href="https://www.dropbox.com/s/w57srsvmuhufqrv/Zev%20Averbach%20Full%20Stack%20Developer%20Resume%202019.pdf?dl=0"
class="btn btn-primary not-rounded py2"

View File

@@ -64,6 +64,11 @@
<a href="blog/" class="btn btn-primary not-rounded py2 bg-white black border">Blog</a>
<a href="https://www.dropbox.com/s/w57srsvmuhufqrv/Zev%20Averbach%20Full%20Stack%20Developer%20Resume%202019.pdf?dl=0"
class="btn btn-primary not-rounded py2"