aboutsummaryrefslogtreecommitdiff
path: root/docs/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'docs/index.html')
-rw-r--r--docs/index.html422
1 files changed, 45 insertions, 377 deletions
diff --git a/docs/index.html b/docs/index.html
index 292f245..883a3a5 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -21,400 +21,68 @@
21<div class="posts"> 21<div class="posts">
22 22
23 23
24 <details class="post"> 24 <div class="post">
25 <summary> 25 <div class="date">31/12 2019</div>
26 <div class="date">31/12 2019</div> 26 <a href="/posts/color_conundrum.html" class="post-link">
27 <span class="post-link">Color Conundrum</span> 27 <span class="post-link">Color Conundrum</span>
28 </summary> 28 </a>
29 <div class="post-text"> 29 </div>
30 <p>This piece aims to highlight (pun intended) some of the
31reasons behind my <a href="https://files.nerdypepper.tech/bF.png">color
32free</a> editor setup.</p>
33
34<p>Imagine highlighting an entire book because <em>all</em> of it is
35important. That is exactly what (most) syntax highlighting
36does. It is difficult for the human eye to filter out noise
37in rainbow barf. Use color to draw attention, not diverge
38it.</p>
39
40<p>At the same time, a book devoid of color is <em>boring!</em> What
41is the takeaway from this 10 line paragraph? What are the
42technical terms used?</p>
43
44<p>Prose and code are certainly different, but the fickle
45minded human eye is the same. The eye constantly looks for a
46frame of reference, a focal point. It grows tired when it
47can&#8217;t find one.</p>
48
49<p>The following comparison does a better job of explaining
50(none, ample and over-the-top highlighting, from left to
51right):</p>
52
53<p><a href="https://files.nerdypepper.tech/lt.png"><img src="https://files.nerdypepper.tech/lt.png" alt="hi.png" /></a></p>
54
55<p>Without highlighting (far left), it is hard to differentiate
56between comments and code! The florid color scheme (far
57right) is no good either, it contains too many attention
58grabbers. The center sample is a healthy balance of both.
59Function calls and constants stand out, and repetitive
60keywords and other noise (<code>let</code>, <code>as</code>) are mildly dimmed
61out. Comments and non-code text (sign column, status text)
62are dimmed further.</p>
63
64<p>I&#8217;ll stop myself before I rant about color contrast and
65combinations.</p>
66 <div class=separator></div>
67 </div>
68 </details>
69 30
70 <details class="post"> 31 <div class="post">
71 <summary> 32 <div class="date">23/11 2019</div>
72 <div class="date">23/11 2019</div> 33 <a href="/posts/static_sites_with_bash.html" class="post-link">
73 <span class="post-link">Static Sites With Bash</span> 34 <span class="post-link">Static Sites With Bash</span>
74 </summary> 35 </a>
75 <div class="post-text"> 36 </div>
76 <p>After going through a bunch of static site generators
77(<a href="https://blog.getpelican.com/">pelican</a>,
78<a href="https://gohugo.io">hugo</a>,
79<a href="https://github.com/icyphox/vite">vite</a>), I decided to roll
80my own. If you are more of the &#8216;show me the code&#8217; kinda guy,
81<a href="https://github.com/nerdypepper/site">here</a> you go.</p>
82
83<p><strong>Text formatting</strong>: I chose to write in markdown, and convert
84to html with <a href="https://kristaps.bsd.lv/lowdown/">lowdown</a>.</p>
85
86<p><strong>Directory structure</strong>: I host my site on GitHub pages, so
87<code>docs/</code> has to be the entry point. Markdown formatted posts
88go into <code>posts/</code>, get converted into html, and end up in
89<code>docs/index.html</code>, something like this:</p>
90
91<pre><code>posts=$(ls -t ./posts) # chronological order!
92for f in $posts; do
93 file=&quot;./posts/&quot;$f # `ls` mangled our file paths
94 echo &quot;generating post $file&quot;
95
96 html=$(lowdown &quot;$file&quot;)
97 echo -e &quot;html&quot; &gt;&gt; docs/index.html
98done
99</code></pre>
100
101<p><strong>Assets</strong>: Most static site generators recommend dropping image
102assets into the site source itself. That does have it&#8217;s
103merits, but I prefer hosting images separately:</p>
104
105<pre><code># strip file extension
106ext=&quot;${1##*.}&quot;
107
108# generate a random file name
109id=$( cat /dev/urandom | tr -dc &#39;a-zA-Z0-9&#39; | fold -w 2 | head -n 1 )
110id=&quot;$id.$ext&quot;
111
112# copy to my file host
113scp -P 443 &quot;$1&quot; emerald:files/&quot;$id&quot;
114echo &quot;https://files.nerdypepper.tech/$id&quot;
115</code></pre>
116
117<p><strong>Templating</strong>:
118<a href="https://github.com/NerdyPepper/site/blob/master/generate.sh"><code>generate.sh</code></a>
119brings the above bits and pieces together (with some extra
120cruft to avoid javascript). It uses <code>sed</code> to produce nice
121titles from the file names (removes underscores,
122title-case), and <code>date(1)</code> to add the date to each post
123listing!</p>
124 <div class=separator></div>
125 </div>
126 </details>
127 37
128 <details class="post"> 38 <div class="post">
129 <summary> 39 <div class="date">07/11 2019</div>
130 <div class="date">07/11 2019</div> 40 <a href="/posts/my_setup.html" class="post-link">
131 <span class="post-link">My Setup</span> 41 <span class="post-link">My Setup</span>
132 </summary> 42 </a>
133 <div class="post-text"> 43 </div>
134 <p>Decided to do one of these because everyone does one of
135these.</p>
136
137<p><img src="https://files.nerdypepper.tech/Hb.png" alt="scrot" /></p>
138
139<p>My entire setup is managed with GNU <code>stow</code>, making it easier
140to replicate on fresh installations. You can find my
141configuration files on <a href="https://github.com/nerdypepper">GitHub</a>.</p>
142
143<p>I run Void Linux (glibc) on my
144<a href="https://store.hp.com/us/en/mdp/laptops/envy-13">HP Envy 13&quot; (2018)</a>.
145To keep things simple, I run a raw X session with <code>2bwm</code> as my
146window manager, along with <code>dunst</code> (notification daemon) and
147Sam&#8217;s <a href="https://github.com/sdhand/compton"><code>compton</code></a>
148(compositor) fork.</p>
149
150<p>I am a fan of GNU tools, so I use <code>bash</code> as my shell, and
151<code>coreutils</code> to manage files, archives, strings, paths etc. I
152edit files with <code>vim</code>, chat with <code>weechat</code>, listen to music
153with <code>cmus</code>, monitor processes with <code>htop</code>, manage sessions
154with <code>tmux</code>, read pdfs in <code>zathura</code>. I rarely ever leave
155the comfort of my terminal emulator, <code>urxvt</code>.</p>
156
157<p>Most of my academic typesetting is done with TeX, and
158compiled with <code>xelatex</code>. Other <em>fun</em> documents are made with
159GIMP :).</p>
160 <div class=separator></div>
161 </div>
162 </details>
163 44
164 <details class="post"> 45 <div class="post">
165 <summary> 46 <div class="date">12/10 2019</div>
166 <div class="date">12/10 2019</div> 47 <a href="/posts/WPA_woes.html" class="post-link">
167 <span class="post-link">WPA Woes</span> 48 <span class="post-link">WPA Woes</span>
168 </summary> 49 </a>
169 <div class="post-text"> 50 </div>
170 <p>I finally got around to installing Void GNU/Linux on my main
171computer. Rolling release, non-systemd, need I say more?</p>
172
173<p>As with all GNU/Linux distributions, wireless networks had
174me in a fix. If you can see this post, it means I&#8217;ve managed
175to get online. It turns out, <code>wpa_supplicant</code> was detecting the
176wrong interface by default (does it ever select the right
177one?). Let us fix that:</p>
178
179<pre><code>$ sudo rm -r /var/service/wpa_supplicant
180$ sudo killall dhcpcd
181</code></pre>
182
183<p>What is the right interface though?</p>
184
185<pre><code>$ iw dev
186 ...
187 Interface wlp2s0
188 ...
189</code></pre>
190
191<p>Aha! Let us run <code>wpa_supplicant</code> on that interface, as a
192background process:</p>
193
194<pre><code>$ sudo wpa_supplicant -B -i wlp2s0 -c /etc/wpa_supplicant/wpa_supplicant.conf
195$ sudo dhcpcd -B wlp2s0
196$ ping google.com
197PING ...
198</code></pre>
199
200<p>Yay! Make those changes perpetual by enabling the service:</p>
201
202<pre><code>------------------------------------------------------
203# Add these to /etc/wpa_supplicant/wpa_supplicant.conf
204OPTS=&quot;-B&quot;
205WPA_INTERFACE=&quot;wlp2s0&quot;
206------------------------------------------------------
207$ sudo ln -s /etc/sv/wpa_supplicant /var/service/
208$ sudo ln -s /etc/sv/dhcpcd /var/service/
209$ sudo sv restart wpa_supplicant
210$ sudo sv restart dhcpcd
211</code></pre>
212 <div class=separator></div>
213 </div>
214 </details>
215 51
216 <details class="post"> 52 <div class="post">
217 <summary> 53 <div class="date">07/08 2019</div>
218 <div class="date">07/08 2019</div> 54 <a href="/posts/bye_bye_BDFs.html" class="post-link">
219 <span class="post-link">Bye Bye BDFs</span> 55 <span class="post-link">Bye Bye BDFs</span>
220 </summary> 56 </a>
221 <div class="post-text"> 57 </div>
222 <p>Glyph Bitmap Distribution Format is no more, as the creators of
223<a href="https://pango.org">Pango</a>, one of the most widely used text rendering
224libraries,
225<a href="https://blogs.gnome.org/mclasen/2019/05/25/pango-future-directions/">announced</a>
226their plans for Pango 1.44.</p>
227
228<p>Until recently, Pango used FreeType to draw fonts. They will be moving over
229to <a href="https://harfbuzz.org">Harfbuzz</a>, an evolution of FreeType.</p>
230
231<p><em>Why?</em></p>
232
233<p>In short, FreeType was hard to work with. It required complex logic, and
234provided no advantage over Harfbuzz (other than being able to fetch
235opentype metrics with ease).</p>
236
237<p>Upgrading to Pango v1.44 will break your GTK applications (if you use a
238<code>bdf</code>/<code>pcf</code> bitmap font). Harfbuzz <em>does</em> support bitmap-only OpenType fonts,
239<code>otb</code>s. Convert your existing fonts over to <code>otb</code>s using
240<a href="https://fontforge.github.io">FontForge</a>. It is to be noted that applications
241such as <code>xterm</code> and <code>rxvt</code> use <code>xft</code> (X FreeType) to render fonts, and will
242remain unaffected by the update.</p>
243
244<p>Both <a href="https://github.com/nerdypepper/scientifica">scientifica</a> and
245<a href="https://github.com/nerdypepper/curie">curie</a> will soon ship with bitmap-only
246OpenType font formats.</p>
247 <div class=separator></div>
248 </div>
249 </details>
250 58
251 <details class="post"> 59 <div class="post">
252 <summary> 60 <div class="date">02/08 2019</div>
253 <div class="date">02/08 2019</div> 61 <a href="/posts/onivim_sucks.html" class="post-link">
254 <span class="post-link">Onivim Sucks</span> 62 <span class="post-link">Onivim Sucks</span>
255 </summary> 63 </a>
256 <div class="post-text"> 64 </div>
257 <p><a href="https://v2.onivim.io">Onivim</a> is a &#8216;modern modal editor&#8217;, combining fancy
258interface and language features with vim-style modal editing. What&#8217;s wrong you
259ask?</p>
260
261<p>Apart from <a href="https://github.com/onivim/oni2/issues/550">buggy syntax highlighting</a>,
262<a href="https://github.com/onivim/oni2/issues/519">broken scrolling</a> and
263<a href="https://github.com/onivim/oni2/issues?q=is%3Aissue+label%3A%22daily+editor+blocker%22+is%3Aopen">others</a>,
264Onivim is <strong>proprietary</strong> software. It is licensed under a commercial
265<a href="https://github.com/onivim/oni1/blob/master/Outrun-Labs-EULA-v1.1.md">end user agreement license</a>,
266which prohibits redistribution in both object code and source code formats.</p>
267
268<p>Onivim&#8217;s core editor logic (bits that belong to vim), have been separated from
269the interface, into <a href="https://github.com/onivim/libvim">libvim</a>. libvim is
270licensed under MIT, which means, this &#8216;extension&#8217; of vim is perfectly in
271adherence to <a href="http://vimdoc.sourceforge.net/htmldoc/uganda.html#license">vim&#8217;s license text</a>!
272Outrun Labs are exploiting this loophole (distributing vim as a library) to
273commercialize Onivim.</p>
274
275<p>Onivim&#8217;s source code is available on <a href="https://github.com/onivim/oni2">GitHub</a>.
276They do mention that the source code trickles down to the
277<a href="https://github.com/onivim/oni2-mit">oni2-mit</a> repository, which (not yet) contains
278MIT-licensed code, <strong>18 months</strong> after each commit to the original repository.</p>
279
280<p>Want to contribute to Onivim? Don&#8217;t. They make a profit out of your contributions.
281Currently, Onivim is priced at $19.99, &#8216;pre-alpha&#8217; pricing which is 80% off the
282final price! If you are on the lookout for an editor, I would suggest using
283<a href="https://vim.org">Vim</a>, charity ware that actually works, and costs $100 lesser.</p>
284 <div class=separator></div>
285 </div>
286 </details>
287 65
288 <details class="post"> 66 <div class="post">
289 <summary> 67 <div class="date">31/07 2019</div>
290 <div class="date">31/07 2019</div> 68 <a href="/posts/bash_harder_with_vim.html" class="post-link">
291 <span class="post-link">Bash Harder With Vim</span> 69 <span class="post-link">Bash Harder With Vim</span>
292 </summary> 70 </a>
293 <div class="post-text"> 71 </div>
294 <p>Bash is tricky, don&#8217;t let your editor get in your way. Here&#8217;s a couple of neat
295additions you could make to your <code>vimrc</code> for a better shell programming
296experience.</p>
297
298<hr/>
299
300<h4 id="Man%20pages%20inside%20vim">Man pages inside vim</h4>
301
302<p>Source this script to get started: </p>
303
304<pre><code>runtime ftplugin/man.vim
305</code></pre>
306
307<p>Now, you can open manpages inside vim with <code>:Man</code>! It adds nicer syntax highlighting
308and the ability to jump around with <code>Ctrl-]</code> and <code>Ctrl-T</code>.</p>
309
310<p>By default, the manpage is opened in a horizontal split, I prefer using a new tab:</p>
311
312<pre><code>let g:ft_man_open_mode = &#39;tab&#39;
313</code></pre>
314
315<hr/>
316
317<h4 id="Scratchpad%20to%20test%20your%20commands">Scratchpad to test your commands</h4>
318
319<p>I often test my <code>sed</code> substitutions, here is
320a sample from the script used to generate this site: </p>
321
322<pre><code># a substitution to convert snake_case to Title Case With Spaces
323echo &quot;$1&quot; | sed -E -e &quot;s/\..+$//g&quot; -e &quot;s/_(.)/ \u\1/g&quot; -e &quot;s/^(.)/\u\1/g&quot;
324</code></pre>
325
326<p>Instead of dropping into a new shell, just test it out directly from vim!</p>
327
328<ul>
329<li><p>Yank the line into a register:</p>
330
331<pre><code>yy
332</code></pre></li>
333<li><p>Paste it into the command-line window:</p>
334
335<pre><code>q:p
336</code></pre></li>
337<li><p>Make edits as required:</p>
338
339<pre><code>syntax off # previously run commands
340edit index.html # in a buffer!
341w | so %
342!echo &quot;new_post.md&quot; | sed -E -e &quot;s/\..+$//g&quot; --snip--
343^--- note the use of &#39;!&#39;
344</code></pre></li>
345<li><p>Hit enter with the cursor on the line containing your command!</p>
346
347<pre><code>$ vim
348New Post # output
349Press ENTER or type command to continue
350</code></pre></li>
351</ul>
352 <div class=separator></div>
353 </div>
354 </details>
355 72
356 <details class="post"> 73 <div class="post">
357 <summary> 74 <div class="date">30/07 2019</div>
358 <div class="date">30/07 2019</div> 75 <a href="/posts/hold_position!.html" class="post-link">
359 <span class="post-link">Hold Position!</span> 76 <span class="post-link">Hold Position!</span>
360 </summary> 77 </a>
361 <div class="post-text"> 78 </div>
362 <p>Often times, when I run a vim command that makes &#8220;big&#8221; changes to a file (a
363macro or a <code>:vimgrep</code> command) I lose my original position and feel disoriented.</p>
364
365<p><em>Save position with <code>winsaveview()</code>!</em></p>
366
367<p>The <code>winsaveview()</code> command returns a <code>Dictionary</code> that contains information
368about the view of the current window. This includes the cursor line number,
369cursor coloumn, the top most line in the window and a couple of other values,
370none of which concern us.</p>
371
372<p>Before running our command (one that jumps around the buffer, a lot), we save
373our view, and restore it once its done, with <code>winrestview</code>.</p>
374
375<pre><code>let view = winsaveview()
376s/\s\+$//gc &quot; find and (confirm) replace trailing blanks
377winrestview(view) &quot; restore our original view!
378</code></pre>
379
380<p>It might seem a little overkill in the above example, just use &#8220; (double
381backticks) instead, but it comes in handy when you run your file through
382heavier filtering.</p>
383 <div class=separator></div>
384 </div>
385 </details>
386 79
387 <details class="post"> 80 <div class="post">
388 <summary> 81 <div class="date">29/07 2019</div>
389 <div class="date">29/07 2019</div> 82 <a href="/posts/get_better_at_yanking_and_putting_in_vim.html" class="post-link">
390 <span class="post-link">Get Better At Yanking And Putting In Vim</span> 83 <span class="post-link">Get Better At Yanking And Putting In Vim</span>
391 </summary> 84 </a>
392 <div class="post-text"> 85 </div>
393 <ol start="1">
394<li><p>reselecting previously selected text (i use this to fix botched selections):</p>
395
396<pre><code>gv &quot; :h gv for more
397 &quot; you can use `o` in visual mode to go to the `Other` end of the selection
398 &quot; use a motion to fix the selection
399</code></pre></li>
400<li><p>reselecting previously yanked text:</p>
401
402<pre><code>`[v`]
403`[ &quot; marks the beginning of the previously yanked text :h `[
404`] &quot; marks the end :h `]
405 v &quot; visual select everything in between
406
407nnoremap gb `[v`] &quot; &quot;a quick map to perform the above
408</code></pre></li>
409<li><p>pasting and indenting text (in one go):</p>
410
411<pre><code>]p &quot; put (p) and adjust indent to current line
412]P &quot; put the text before the cursor (P) and adjust indent to current line
413</code></pre></li>
414</ol>
415 <div class=separator></div>
416 </div>
417 </details>
418 86
419</div> 87</div>
420</body> 88</body>
generated by cgit v1.2.3 (git 2.25.1) at 2024-12-26 15:05:12 +0000