2259 lines
210 KiB
XML
2259 lines
210 KiB
XML
<?xml version="1.0" encoding="UTF-8"?>
|
|
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
|
|
<channel>
|
|
<title>leafbytes blog</title>
|
|
<link>https://leafbytes.com</link>
|
|
<language>en-us</language>
|
|
<atom:link href="http://leafbytes.com/feed.rss" rel="self" type="application/rss+xml" />
|
|
<description>Articles on Web Development, Development Tools, and Linux</description>
|
|
<item>
|
|
<pubDate>Fri, 04 Nov 2022 12:30:00 +0200</pubDate>
|
|
<title>One With The Keyboard</title>
|
|
<link>https://leafbytes.com/one-with-the-keyboard</link>
|
|
<guid isPermaLink="false">414153c9pcqklkdaqh77pii7zddktqkyl07n028j</guid>
|
|
<description>
|
|
<h1>one with the keyboard</h1>
|
|
<h3>a necessary prerequisite</h3>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/home-row-e938435b.webp</url>
|
|
<title>Home Row Position</title>
|
|
</image>
|
|
<blockquote class="article-quotes" cite="https://www.brainyquote.com">
|
|
"What I was proud of was that I used very few parts to build a computer that could actually
|
|
speak words on a screen and type words on a keyboard and run a programming language that could
|
|
play games. And I did all this myself."
|
|
<br> -Steve Wozniak
|
|
</blockquote>
|
|
<p class="article-content">
|
|
When I decided to dive in deep, and make my best attempt at learning everything I could about
|
|
Computers, I had already been, what is commonly called, a "Power User" of computers (at least
|
|
when it came to the Windows Operating System), and so didn't have as tough a time as some would have
|
|
when I started my journey into learning the intricacies of computer programming. I have been a more
|
|
than adequate typist since the age of eight years old and had taken the time to learn more
|
|
than a few keyboard shortcuts. These skills would prove invaluable as they would compound
|
|
on the skills necessary for basic desktop operations, and eventually, programming.
|
|
</p>
|
|
<p class="article-content">
|
|
There is such a huge skill and knowledge divide between the average everyday user of today's
|
|
computers and today's programmers, and that divide is becoming ever wider with the emphasis placed on
|
|
tablets, phones, and touchscreens. In many ways, the ability to adequately type is becoming a
|
|
lost art form that only college graduates are capable of, let alone the amount of those who
|
|
know about basic keyboard shortcuts. These skills, while not uncommon, are also not as ubiquitous
|
|
as they should be, especially when considering the prevalence of computers in our lives.
|
|
</p>
|
|
<p class="article-content">
|
|
So where do you get started when learning to code? If you already can type adequately without
|
|
looking down at your hands, and are familiar with some basic keyboard shortcuts, then honestly
|
|
you are miles ahead than those who start this journey with absolutely no knowledge of keyboards,
|
|
let alone computers. But this blog is written by a beginner computer programmer. So come, let
|
|
the blind lead the blind..., and let's cover some basics.
|
|
</p>
|
|
<p class="article-content">
|
|
Learning to type adequately and get to the minimum threshold of being able to comfortably type
|
|
40WPM will take about two months of dedicated practice by my estimation (if you are a complete
|
|
beginner), practicing at least 2 hours a day. Other than a desktop/laptop computer and a
|
|
screen, you will(obviously) need a keyboard to get started. You should purchase a keyboard that
|
|
is comfortable to you, but, ultimately, any modern keyboard will do for the purposes of
|
|
learning how to type as long as it has the standard QWERTY layout(if the upper left hand row of
|
|
your keyboard spells out QWERTY, you're good to go).
|
|
</p>
|
|
<p class="article-content">
|
|
The next resource you'll need is a typing tutorial/course. These can be paid or free, but I'd
|
|
recommend that you simply go to any of the multitude of free online resources. I personally like
|
|
<a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://www.typingtest.com/trainer/">typing test</a>.
|
|
</p>
|
|
<p class="article-content">
|
|
At first you will find yourself typing slowly and looking down at the keyboard often. Do not
|
|
fret, and do your best to not get frustrated. Learning a new skill takes time and is rarely a
|
|
comfortable experience. Whenever you find yourself looking down at the keyboard, return your
|
|
fingers to the home row, place your index fingers on the j and f keys, feel the raised bars at
|
|
the bottom of the keys with your fingers to remind yourself of the tactile sensation of being
|
|
in the proper starting position, and continue to memorize where each key is. Eventually this
|
|
muscle memory will become engrained in you, and you will be more focused on what you are
|
|
trying to type, rather than the location of the keys.
|
|
</p>
|
|
<p class="article-content">
|
|
Once you feel you can write a short essay (2 pages long), at about 40wpm, you are ready to move
|
|
onto learning some basic keyboard shortcuts. This is markedly easier than learning to type, but
|
|
provides you with an ability to navigate applications (particularly the web browser and word
|
|
processor) much faster, and ultimately this makes doing research and editing documents much
|
|
easier, with the added benefit of making you more productive as your typing speed is no longer
|
|
a bottleneck. Here are some of the basic keyboard shortcuts that exist on the most common desktop
|
|
platforms:
|
|
</p>
|
|
<p class="article-content">
|
|
On the Browser:
|
|
<ul class="article-lists">
|
|
<li>ctrl+tab (cycle forward one open tab)</li>
|
|
<li>ctrl+shift+tab (cycle backward one tab)</li>
|
|
</ul>
|
|
</p>
|
|
<p class="article-content">
|
|
Standard Word Processors:
|
|
<ul class="article-lists">
|
|
<li>ctrl+a (select all text)</li>
|
|
<li>ctrl+c (copy selected text to the clipboard)</li>
|
|
<li>ctrl+v (paste selected text from the clipboard)</li>
|
|
<li>ctrl+z (undo last action)</li>
|
|
<li>ctrl+right-arrow (navigate to the next word)</li>
|
|
<li>ctrl+left-arrow (navigate to the last word)</li>
|
|
<li>ctrl+shift+right-arrow (highlight and navigate to the next word)</li>
|
|
<li>ctrl+shift+left-arrow (highlight and navigate to the last word)</li>
|
|
</ul>
|
|
</p>
|
|
<p class="article-content">
|
|
On the desktop:
|
|
<ul class="article-lists">
|
|
<li>super(windows/command key)+tab (navigate through the open applications)</li>
|
|
<li>super(windows/command key)+shift+tab (navigate through the open applications reversed)</li>
|
|
</ul>
|
|
</p>
|
|
<p class="article-content">
|
|
The skill of typing and knowing certain keyboard shortcuts are not necessary to
|
|
learning how to code, but having a basic proficiency in typing will make learning
|
|
to code much easier. An approachable way to think about the learning process when it comes to
|
|
typing is that it is very much akin to learning how to walk. Using the mouse can be thought of
|
|
as crawling, typing as walking, and utilizing slightly more advanced tools like keyboard
|
|
shortcuts and text editors like Vim as running. All this said, there is a point of
|
|
diminishing returns when it comes to the correlation between quality of code and typing speed.
|
|
At some point you are reading code and looking at code and thinking about code much more than
|
|
simply typing it. You do not need to have the typing speed of a courtroom stenographer to learn
|
|
how to code, but it is essential that your typing speed (or lack thereof) not hinder your train
|
|
of thought when you are writing code. The location of the keys must be
|
|
subconscious in your mind so that the only constraint is the speed of your thoughts, not the
|
|
speed of your fingers.
|
|
</p>
|
|
<p class="article-content">
|
|
I was once told that learning to code and program was like learning to wield a great lever.
|
|
Once I had learned the skills to a certain capability, I would be able to do a lot with a
|
|
single flip of a switch. I believe this to be absolutely true. This makes the importance of
|
|
learning to type ever the more important. Until communicating with computers is done in a more
|
|
intuitive and immediate fashion, keyboards will remain one of the most important tools in the
|
|
modern world, as they are, undoubtedly, the predominant way we interface with computers, and
|
|
will be for the foreseeable future.
|
|
</p>
|
|
</description>
|
|
</item>
|
|
<item>
|
|
<pubDate>Sat, 05 Nov 2022 12:30:00 +0200</pubDate>
|
|
<title>Command Line</title>
|
|
<link>https://leafbytes.com/command-line</link>
|
|
<guid isPermaLink="false">mnizktlxioyudyvayisqpmigkyeyhtxuorwumlel</guid>
|
|
<description>
|
|
<h1>command line</h1>
|
|
<h3>getting comfy in the shell</h3>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/Bash_Logo_Colored-47300f4e.webp</url>
|
|
<title>Bash Logo</title>
|
|
</image>
|
|
<blockquote class="article-quotes" cite="https://www.cs.princeton.edu/~bwk/memoir.html">
|
|
"By this point, the shell had become a real programming language, suitable for writing
|
|
pretty much anything that could reasonably be formulated as a sequence of commands.
|
|
It could often do this well enough that there was no need to write a C program."
|
|
<br> -Brian Kernighan
|
|
</blockquote>
|
|
<p class="article-content">
|
|
Learning to Program can be an intimidating venture. Not only is there a plethora of programming languages, libraries, frameworks, text editors, and more, there is also the overwhelming amount of opinions amongst more experienced programmers one might consider when deciding between which of these tools is best. Navigating all of this is no easy task and it is something I still struggle with when examining a field of software development I have little knowledge of (pretty much all of it).
|
|
</p>
|
|
<p class="article-content">
|
|
How does one know which text editor to choose? Which programming language should I learn first? Should I use MacOS or Windows? (hint: neither). One of the more uncommon (although not necessarily rare) questions asked amongst beginner developers is, which shell should I use?
|
|
</p>
|
|
<p class="article-content">
|
|
Before I dive into this topic, I feel like it may be prudent to address the simple question of, what is a shell?
|
|
</p>
|
|
<p class="article-content">
|
|
If you have done any amount of beginner programming, systems administration,
|
|
database management, or other computer related work, it is likely you have already
|
|
interacted with The Terminal (Emulator)/The Command Line and its close companion, The Shell.
|
|
I shall very briefly address what each of these are, and why, together, they are the most
|
|
important tool for anyone interested in interacting with computers at any meaningful level.
|
|
</p>
|
|
<p class="article-content">
|
|
In Windows, it is known as The Command Prompt(or Powershell), in MacOS it is known as The
|
|
Terminal, and in Linux and BSD, it is also known simply as the Terminal. The history of the
|
|
terminal is extensive, and I would only be doing you a disservice to you were I to attempt to
|
|
explain it in depth to you. For the sake of brevity, I shall simply explain how The Command Line
|
|
and shell pertain to you, the prospective Computer Programmer, and why it is so important for all
|
|
programmers to become familiar with it.
|
|
</p>
|
|
<p class="article-content">
|
|
If you were to open up Command Prompt in Windows, or the Terminal in MacOS, you would be presented
|
|
with a black (or blue) colored screen, usually prefaced by a series of characters known as a prompt,
|
|
and a cursor indicating the program is awaiting you to type something (to provide input via the keyboard).
|
|
To the uninitiated, this is intimidating, especially after inputting something and getting a mean looking
|
|
error message. I must admit, whenever anyone who is unfamiliar with computers has seen me working in the
|
|
terminal, they have often thrown around terms like "hacker." I find this to be so funny, because it simply
|
|
shows how media has failed to portray technology in an accurate light (save for modern exceptions like Mr.
|
|
Robot and Halt and Catch Fire, and even those are not completely accurate). Although hackers do indeed use
|
|
the command line, so do nearly all computer related professions!
|
|
</p>
|
|
<p class="article-content">
|
|
When I first began programming, I started focusing mainly on the tool of the text editor.
|
|
It was only when I began to seriously dive into the world of Linux that I began to play
|
|
around in the terminal. Even in my early days using Linux, however, I rarely interacted
|
|
with the Terminal. This is partially because for at least some time at the beginning, typing
|
|
in the shell felt laborious, more boring than programming (which it still is), and not worth
|
|
investigating beyond the few times I had to invoke a command, or start a program. And it's true
|
|
that the shell is just a tool that allows you to invoke commands that call other programs...but
|
|
that's why it will always be one of the best pieces of software in your tool belt.
|
|
</p>
|
|
<p class="article-content">
|
|
Just like everything in the world of programming, there is rarely just one option when it comes
|
|
to tools, and almost never just one way to do things. The same is true of shells, but just like
|
|
these other aspects of the programming world, it doesn't mean there haven't been some clear winners
|
|
in that space as well.
|
|
</p>
|
|
<p class="article-content">
|
|
Although I know I will get some push back on this from Windows Users, it simply is the case that
|
|
the UNIX-style shell won out. Specifically the BASH shell is the one most utilized by default in
|
|
nearly all Linux Distributions, and was also the primary shell utilized in MacOS until recently
|
|
(which currently utilizes the Z shell). Regardless of which shell you utilize, many of them have
|
|
similar commands that perform a plethora of operations via your operating system. It is due to this
|
|
common history with the BASH Shell, and the features that are available specifically within the BASH
|
|
shell scripting language, that it is worthwhile to dive deep into the subject of the shell and shell
|
|
scripting. The shell is your direct link to working on and with the operating system while utilizing
|
|
a high level language to do so. Bash, while not a full featured programming language, is an extremely
|
|
powerful scripting language which owes its (somewhat niche) popularity to the simple fact that GNU/Linux
|
|
is everywhere, and thusly, so is its default shell, bash. Indeed, it is due to the basic UNIX tool
|
|
set and the choice by the maintainers of GNU/Linux, BSD, and MacOS to adopt bash as their primary shell
|
|
of choice that it proliferated.
|
|
</p>
|
|
<p class="article-content">
|
|
At this point in the article I will digress on the subject of scripting, as a beginner is best suited
|
|
to learning a few basic commands, understanding some of bash's basic features, and how the use of the
|
|
terminal in programming is essential. Please note that while you can follow along in Windows, I will
|
|
not be covering Windows specific Powershell commands. Unfortunately Windows does not have BASH in its
|
|
software suite by default, and you must install The Windows SubSystem For Linux(WSL) or Cygwin to utilize
|
|
many of the same commands.
|
|
</p>
|
|
<p class="article-content">
|
|
Following the instructions below, note the effects.
|
|
</p>
|
|
<p class="article-content">
|
|
Navigate to your operating systems main menu
|
|
<ul class="article-lists">
|
|
<li>(MacOS - Click the Launchpad Icon in the Dock, type Terminal and click Terminal)</li>
|
|
<li>(Linux/BSD - Look up which Terminal Emulator your distribution uses by default and open it)</li>
|
|
</ul>
|
|
</p>
|
|
<p class="article-content">
|
|
You will be presented with a simple black, amber, or blue colored window with a prompt ending in either
|
|
% or $ (zsh uses %, bash uses $). There is also usually a rectangular cursor indicating the shell is
|
|
awaiting input from you. Typing just anything into the terminal and getting error messages gets old quick,
|
|
so let's explore our first command, ls:
|
|
</p>
|
|
<pre><code class="language-bash">[~]$ ls</code></pre>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_ls_command-9c721e3b.webp</url>
|
|
<title>ls command results</title>
|
|
</image>
|
|
<p class="article-content">
|
|
Colloquially, each command will, in theory, be an abbreviation or shortened anagram for a word that will
|
|
remind you of the action often associated with the command. In this case ls stands simply for 'list' as in
|
|
'list all my files and directories'. Here you can see that when I type in ls, I am presented with the contents
|
|
of what is known as my $HOME directory (we'll cover the $ later). Usually, the ls command has been
|
|
slightly modified so that colors appear on some of the results, indicating the type of file the result is,
|
|
or whether or not the result is a directory.
|
|
</p>
|
|
<p class="article-content">
|
|
If we then, for our second command, type 'ls' again, but this time follow it with a '-a',
|
|
we are presented with slightly different results:
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_ls_with_aflag-95942ec5.webp</url>
|
|
<title>ls command with -a results</title>
|
|
</image>
|
|
|
|
<p class="article-content">
|
|
Here we see that we now have a lot more files and directories, many preceded with a '.',
|
|
which are our 'hidden' files and directories. There have been more than a few discussions
|
|
on the concept of hidden files, but needless to say, these files/directories are not visible
|
|
without the '-a' appended to our 'ls' command. I point this out as an introduction to the
|
|
concept of flags. '-a' is considered a flag of the 'ls' command that changes the results in
|
|
some fashion. In this case it stands for 'all', as in show 'list all of my files, yes even
|
|
the hidden ones.'
|
|
</p>
|
|
<p class="article-content">
|
|
Many commands, although not all commands, have flags which somehow change the behavior of the
|
|
program being called.
|
|
</p>
|
|
<p class="article-content">
|
|
I won't go into all the commands available in the shell as there are quite a lot, but I will
|
|
provide you with some standard commands to research and become familiar with, as they will become
|
|
invaluable later on:
|
|
<ul class="article-lists">
|
|
<li>man</li>
|
|
<li>cd</li>
|
|
<li>mkdir/rmdir</li>
|
|
<li>touch/rm</li>
|
|
<li>cp</li>
|
|
<li>mv</li>
|
|
<li>echo/print/printf</li>
|
|
<li>cat/tac</li>
|
|
<li>less</li>
|
|
<li>head/less</li>
|
|
<li>read</li>
|
|
<li>find</li>
|
|
<li>sed</li>
|
|
<li>grep</li>
|
|
<li>awk</li>
|
|
<li>tr</li>
|
|
<li>df</li>
|
|
<li>top</li>
|
|
<li>ps</li>
|
|
<li>diff</li>
|
|
<li>dd</li>
|
|
<li>who</li>
|
|
</ul>
|
|
</p>
|
|
<p class="article-content">
|
|
Now, all of these tools are great, but lack luster by comparison to your standard
|
|
Graphical User Interface (GUI) programs that most users interact with on their desktops.
|
|
The power of the shell isn't in that it can execute programs (although that is its main purpose),
|
|
it is its ability to chain together, redirect and manipulate the input and output of various programs
|
|
to yield a desired result...that's right, the bash shell also has a scripting language, which with the
|
|
use of various operators can chain together to manipulate textual inputs and outputs.
|
|
Take this simple example:
|
|
</p>
|
|
<pre><code class="language-bash">[~]$ echo 'this text is inputted from the command line' from_the_command_line.txt</code></pre>
|
|
<p class="article-content">
|
|
Here we simultaneously created a file called 'from_the_command_line.txt' and wrote the
|
|
text 'this text is inputted from the command line' into it. If we then inspect the
|
|
contents of this file using cat:
|
|
</p>
|
|
<pre><code class="language-bash">[~]$ cat from_the_command_line.txt</code></pre>
|
|
<p class="article-content">
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_redirection_01-09a8114f.webp</url>
|
|
<title>cat command results</title>
|
|
</image>
|
|
<p class="article-content">
|
|
We'll see that indeed, the text 'this text is inputted from the command line' is
|
|
there. What is happening here?
|
|
</p>
|
|
<p class="article-content">
|
|
Well just like every problem in programming, we divide the problem up into sizeable
|
|
chunks, and explain each part to the best of our abilities (and hopefully our peers
|
|
very kindly correct us if we are wrong).
|
|
</p>
|
|
<p class="article-content">
|
|
Firstly, what does echo do? Well if you researched my list up above a bit, you'll know
|
|
that the first recommended command was the 'man' command. Why? Well it's the manual of
|
|
course! Any command you wish to know more about can be investigated by invoking 'man'
|
|
before the command you wish to know more about, if you type:
|
|
</p>
|
|
<pre><code class="language-bash">[~]$ man echo</code></pre>
|
|
<p class="article-content">
|
|
You'll see an extensive explanation of the 'echo' command and its various flags. A
|
|
relatively easy to understand program, echo simply displays any text following the
|
|
command back to you. So the input that was entered after the
|
|
'echo' simply displays that input as the output. Thusly invoking:
|
|
</p>
|
|
<pre><code class="language-bash">[~]$ echo 'this litle sheep went bah'</code></pre>
|
|
<p class="article-content">
|
|
Displays:
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_echo_command-f890e6b2.webp</url>
|
|
<title>echo command results</title>
|
|
</image>
|
|
<p class="article-content">
|
|
But what about the '>' character in our initial example? Well this is what is
|
|
known as a redirection operator. This '>' will 'redirect' whatever is the output
|
|
of the first command(echo) as the input written to the following file or program.
|
|
Please note that this will overwrite any existing text already present in the file,
|
|
so don't experiment on any file with valuable information to you. If you do wish to
|
|
append to the file, without overwriting its existing text, simply double up on the
|
|
greater than symbol:
|
|
</p>
|
|
<p class="article-content">
|
|
<pre><code class="language-bash">[~]$ echo 'appended text' >> from_the_command_line.txt</code></pre>
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_echo_append-6b223071.webp</url>
|
|
<title>echo with append command results</title>
|
|
</image>
|
|
<p class="article-content">
|
|
If you wish to research one of the most powerful operators in bash, research
|
|
the pipe ('|') operator!
|
|
</p>
|
|
<p class="article-content">
|
|
Hopefully at this point, you are starting to understand the role of the shell
|
|
and the command line a bit better. For this next example, I am going to demonstrate
|
|
how many programs have a command line interface with which one may interact, or at
|
|
least initialize, a program, be it a Graphical or Terminal based application.
|
|
</p>
|
|
<p class="article-content">
|
|
One of the first epiphanies for me regarding the terminal was when I realized I could
|
|
invoke pretty much any program in my operating system with simple commands. If I wished
|
|
to open my browser (librewolf), I simply had to type into the terminal its name:
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_librewolf-18d59d70.webp</url>
|
|
<title>librewolf browser being called from the command line</title>
|
|
</image>
|
|
<p class="article-content">
|
|
While this may not seem like a big deal to some, it was upon doing this that I realized
|
|
why the terminal was powerful, it allowed any program to be invoked as long as you knew
|
|
its name. Rather than clicking through a myriad of nested directories to find where I had
|
|
put an executable (like when using Windows File Explorer), I simply had to type it out and
|
|
it would open up on my screen.
|
|
</p>
|
|
<p class="article-content">
|
|
When I first installed Linux, the first piece of graphical software I had become familiar with
|
|
was the backup utility, Timeshift, which essentially takes a 'snapshot' of the current state of
|
|
your desktop and allows you to 'revert' back to that snapshot should you want/need to.
|
|
</p>
|
|
<p class="article-content">
|
|
Timeshift has both a Graphical User Interface(GUI) as well as a Command Line Interface(CLI).
|
|
I first learned to use Timeshift utilizing the GUI, but then I became curiouos about the CLI.
|
|
It wasn't long before I realized that most of the information available via the GUI interface
|
|
could be accessed via the CLI. I really only needed four commands, these were:
|
|
<ul class="article-lists">
|
|
<li>timeshift --create</li>
|
|
<li>timeshift --delete</li>
|
|
<li>timeshift --list</li>
|
|
<li>timeshift --restore</li>
|
|
</ul>
|
|
</p>
|
|
<p class="article-content">
|
|
And every once in a while, after an update on my system, I would invoke the 'timeshift create'
|
|
command to create a snapshot of my current system. Timeshift has occasionally saved me from big
|
|
mistakes I've made, and is a good piece of software.
|
|
</p>
|
|
<p class="article-content">
|
|
The reason I point this out is that even though timeshift isn't a part of the shell as a subject,
|
|
it is a practical example of when utilizing the text interface of Timeshift's CLI, via the shell,
|
|
became more useful to me than interfacing with the GUI version. This became even more the case when
|
|
I discovered the existence of shell aliases.
|
|
</p>
|
|
<p class="article-content">
|
|
Of course, I've provided you now with the knowledge of how to do your own research regarding any
|
|
command, so be sure to pull up:
|
|
</p>
|
|
<pre><code class="language-bash">[~]$ man alias</code></pre>
|
|
<p class="article-content">
|
|
And do more research, but I'll give you a general idea of why this is such a powerful tool
|
|
for anyone invested in computers to know. Essentially aliases are a series of commands invoked
|
|
by a custom command of your naming.
|
|
</p>
|
|
<p class="article-content">
|
|
If you invoke:
|
|
</p>
|
|
<pre><code class="language-bash">[~]$ alias cdls="cd ~/Documents & ls"</code></pre>
|
|
<p class="article-content">
|
|
You will navigate into your Documents directory and then list out its contents after
|
|
invoking your custom command, 'cdls'
|
|
</p>
|
|
<p class="article-content">
|
|
The '&' is another operator that waits for one command to complete before then invoking
|
|
the following command.The '&' operator can be chained as many times as desired and when
|
|
applied to an alias, essentially condenses a very long command into a shorter command (unless
|
|
you name your alias something very long I suppose).
|
|
</p>
|
|
<p class="article-content">
|
|
Now, the somewhat annoying thing is that these aliases, when created this way, are forgotten
|
|
as soon as you close the terminal or your shell session somehow ends. Aliases can be saved,
|
|
however, by placing them in your ~/.bashrc file. This configuration file is checked by the
|
|
shell prior to initiation, including alias assignments. Thusly, if you simply append:
|
|
</p>
|
|
<pre><code class="language-bash">[~]$ alias cdls="cd ~/Documents & ls"</code></pre>
|
|
<p class="article-content">
|
|
To the end of your ~/.bashrc file, you will have created a custom command that persists even
|
|
after you have closed your terminal and shut down your computer.
|
|
</p>
|
|
<p class="article-content">
|
|
This is the very essentials of scripting, the chaining of programs together to create different
|
|
results. An alias is essentially a one line script.
|
|
</p>
|
|
<p class="article-content">
|
|
While it wasn't one of my first aliases I ever wrote, I do have a single alias I will share with
|
|
you that I use often, it simply invokes timeshift three times, once to delete the old backup, once
|
|
to create a new backup, and once to list out all backups so I can confirm that the backup was made,
|
|
I called it tshift, this is the command in my .bashrc:
|
|
</p>
|
|
<pre><code class="language-bash">[~]$ alias tshift="sudo timeshift --delete && sudo timeshift --create && sudo timeshift --list"</code></pre>
|
|
<p class="article-content">
|
|
As you can see, tshift is far less characters to type, and it is a very handy, but very simple,
|
|
alias I have created for myself. (if you are on Linux and unfamiliar with the sudo command, please
|
|
see the man pages for sudo, if you are on MacOs, a simple query into your favorite search
|
|
engine I am sure will yield good results).
|
|
</p>
|
|
<p class="article-content">
|
|
Aliases is where I leave this short introduction to the Command Line and shell. It is at this
|
|
point that the subject of bash scripting should be covered, and that is an extensive topic of
|
|
its own.
|
|
</p>
|
|
<p class="article-content">
|
|
I do hope that you have now gained a better understanding and appreciation for the command line
|
|
and the shell. The shell provides a direct, unobfuscated, and elegantly simple interface through
|
|
which all computer users can accomplish more with less, and is one of the best tools you can
|
|
become familiar with. So get comfy in it!
|
|
</p>
|
|
</description>
|
|
</item>
|
|
<item>
|
|
<pubDate>Sun, 06 Nov 2022 12:30:00 +0200</pubDate>
|
|
<title>Why Use Linux</title>
|
|
<link>https://leafbytes.com/why-use-linux</link>
|
|
<guid isPermaLink="false">oitfohvixqnaaodikksmjfvxfytubnxwksawnmsr</guid>
|
|
<description>
|
|
<h1>why use linux</h1>
|
|
<h3>learning to love the penguin</h3>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/linux_mint-b5a145ad.webp</url>
|
|
<title>A Screenshot of the Linux Mint MATE Desktop</title>
|
|
</image>
|
|
<blockquote class="article-quotes" cite="book: How Linux Works, by Brian Ward">
|
|
"You should be able to learn what your computer does. You should be able to make your software do what you want it to do (within the reasonable limits of its capabilities, of course). The key to attaining this power lies in understanding the fundamentals of what the software does and how it works.... You should never have to fight with a computer."
|
|
<br> -Brian Ward, <a class="blockquote-links" target="_blank" rel="noopener noreferrer" href="https://nostarch.com/howlinuxworks3">How Linux Works;</a>
|
|
</blockquote>
|
|
<p class="article-content">
|
|
If you have ever taken even a small amount of time to research the world of computers in any kind of capacity, you will have at one point or another heard about the Linux Operating System. There is a certain mystique surrounding Linux and Linux users to the uninitiated, as it is considered by many to be more "technically challenging," or, perhaps more derisively, "too complicated and time consuming for the average computer user." These criticisms indeed have their validity, but anything worth having in life never came easy...and Linux is no exception.
|
|
</p>
|
|
<p class="article-content">
|
|
Much has been written on the subject of Linux, and this article, without a doubt, will be a simple reiteration of some of the arguments you may have heard or read when it comes to why you should use Linux, along with my own opinions on the subject. That said, should you be an aspiring web developer or computer programmer, please know that any of the popular operating systems are more than suitable to learning how to program. Be it Windows, MacOS, Linux, or BSD, nearly anyone can learn to program on any of these popular Operating Systems. I simply believe that Linux is the best Operating Systems to dive deep into learning about computers and to start programming.
|
|
</p>
|
|
<p class="article-content">
|
|
This article is meant as a general introduction to Linux, and in order to field the question of "What is Linux?" to the uninitiated, it's first good to step back and briefly field the more broad question of "What is an Operating System?".
|
|
</p>
|
|
<h4 class="article-header4">What is an Operating System?</h4>
|
|
<p class="article-content">
|
|
I cannot under-emphasize the fact that I am generally new to the subject of computers, and thusly will probably butcher this explanation. I will, however, do my best to paraphrase and offer up a layman's definition of what an Operating System is.
|
|
</p>
|
|
<p class="article-content">
|
|
An Operating System is a piece of software that manages both the hardware and software on your computer. When you turn on your computer, the BIOS (Basic Input/Output System), a piece of firmware native to your motherboard, detects all hardware devices on your computer. Once all hardware devices have been registered, the BIOS then "looks" for a piece of software in memory where a program known as a "bootloader" is located. If found, it initializes this bootloader, which then, subsequently launches the "kernel". The kernel, at least for me, is a somewhat abstract concept that I oversimplify by describing it as being the "heart" of the Operating System. The kernel then launches the Operating System, which calls a series of programs, also known as processes or daemons (programs that run in the background), starting first with the "init" process. If all works well, you will be presented either with a Command Line Prompt, or a Desktop Environment.
|
|
</p>
|
|
<p class="article-content">
|
|
The most popular Operating System for desktop computers is Microsoft Windows, the second most popular being Apple's MacOs, and Linux comes in at third (BSD is fourth, but well below even 1% of overall desktop usage). It is important to note, however, that the majority of server computers around the world run Linux. (It is also of interest to note that both Google's Chrome OS and the Android OS are also based on Linux). The fact that Linux has come to be the predominant and preferred Operating System for server computers is one of the reasons I personally believe that it is a good Operating System to start on for learning about computer systems in general, although it is only one of many reasons which I will go into more detail later on in this article.
|
|
</p>
|
|
<p class="article-content">
|
|
The above explanation, to be clear, is a gross oversimplification, and I have no doubt that I am butchering it. For the sake of brevity, however, I will simply refer you to the following Wikipedia articles on the aforementioned topics should you desire a more in depth and succinct explanation on the topics:
|
|
</p>
|
|
<ul class="article-lists">
|
|
<li><a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://en.wikipedia.org/wiki/Linux">Wikipedia Article: Linux</a></li>
|
|
<li><a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://en.wikipedia.org/wiki/Operating_system">Wikipedia Article: Operating System</a></li>
|
|
<li><a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://en.wikipedia.org/wiki/BIOS">Wikipedia Article: BIOS</a></li>
|
|
<li><a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://en.wikipedia.org/wiki/Kernel_(operating_system)">Wikipedia Article: Kernel(operating system)</a></li>
|
|
<li><a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://en.wikipedia.org/wiki/Server_computer#Operating_systems">Wikipedia Article: Server(computing)</a></li>
|
|
</ul>
|
|
<h4 class="article-header4">What is Linux?</h4>
|
|
<p class="article-content">
|
|
Now that the subject of Operating Systems has been given the briefest of overviews,
|
|
let us now cover the subject of what exactly Linux is. As you probably have ascertained,
|
|
Windows, MacOs, and Linux are all Operating Systems that the majority of computer users are
|
|
familiar with from their interactions with their various devices, be it their Desktops,
|
|
Laptops, Phones, and/or Tablets. Each of these Operating Systems comes with a suite of
|
|
software, and as each Operating Systems has evolved over time, each has developed its own
|
|
sort of ecosystem, an opinionated approach as to how to address the variety of problems that
|
|
computer users and programmers encounter regularly.
|
|
</p>
|
|
<p class="article-content">
|
|
At this point, you might be asking, "If Linux is so great, why haven't I seen it around?" Well, the truth is you have. As I have pointed out before, Linux runs the majority of servers, and thusly, whenever you interact with a website or an application online, it is highly likely that the services you are interacting with are running on a Linux server (not to mention the predominance of Android devices which also all run Linux). The more apt question might be, "If Linux is so great, why haven't I seen it on Desktop/Laptops more often?" This is a more nuanced question, and rightly deserves its own article, but I will briefly address it here.
|
|
</p>
|
|
<p class="article-content">
|
|
Linux is not installed by default on most desktops/laptops. This is due to many factors, and there has been much discussion on why the "Linux Desktop" never took off. Indeed, "The Year of the Linux Desktop" is a meme within the Linux community, referring to an unspecified time in the future when The Linux Desktop will finally be realized as superior, and the majority of everyday computer users convert to Linux (something that is extremely unlikely to happen).
|
|
</p>
|
|
<p class="article-content">
|
|
Additionally, and perhaps more to the point, is the simple fact that Linux, being an extremely customizable system, has a "build it from the ground up," aspect to it, and the main interface for Linux will always be the command line, which requires (sometimes extensive) technical knowledge. Indeed, just to install Linux, you must download what is known as an ISO file, burn it to a USB stick (or other installation media), make some adjustments in your motherboard's BIOS, and then follow the installation instructions for that particular Linux distribution (at the end of this article, a brief introduction to this process is documented).
|
|
</p>
|
|
<p class="article-content">
|
|
Linux is a piece of Non-Proprietary Open Source Software under the GNU Public
|
|
License (GPL). This means that it is free to run, study, share, and modify however
|
|
you like (which is not the case when using Proprietary Operating Systems like Windows
|
|
and MacOs). The fact that Linux is Free and Open Source Software (commonly termed FOSS),
|
|
is one of the major reasons that Linux users at times can appear to be almost cultish or
|
|
emphatic about the superiority of The Linux Operating System. The philosophy around FOSS
|
|
can at times, in my experience, be seen as akin to a political or religious opinion, and
|
|
is held strongly by many within the Linux community. This, however, is not one of the
|
|
reasons I believe that it is worth your while to learn how to use The Linux Operating System,
|
|
but this phenomenon is something to take note of. This is because, should you choose to install
|
|
and use Linux, you will probably come across others within the Linux ecosystem who profess their
|
|
love for Linux with an almost emphatic fervor (I have been guilty of this myself).
|
|
</p>
|
|
<h4 class="article-header4">So Why Use Linux?</h4>
|
|
<p class="article-content">
|
|
At this point, I've covered the most basic aspects of what an Operating System is as well as what Linux is, but I have yet to get to the heart of why you should use Linux if you desire to know more about computers and computer programming. As I pointed out towards the beginning of this article, you can indeed learn programming on Windows and MacOs, and many people do. So what makes Linux better?
|
|
</p>
|
|
<p class="article-content">
|
|
In one word: freedom.
|
|
</p>
|
|
<p class="article-content">
|
|
Many who are advocates for <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://en.wikipedia.org/wiki/Free_and_open-source_software">Free and Open Source Software (FOSS)</a> are quick to point out that the "Free" in the title doesn't necessarily stand for "Free as in Free Beer" (i.e. Free as in No Charge), but rather that it stands for "Free as in Freedom." This has more to do with the fact that FOSS advocates are proponents for your freedom to modify the software however you see fit, which also includes your freedom to access the knowledge of how the software works. (As an interesting side note, there is a similar advocacy made by those among <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://en.wikipedia.org/wiki/Right_to_repair">The Right To Repair Movement</a>).
|
|
</p>
|
|
<p class="article-content">
|
|
Due to the fact that Linux is Free and Open Source Software, its entire source code is free to be run, studied, shared, and modified by its users however they see fit (at least on their personal machines). This is one of the major reasons to run Linux. While it takes (sometimes a great deal of) technical knowledge and a good deal of time to customize Linux, it is to your benefit to explore the Linux Operating System, as none of the source code is hidden from you, and you are free to modify the source code however you like (with both wonderful as well as disastrous effects depending on your intentions and skill level).
|
|
</p>
|
|
<p class="article-content">
|
|
This isn't to say that I'm modifying my Linux kernel on my personal machine (I'm not a <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://www.gentoo.org">Gentoo</a> user), but rather that the knowledge is freely available for me to investigate, and this transparency is reason enough for me to use it.
|
|
</p>
|
|
<p class="article-content">
|
|
That said, I know for even the most technically minded user, this philosophical treatise on FOSS is not a good enough reason to abandon their Windows or MacOs desktop machine and embrace Linux. For most of us looking to become more computer savvy, we want software that simply works, and works well. Luckily for the sake of my argument, Linux is one of the best examples of this.
|
|
</p>
|
|
<p class="article-content">
|
|
Towards the end of this article I will be going over how to install Linux, but I want to briefly touch on what one gains from even just this basic tutorial. Let us think on what happens to the average computer user who wakes up one day to discover their Windows or MacOs machine has stopped working (they are presented with the dreaded blue screen or black screen of death).
|
|
</p>
|
|
<p class="article-content">
|
|
The average user may actually just throw away the machine without even thinking twice. They have money to burn and don't care about the environmental cost of chucking an electronic device. Others, who are a bit more budget conscious (or environmentally conscious), will take it into a computer repair service like The Geek Squad. If their Operating System is Windows, and the Operating System is irreparable (but the hardware is still functioning), the repair service technician will likely simply download the Windows ISO, burn it to a USB stick, and reinstall Windows (hopefully after backing up what they can and informing the customer). Of course, they will charge a modest fee for this, but the computer will be operating once again and the customer didn't have to do any research or work to do so, they just had to shell out a few bucks. Note that this is the same simple technique that is utilized to install Linux at the end of this article. By simply following the tutorial, you have gained a small piece of knowledge on how computers work and learned how to install an Operating System should your current one be somehow corrupted.
|
|
</p>
|
|
<p class="article-content">
|
|
Now, there is an obvious advantage to going to The Geek Squad and <em>not</em>
|
|
learning how to reinstall your Operating System. For one thing, you save time
|
|
(sometimes a lot of time). Time is a limited and invaluable resource and I will not
|
|
go into the obviously subjective question of how one should best spend their time.
|
|
Sufficient to say that when it comes to most computer users, they will not wish to spend
|
|
their time learning the ins and outs of their Operating Systems... but what about you?
|
|
</p>
|
|
<p class="article-content">
|
|
If you are a software developer, web developer, data scientist, and/or systems administrator, then it is in my strong opinion that it is worth your time to learn how to utilize The Linux Operating System, and yes, on your <em>Desktop/Laptop!</em> Building your home Linux computer from the ground up is an experience that will give you (at least a small) insight into the complicated inner workings of your hardware and software and how they interact with one another. Once installed, the base Linux system is customizable to a degree that dwarfs the customizability of Windows and MacOs. The act of customizing your Linux machine often involves configuring your chosen suite of software (sometimes from the source code itself), and slowly but surely, over repeatedly reviewing lines of code and configuration files, you will begin to understand on a slightly deeper level how it all works.
|
|
</p>
|
|
<p class="article-content">
|
|
This is a contentious opinion of mine, and there are legitimate arguments as to why one should simply utilize MacOs or Windows when first learning about computers in depth, and I'm not necessarily opposed to this argument. Rather, I am simply advocating that if you are going to learn about computers, then learning how to utilize the Linux Operating System is one of the best investments of your time you can make, as even in customizing your Linux machine, you will learn a decent amount about the inner workings of the software.
|
|
</p>
|
|
<p class="article-content">
|
|
This isn't to say that installing and using Linux has somehow given me a knowledge and insight into how the entirety of every piece of software that I utilize works (that would probably take a lifetime). I can honestly say, however, the amount of knowledge I've gained over the past two and a half years while ascertaining how to utilize The Linux Operating System has been vast, and I continue to learn more and more every day. The practice of reading and re-reading of documentation, the in depth discussions on various computer forums, the investigating of how to interface with a particular API, the interacting with the software itself, and the act of "getting your hands dirty" have all added up to the cultivation of a state of mind that is highly accustomed to learning any piece of software, and that mindset grew from my initial interest in understanding The Linux Operating System.
|
|
</p>
|
|
<h4 class="article-header4">Where To Get Started</h4>
|
|
<p class="article-content">
|
|
Before I cover how to install Linux, I'd like to take a brief moment to cover Linux Distributions, colloquially known in the Linux Community as "distros". Earlier in this article, I mentioned multiple times that Linux is an extremely customizable Operating System. This extreme customizability has led to the development of a multitude of Linux "Distributions," which one can think of as different "flavors" of Linux. To the uninitiated this immediately can become overwhelming. As soon as you've decided to use Linux, if you were to turn to the online community and ask "Which distribution should I start with?," you might very well be bombarded with a myriad of answers. Indeed, if you look at the <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://en.wikipedia.org/wiki/List_of_Linux_distributions">wikipedia article</a> on the subject, you'll see how vast the world of Linux distributions is.
|
|
</p>
|
|
<p class="article-content">
|
|
The topic of Linux distributions is a subject on its own, and your choice of Linux distribution is a personal one (very much like the choice to use Linux itself). I will simply point to certain distributions that are generally recommended for beginners and then provide you with a brief tutorial on how to install Linux Mint (one of the more popular "beginner friendly" distros). Here is a brief list of distributions I recommend for beginners:
|
|
</p>
|
|
<ul class="article-lists">
|
|
<li><a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://liniuxmint.com">Linux Mint</a></li>
|
|
<li><a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://ubuntu.com">Ubuntu Linux</a></li>
|
|
<li><a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://mxlinux.org/">MX Linux</a></li>
|
|
<li><a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://elementary.io/">Elementary OS</a></li>
|
|
<li><a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://endeavouros.com/">Endeavor OS</a></li>
|
|
</ul>
|
|
<p class="article-content">
|
|
If you are curious as to which Linux Distribution I run on my personal machine at home, it is <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://artixlinux.org">Artix Linux</a>, but I don't recommend it for beginners.
|
|
</p>
|
|
<p class="article-content">
|
|
Once you have chosen which Linux Distribution you'd like to try, be sure to read the documentation on its installation thoroughly. You will first need a working computer, an installation media (a usb stick has become standard for this), and a piece of software to burn the Linux ISO to the installation media (the easiest to use on Windows and MacOs is <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://www.balena.io/etcher">Balena Etcher</a>, although <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://rufus.ie/en/">Rufus</a> on Windows is also a fine option).
|
|
</p>
|
|
<h4 class="article-header4">Installing Linux</h4>
|
|
<p class="article-content">
|
|
This is just a brief overview of installing Linux Mint, while you can follow along here, I'd recommend reading <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://linuxmint-installation-guide.readthedocs.io/en/latest/">Linux Mint's Installation Guide</a>, as it gives much better and in depth instruction than I provide here. Please note that these installation instructions will remove your old Operating System and all files, software, and directories, so please back up your files prior to installation. While it is rare that your computer will be unable to run Linux, it does occassionally happen, so do some research on your particular hardware and its compatibility with Linux prior to making the attempt.
|
|
</p>
|
|
<p class="article-content">
|
|
The first step is probably the easiest, simply download the ISO:
|
|
</p>
|
|
<ul class="article-lists">
|
|
<li><a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://linuxmint.com/download.php">Download Linux Mint</a></li>
|
|
</ul>
|
|
<p class="article-content">
|
|
The options you are presented with are Desktop Environments. Each one is slightly different, and each option deserves its own research, but the Cinnamon Edition is Linux Mint's flagship Desktop Environment and it is the one you will be downloading and installing if you choose to follow along with this tutorial.
|
|
</p>
|
|
<p class="article-content">
|
|
Once you have downloaded the ISO file. You're going to need to burn the file to a usb drive with enough storage capacity for the file (roughly 2.4GB). You'll also need a piece of specialized software to burn it. For this tutorial we will use <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://www.balena.io/etcher">Balena Etcher</a>:
|
|
</p>
|
|
<p class="article-content">
|
|
Etcher is very easy to use, simply insert your usb stick into one of your computer's usb ports, open up the Etcher application, and follow its three step process. First click on "Select image", navigate to and select the ISO file within the presented File Manager. Then do the same for "Select Drive" (the usb device). Lastly simply hit "Flash!" and wait for the image to burn (this could take a while depending on your hardware).
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/etcher-80153bf0.gif</url>
|
|
<title>A gif showing the basic usage of Balena Etcher</title>
|
|
</image>
|
|
<p class="article-content">
|
|
Once done your installation media should have the ISO image burned onto it. Inspecting the contents of the usb-drive should reflect this change. <em>Keep the usb stick inserted into your computer</em> and restart.
|
|
</p>
|
|
<p class="article-content">
|
|
As your computer restarts, you will usually see an introduction screen from your Motherboard manufacturer, when you see this introduction screen show up, quickly and repeatedly hit either the F2 or F11 key to enter the BIOS settings (if this doesn't work research your motherboard manufacturer, as it is usually one of these two keys). If installing on a Mac, keep your finger pressed on the Alt or Option key after hearing the boot sound.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/bios-94b8340a.webp</url>
|
|
<title>An example picture of an ASUS BIOS Menu</title>
|
|
</image>
|
|
<p class="article-content">
|
|
Once in the BIOS menu, you'll need to change the Boot Order so that your computer boots from the USB. To do this, locate and select the "Boot" Submenu.
|
|
</p>
|
|
<p class="article-content">
|
|
Once you have located the "Boot" submenu, locate the option labeled "Boot Priority". Under this option you should find a list of devices, one of which will start with USB, which is more than likely your installation media. Re-order the options so that the USB option is on top.
|
|
</p>
|
|
<h4 class="article-header4">A Word On Secure Boot</h4>
|
|
<p class="article-content">
|
|
Some Linux Distriutions, in order to boot properly, will need you to disable the Secure Boot Setting in your BIOS. Please do your own research regarding this, but I have personally always disabled Secure Boot when installing Linux, and have determined it is a general prerequisite prior to installation. I briefly cover how to do so here, followed by a guide:
|
|
</p>
|
|
<p class="article-content">
|
|
Secure Boot is usually found under a section in your BIOS menu called "Security". From there select "Secure Boot" and the drop down menu should have an option labeled "Disable." Select this option.
|
|
</p>
|
|
<ul class="article-lists">
|
|
<li><a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://www.chippiko.com/disable-secure-boot">A Guide to Disabling Secure Boot with Pictures</a></li>
|
|
</ul>
|
|
<p class="article-content">
|
|
Once you have disabled secure boot and re-ordered the bootable devices in your BIOS, go ahead and Save & Exit. The computer will once again reboot, and with any luck you will be presented with the Linux Bootloader:
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/grub-731e44da.webp</url>
|
|
<title>A Picture of the GRUB Bootloader menu</title>
|
|
</image>
|
|
<p class="article-content">
|
|
Shortly after this you will be presented with Linux Mint's "live session" or "live environment." This is indeed the desktop environment, but you have yet to overwrite your previous Operating System, as the installation process is not yet complete. <em>Do NOT remove the USB stick</em>, as the live session is running from the USB directly. If you'd prefer to explore the Linux environment prior to installing it, please do so at this point if you are unsure about removing your previous Operating System and installing Linux. Most Linux Distributions come with a suite of software for you to play around and experiment with.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/live-environment-915bc82d.webp</url>
|
|
<title>A Picture of Linux Mint's Live Desktop Environment</title>
|
|
</image>
|
|
<p class="article-content">
|
|
If all is to your liking, and you're ready to install Linux and remove your previous Operating System, then continue with the next step:
|
|
</p>
|
|
<p class="article-content">
|
|
Select The Install Linux Mint option with the round CD icon on the Desktop. This will open up a menu that will walk you through the process, which I will not go into detail here, but generally involves setting up your internet connection, keyboard settings, timezone/locale, username, password and root password. Once you have filled out all form fields and hit "Install," the installation process will begin (this process might take a while).
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/mint_install-c7c987a4.webp</url>
|
|
<title>A Picture of Linux Mint Install Menu</title>
|
|
</image>
|
|
<p class="article-content">
|
|
Once finished, Restart your computer and remove the USB installation media.
|
|
</p>
|
|
<p class="article-content">
|
|
If all went well, you will be presented with a login screen with your username already filled out. Enter your recently created password to log in.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/mint_login-0c98b545.webp</url>
|
|
<title>A Picture of The Linux Mint Login Screen</title>
|
|
</image>
|
|
<p class="article-content">
|
|
Once logged in, you should see the Linux Mint Cinnamon Desktop Environment, which is now running natively on your hardware. Congratulations! You have successfully installed Linux!
|
|
</p>
|
|
<h4 class="article-header4">On Updating</h4>
|
|
<p class="article-content">
|
|
I will complete this article more or less here with one last bit of advice. Utilizing Linux generally involves interacting with the terminal (at least occassionally for casual users). Unlike Windows or MacOs, there are no automatic updates, you choose when you wish to update your software. Upon initial installation, it is always recommended to update your software. You can do this by navigating to the terminal application from your Launch Menu (located on the bottom left hand side of your desktop).
|
|
</p>
|
|
<p class="article-content">
|
|
Open up the Terminal and enter the following command to update your newly installed Linux Operating System:
|
|
</p>
|
|
<pre><code class="language-bash">[~]$ sudo apt update && sudo apt upgrade</code></pre>
|
|
<p class="article-content">
|
|
You will be asked for the sudo password, which is the same as the password you used to log in. Once you have entered your password, the apt package manager will query the Linux Mint Repositories, checking what software is out of date. It will then present you with a list of which pieces of software (packages) are out of date and ask you if you'd like to udpate them, enter "y" for yes, and wait for the installation process to complete. With the exception of certain pieces of major software, like the kernel, you do not need to reboot your system to use this newly updated software, it is available to use immediately.
|
|
</p>
|
|
<h4 class="article-header4">Conclusion</h4>
|
|
<p class="article-content">
|
|
Thanks for taking the time to read this somewhat lengthy article. Hopefully I've instilled in you an interest and desire to use The Linux Operating System. I have only been using Linux on the desktop for about two and a half years now, but have learned so much in that brief period of time. I truly do believe that if you wish to get involved in any tech-related field that at least becoming familiar with Linux (if not using it on a daily basis), is essential. If you followed along and installed Linux Mint, welcome to the Linux Community! Should you have any questions/comments, please feel free to reach out to me! You can also field many questions over at <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://www.linuxquestions.org/questions/">The Linux Questions Forums</a>.</p>
|
|
</description>
|
|
</item>
|
|
<item>
|
|
<pubDate>Tue, 08 Nov 2022 12:30:00 +0200</pubDate>
|
|
<title>Musings On Vim</title>
|
|
<link>https://leafbytes.com/musings-on-vim</link>
|
|
<guid isPermaLink="false">nozcaueffflsizkjznvfyitfvwagvfoscssvsnrl</guid>
|
|
<description>
|
|
<h1>musings on vim</h1>
|
|
<h3>one editor to rule them all</h3>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/vim-370288c5.webp</url>
|
|
<title>The Vim Logo</title>
|
|
</image>
|
|
<blockquote class="article-quotes" cite="book: How Linux Works, by Brian Ward">
|
|
"How do I quit this thing?"
|
|
<br> -Every Vim User At Some Point
|
|
</blockquote>
|
|
<h4 class="article-header4">Introduction</h4>
|
|
<p class="article-content">
|
|
Should you have chosen to start programming/coding, you will undoubtedly at some point encounter those with opinions on which software is best to utilize. While the amount of tools available to software developers is extremely vast, there are three (maybe four) essential tools necessary for a beginner software developer to get started (not mentioning the Operating System). These tools are a Web Browser (for research and web development), a Terminal Emulator (for interfacing with software, both your own and others), and a Text Editor (the fourth is a compiler, but I'll digress on that topic for now).
|
|
</p>
|
|
<p class="article-content">
|
|
Each of these essential tools have a wide variety of options, with a few clear winners that are extremely popular. In the Web Browser world, you have Google's Chrome, MacOs's Safari, and Mozilla's Firefox. The Terminal Emulator world is quite vast where the clear winners are less obvious, but two of the most popular options on Linux currently are the Alacritty and Kitty Terminal Emulators. Then we come to the world of Text Editors, which has a somewhat vast array of choices, with Microsoft's Visual Studio Code being the most popular by far. Other text editors include Github's Atom (likely soon to be deprecated at the time of this writing), Sublime Text, Microsoft Notepad++, and many others. When addressing the subject of text editors in online communities, you're likely to hear an overwhelming and increasing majority of users singing the praises of VS Code, perhaps a few chiming in about Sublime Text, the somewhat rare Emacs masochist waxing poetic about how Emacs isn't JUST a text editor, but a way of life. Then, of course, there's Vim.
|
|
</p>
|
|
<h4 class="article-header4">What Is A Text Editor?</h4>
|
|
<p class="article-content">
|
|
To simplify greatly, a text editor is a piece of software for the purposes of generating and editing text. If you have ever played around in Microsoft Notepad, you'll be forgiven for thinking that it is so basic that it should only be used for quick notes and doesn't serve much other functionality. While this is somewhat true, you can indeed code in Notepad, as all you technically need to code is a piece of software that is capable of inputting and editing plain text. Text Editors do have some overlap in functionality with Word Processors, but the purpose of a text editor has far less to do with presentation (meaning there is little to no formatting for the intentions of printing, and rather is intended for the ease of use in coding and technical documentation).
|
|
</p>
|
|
<p class="article-content">
|
|
Modern text editors provide a basic suite of features by default. Some of the most obvious of these features are syntax highlighting (colorizing of certain keywords in the text depending on the programming language being edited), linting (helpful error messages that inform the user of possible errors in the code), and a vast suite of various tools for quickly navigating and searching throughout their project hierarchy. They are also highly customizable, with a wide variety of plugins available, as well as a configuration interface with which the user can further tailor the text editor to their specific needs.
|
|
</p>
|
|
<h4 class="article-header4">What Is Vim?</h4>
|
|
<p class="article-content">
|
|
Obviously, given the track of the article thus far, you can easily ascertain that Vim is a text editor of some note. What makes Vim unique amongst text editors is its adoption of the original workflow from the Vi text editor, which heavily utilizes the feature of Modal Editing. Unlike other text editors, in which the user can immediately start inputting and editing text, Vi introduced the concept of "Modes," in which the input from the keyboard would not necessarily produce text on the screen, but would rather either navigate or manipulate the text in some way other than simple input. To be clear, Vi can still input text in the same fashion as other text editors, it's just that this mode (known as INSERT mode), is only one amongst many modes the user can choose to be in. On a modern text editor like VS Code, the navigation within the document from say, one word to the next, is accomplished using the 'ctrl + right arrow' keybinding. In Vim, while you can do the same in INSERT mode, if you are in what is known as NORMAL mode, you can traverse the same navigational pattern by simply typing 'w'. While this may seem trivial to the uninitiated, this modal editing is the major distinguishing feature of Vim with the general effect being that the user's fingers never leave far from home row, and thusly do not need to "reach" for keys on the perimeter of the keyboard as often, thusly increasing typing speed. Additionally, the "chaining" of these different modal keybindings while in NORMAL mode also increases productivity as one can more quickly navigate and edit a document than in a traditional text editor like VS Code.
|
|
</p>
|
|
<h4 class="article-header4">Vim's Drawbacks</h4>
|
|
<p class="article-content">
|
|
Utilizing Vim's keybindings and modal editing is actually nearly ubiquitous across text editors now. There is a Vim Feature/Plugin for nearly every text editor, as well as a Vim setting in your shell (simply write "set -o vi" in your ~/.bashrc), and even your web browser can be modified with an <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://addons.mozilla.org/en-US/firefox/addon/vimium-ff/">extension</a> to utilize Vim-style keyboard-centric navigation. With Vim's flagship keybindings having been ported to many other text editors, one might wonder why use Vim at all? This is a more compelling argument against using the original terminal based Vim text editor (especially if you also don't find the following argument below regarding the efficient of use of system resources compelling). Vim in the terminal requires more in-depth configuration than other text editors. While being more customizable than other text editors, the time spent in configuring any piece of software could easily be spent learning some programming language, or simply doing anything else for that matter. The scripting language, vim-script, is not portable to other programs, and thus the time you spend learning vim-script does not transfer a commonly used skill over to other projects (It is of note that Vim's successor, Neovim, is configured in the scripting language Lua, and thusly learning Lua through configuring Neovim may be a more worthwhile endeavor in this regard). In my previous article on <router-link class="inter-article-links" to="/why-use-linux">Why You Should Use Linux</router-link>, one of my main arguments behind learning to utilize The Linux Operating System was the fact that the act of customizing your Linux machine will help you learn more about computers in general. This same argument cannot be applied when regarding configuring Vim as a way to learn more about your computer, though in configuring Vim, you will learn more about your text editor. Ultimately, many of the features available in VSCode natively have to be implemented in Vim via plugins and extensive configuration. So what are the utilitarian reasons for utilizing Vim?
|
|
</p>
|
|
<h4 class="article-header4">Why Use Vim?</h4>
|
|
<p class="article-content">
|
|
It almost goes without saying that the majority of new programmers/coders reach for Microsoft's VS Code as their first text editor. The predominance of VS Code is due to the simple fact that it is a great piece of software that works out of the box. Its ecosystem is vast, with a wide variety of plugins, color themes, and a helpful community. VS Code even has a Vim (and Neovim) plugin so one can utilize Vim-style modal editing keybindings. So, why, ultimately, would I suggest you utilize Vim(Neovim) over VS Code? There are a few good reasons.
|
|
</p>
|
|
<p class="article-content">
|
|
Just like with choosing Linux, the choice of a text editor, like Vim, can become quickly political in nature due to the fact that VS Code is not entirely Open Source. While VS Code's source code is released under the permissive MIT license, the popular Microsoft release of this has proprietary software integrated into it. Additionally, VS Code utilizes telemetry by default, which goes against the FOSS world's advocacy for opt-in, and not opt-out, telemetry (The fork, <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://github.com/VSCodium/vscodium">VS-Codium</a>, turns off this telemetry by default).
|
|
</p>
|
|
<p class="article-content">
|
|
On a less political note, Vim, and its popular descendant, Neovim, run natively within the Terminal and Terminal Emulator. This greatly reduces the amount of system resources utilized during operation when compared with VS Code, which utilizes the resource-intensive Electron as its base. This alone, is reason enough to utilize Vim. I have a relatively powerful machine with a modern CPU and GPU, but gravitate towards software that runs on as little resources as possible. Many argue that system resources are cheap today, and needing to squeeze every bit of memory out of your machine is a thing of the past, but this is a short-sighted argument. System resources are always disposable until you run out of them, and programmers in particular should never view system resources as being somehow magically infinite. This isn't to say that VS Code is a memory hog per say (that is relative), but the majority of what one can accomplish in VS Code, one can accomplish just as well, if not more efficiently, with Vim, and at a fraction of the system resource cost. The argument regarding system resources, however, is moot when compared to the next argument I will make in favor of using Vim as your text editor.
|
|
</p>
|
|
<p class="article-content">
|
|
Vim, with it's native modal editing ecosystem, incorporates a series of keybindings and shortcuts that greatly increase the speed with which the user can edit text. Much has been written on how to get started with Vim, and I will be providing you with a basic introduction to Vim towards the end of this article, but Vim is not an editor that is as intuitive to get started with as VS Code, and this is one of its major drawbacks. Although one could make the argument that learning Vim is similar in nature to learning the basic keybindings native in most Windows and MacOs applications, I would argue that Vim has a far more vast and rich set of keybindings, which, as mentioned above, can be chained together to achieve rapid results whether navigating or editing the document.
|
|
</p>
|
|
<h4 class="article-header4">Vim Basics</h4>
|
|
<p class="article-content">
|
|
For the following short introduction to Vim, I will be utilizing the modern fork, Neovim, but for the purposes of this tutorial, you can use either version.
|
|
</p>
|
|
<p class="article-content">
|
|
How you install Vim will depend on what Operating System you have. If on Windows or MacOs, please take a look at <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://www.vim.org/download.php">these instructions</a>, or you can install <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://github.com/neovim/neovim/wiki/Installing-Neovim">NeoVim</a>.
|
|
</p>
|
|
<p class="article-content">
|
|
If you're using Linux, utilize your native package manager:
|
|
</p>
|
|
<p class="article-content">
|
|
Debian-based Linux distributions:
|
|
</p>
|
|
<pre><code class="language-bash">[~]$ sudo apt install neovim</code></pre>
|
|
<p class="article-content">
|
|
Arch-based Linux distributions:
|
|
</p>
|
|
<pre><code class="language-bash">[~]$ sudo pacman -S neovim</code></pre>
|
|
<p class="article-content">
|
|
The text editor will open with a brief introductory screen.
|
|
For those more accustomed to VS Code or a similar Graphical
|
|
User Interface(GUI) text editor, Vim can appear rather
|
|
sparse. At least the introduction screen provides us with
|
|
some information abut how to get started (:help vim <Enter>). I would encourage you to take a look at this help page, as Vim and Neovim documentation is quite good. I will now cover some of the basic keybindings and Vim "movements" in concluding this article, in order that you might get a sense of Vim's appeal.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_nvim_01-c106224a.webp</url>
|
|
<title>The Introduction Screen to Neovim</title>
|
|
</image>
|
|
<p class="article-content">
|
|
When you first attempt to type anything into Vim, you may very well be immediately frustrated at the fact that no text appears on the screen! What the hell?! Isn't this supposed to be a text editor? Well, hold on, remember what I said earlier about it being a MODAL editor? Well if your cursor is in the default white block state, then Vim is currently in NORMAL mode, which one can think of as being a basic navigation and editing mode. In order to type something out, press 'i' in order to enter INSERT mode.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_nvim_03-a61c0e8c.webp</url>
|
|
<title>Neovim in Insert Mode with Sample Text</title>
|
|
</image>
|
|
<br>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_nvim_02-8421ef8b.webp</url>
|
|
<title>CloseUp of the INSERT mode prompt</title>
|
|
</image>
|
|
<p class="article-content">
|
|
Changing over to insert mode will change the shape of your cursor to the thin bar variety. You can now insert text like you would in a normal text editor. All the basic keybindings still work, be it ctrl+right arrow for navigating, as well as your standard editing keys like backspace and delete. I wouldn't recommend using these, however, as you would be overlooking NORMAL mode's editing capabilities. Generate some dummy text using <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://loremipsum.io/">Lorem Ipsum</a>, enough so that it fills your screen (about 10 paragraphs should do), and then return to NORMAL mode by hitting the <ESC> key. Next I'm going to cover the basic navigation.
|
|
</p>
|
|
<p class="article-content">
|
|
In Vim, deviation from the home row of your keyboard is highly discouraged by design. On a standard QWERTY keyboard, when positioned correctly, all the "arrow" navigation keys can be found beneath your right hand, instead, while in NORMAL mode, left is 'h', down is 'j', up is 'k', and right is 'l'.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_nvim_04-d88cf393.gif</url>
|
|
<title>Demonstration of basic navigation in Vim</title>
|
|
</image>
|
|
<p class="article-content">
|
|
While this initial lesson is rather underwhelming, this basic feature of Vim reinforces a subtle, but powerful productivity standard, which is that your workflow should be keyboard-centric. I believe that coders/programmers should at least have a few (if not many) keybindings that they have memorized and engrained into muscle memory regardless of which text editor they use. It's simply more efficient than navigating solely with arrow keys, and there should be as little physical strain on the hands and wrists as possible while typing. The quicker you can accomplish your editing, the more time you have to devoting to programming and thinking hard about your next line of code.
|
|
</p>
|
|
<p class="article-content">
|
|
Very basic navigation out of the way, let's cover word traversal. While still in NORMAL mode, at any point on your dummy text, hit the key 'w', and then the key 'b'. 'w' traverses the document word by word, 'b' does the same but backwards.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_nvim_05-22e9be78.gif</url>
|
|
<title>Demonstration of word traversal in Vim</title>
|
|
</image>
|
|
<p class="article-content">
|
|
Okay, now you're moving a bit faster, instead of letter by letter, you're traversing the document word by word. Next, we'll cover traversing an entire line. Navigate to the middle of one line and while in NORMAL mode, type the dollar sign symbol, '$', and then after taking a moment to notice the result in your editor, type the number zero, '0', and again, notice the results:
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_nvim_06-b9a7ff2c.gif</url>
|
|
<title>Demonstration of line traversal in Vim</title>
|
|
</image>
|
|
<p class="article-content">
|
|
These two commands lead you to the end of your current line with dollar sign, '$', or to the beginning of your current line with the number zero, '0'.
|
|
</p>
|
|
<p class="article-content">
|
|
Now you have a few options for quickly navigating your document horizontally, what about vertically? In NORMAL mode, while positioned more towards the top of your document than towards the bottom, enter 'ctrl+d', and notice the results.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_nvim_07-a39d4c94.gif</url>
|
|
<title>Demonstration of vertical traversal in Vim</title>
|
|
</image>
|
|
<p class="article-content">
|
|
Essentially 'ctrl+u' and 'ctrl+d' are Vim's version of pageup, and pagedown.
|
|
</p>
|
|
<p class="article-content">
|
|
The next keybindings important to vertical traversal are that of 'gg' and 'shift+g'(capital G). While in NORMAL mode, enter both of these and notice their results.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_nvim_08-c1214d4c.gif</url>
|
|
<title>Demonstration of entire document traversal in Vim</title>
|
|
</image>
|
|
<p class="article-content">
|
|
These keybindings navigate the entirety of your document. 'gg' will bring your cursor to the first line of your document, while capital G, or shift+g will bring you to the last line of your document.
|
|
</p>
|
|
<p class="article-content">
|
|
At this point you might be underwhelmed, as it all seems like a more esoteric way of navigating using alternative keys other than pgdown, pgup, end, home, ctrl+left arrow, ctrl+right arrow, etc. And you'd be right...if this was all Vim had to offer.
|
|
</p>
|
|
<p class="article-content">
|
|
While there is more to navigation than what I have presented here thus far, I will now move on to the basics of Vim Editing, which will hopefully further elucidate the power of Vim's modal editing features.
|
|
</p>
|
|
<p class="article-content">
|
|
For this example, please stay in NORMAL mode (if you hit 'i' at any time prior to this and entered INSERT mode, simply return to NORMAL mode by hitting the <ESC> key). Navigate to the beginning of any word in your document using 'w'. From here enter, the keys, 'dw', and witness the results, yes, very simply, we deleted a word.
|
|
</p>
|
|
<p class="article-content">
|
|
I want to pause here and point out that in any other classic text editor, the keybinding to do this is ctrl+delete, which isn't so bad (though you do have to navigate both hands a bit far away from home row to do so).
|
|
</p>
|
|
<p class="article-content">
|
|
Also notice the chaining of commands here, 'd' is meant to be a mnemonic, reminding you of 'delete', but on its own doesn't do anything, it takes another command as an argument, so 'dw', means 'delete word.' We traverse using 'w' and when we come across a word we want to delete, we use the command 'd' and the argument, 'w', resulting in 'dw'. What if we wanted to delete the previous word? Well we traverse using back to the previous word using the 'b' keybinding, so it makes sense that 'db', would be 'delete back' or 'delete previous word'.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_nvim_09-1c0c0366.gif</url>
|
|
<title>Demonstration of deleting a word using 'dw' and 'db' in Vim</title>
|
|
</image>
|
|
<p class="article-content">
|
|
And indeed it does. And yes, this functionality can be accomplished using the standard text editor's keybinding 'ctrl+backspace'.
|
|
</p>
|
|
<p class="article-content">
|
|
Should you wish to undo any of your recent deletions, simply hit 'u' to undo the last command. If you then change your mind and wish to redo your recent deletions, simply hit 'ctrl+r'. On standard editors, this redo functionality can be accomplshed usng 'ctrl+z'.
|
|
</p>
|
|
<p class="article-content">
|
|
You may still be unconvinced of Vim's editing capabilities, as I have covered how to accomplish many of these edits in a standard text editor as well. Allow me to hammer home the point by covering a few more editing techniques involving just the 'd'/delete command.
|
|
</p>
|
|
<p class="article-content">
|
|
Suppose I think a bit on how else I can chain 'd' with other movement commands? What if I wish to delete just the next character to the right of me? Well 'l' will navigate the cursor to the right, therefore d, 'delete', will delete, followed by 'l', which chains to mean 'delete one character to the right of me.' So 'dl' deletes one letter to the right of my cursor and 'dh' will delete one character to the left of my cursor. What about 'dj'?
|
|
</p>
|
|
<p class="article-content">
|
|
What about 'dd'? Well this one is less intuitive, isn't it? 'delete delete'. Well long story short, it deletes the entire line you are currently on.
|
|
</p>
|
|
<p class="article-content">
|
|
What about 'd$'? You guessed right, delete all text from my current cursor position to the end of the line. 'd0' will delete all text from my current cursor position to the beginning of the line.
|
|
</p>
|
|
<p class="article-content">
|
|
'dG' will delete everything from my current cursor position to the end of the document, while 'dgg' will delete everything from my current cursor position to the beginning of the document.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_nvim_10-52a5e17f.gif</url>
|
|
<title>Demonstration of deleting a word using 'dw' and 'db' in Vim</title>
|
|
</image>
|
|
<p class="article-content">
|
|
And so on...
|
|
</p>
|
|
<p class="article-content">
|
|
This concludes a basic exemplification on the power of chaining commands. Now, how would we accomplish these things in a standard text editor without this MODAL editing feature? Well this is where the ergonomics of your standard text editor fail. Let's just say I wanted to do more than delete a few words, what if I wanted to delete everything from my current position to the end of the line? Well in Vim, as previously pointed out, that is accomplished simply by invoking 'd$'. In a standard text editor, this would be accomplished by 'ctrl+shift+end' followed by 'delete' or 'backspace'. Four keys to Vim's two, with the latter example utilizing keystrokes that take your hands much further away from home row.
|
|
</p>
|
|
<p class="article-content">
|
|
At this point, you may protest, saying "Well I could always use the mouse to highlight that text and then just hit the delete or backspace key! It's not a big deal!!" And that is where you'd be wrong, were you to make such an argument. While I am not opposed to the utilization of the mouse in text editing (I am known to use my mouse from time to time), the frequency with which a programmer must switch from moving one hand away from home row on their keyboard to utilize the mouse in a standard text editor is something that I simply consider to be an inconvenience. Keeping your hands on the keyboard as often as possible simply is a best practice that should be reinforced when editing text.
|
|
</p>
|
|
<h4 class="article-header4">So Uhh...How Do I Quit?</h4>
|
|
<p class="article-content">
|
|
It is a joke/meme among Vim users that many of us never leave Vim. Not necessarily because we love it, but because we never learned how to exit. Although the introduction screen does actually tell you how to exit Vim, it is easy for a beginner to forget the command after having experimented with it for the first time.
|
|
</p>
|
|
<p class="article-content">
|
|
From NORMAL mode, enter the colon key, ':'. Here you are entering "COMMAND" mode, which has syntax somewhat similar to the shell. If you wish to save the document you have worked on, enter 'w', which stands for 'write'. If you wish to quit without saving, enter ':q!'. The exclamation point at the end is akin to certain shell commands where '-f' is mnemonically associated with the word 'force'. Without it the editor will warn you that you have unsaved changes and not let you exit. Of course, you can chain these commands, so if you wish to write, simply enter ':wq'.
|
|
</p>
|
|
<h4 class="article-header4">Conclusion</h4>
|
|
<p class="article-content">
|
|
I will digress at this point and bring this article to an end. There are far more Vim keybindings to cover, but I do not wish to overwhelm you too much, as the basic navigation/editing keybindings presented above are a good start to using Vim. In order to utilize Vim to actually start coding, however, will require at least a few plugins, and a bit of configuration. I do plan to eventually write an article covering these more nuanced aspects to Vim, but in the meanwhile I encourage you to take a look at the following official <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://www.vim.org/docs.php">documentation on Vim</a>. Thank you for taking the time to read my personal take on Vim, and Happy Coding!
|
|
</p>
|
|
</description>
|
|
</item>
|
|
<item>
|
|
<pubDate>Sun, 13 Nov 2022 12:30:00 +0200</pubDate>
|
|
<title>The Keys That Bind</title>
|
|
<link>https://leafbytes.com/the-keys-that-bind</link>
|
|
<guid isPermaLink="false">thwtkxufzafwcsuxdteueozbmwlcpijaqqpbmfph</guid>
|
|
<description>
|
|
<h1>the keys that bind</h1>
|
|
<h3>on tiling window managers</h3>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/i3_logo-1988ad12.webp</url>
|
|
<title>The i3 Logo</title>
|
|
</image>
|
|
<blockquote class="article-quotes" cite="book: How Linux Works, by Brian Ward">
|
|
"This allows the user to create a more lightweight and customized environment, tailored to their own specific needs."
|
|
<br> -<a class="blockquote-links" target="_blank" rel="noopener noreferrer" href="https://wiki.archlinux.org/title/Tiling_window_manager"><em>The Arch Wiki <br>On Window Managers</em></a>
|
|
</blockquote>
|
|
<h4 class="article-header4">Introduction</h4>
|
|
<p class="article-content">
|
|
When one first approaches the world of computers, their first interaction is with some kind of graphical user interface, commonly termed as a "GUI." This interface is what is termed as a "Desktop Environment" or "DE" for short. A common Desktop Environment's primary form of interaction is based around the utilization of the computer mouse, although, to varying degrees, can be modified to be more oriented towards a keyboard-based interface.
|
|
</p>
|
|
<p class="article-content">
|
|
Less familiar to the general public is a piece of software known as a Tiling Window Manager, a much more basic, but possibly more efficient, GUI that is heavily based on the utilization of keyboard interactions from the user. Indeed, much like the Vim Text Editor, a Tiling Window Manager so heavily discourages the use of Mouse Interactions, that an uninitiated user can find themselves presented with an environment where attempts at using the computer mouse results in no feedback at all (i.e., clicking the mouse does nothing by default). At first glance this may seem as a negative, but with the incorporation of more and more keyboard-encouraged interactions with your various pieces of software, one finds that their efficiency utilizing their computer increases, and perhaps also their productivity increases as well.
|
|
</p>
|
|
<h4 class="article-header4">What Is A Desktop Environment?</h4>
|
|
<p class="article-content">
|
|
Prior to the advent of computer screens, all visual output from the computer was generally reserved to reading out lengthy printed pages via a line printer, while computer screens were reserved for keeping track of the status of the programs themselves.
|
|
</p>
|
|
<p class="article-content">
|
|
I won't go into the extensive history of computer screens,
|
|
window managers, tiling window managers, and desktop
|
|
environments, suffice it to say that the modern tiling window
|
|
managers and desktop environments are the products of the long
|
|
and arduous effort to bring computers into the modern home.
|
|
</p>
|
|
<p class="article-content">
|
|
The average modern desktop or laptop computer user finds themselves interacting with their Operating System via a Desktop Environment, clicking on icons via their mouse, scrolling articles in the Google Chrome Browser, perhaps typing a bit here and there when they have to perform a search query, or perhaps even typing a decent amount when they have to write an extensive document of some kind.
|
|
</p>
|
|
<p class="article-content">
|
|
The ability to type fast, maneuver between applications, context switch between different applications, and perhaps most importantly, the ability to make concise logical decisions, all play a role in how quickly a project is completed. Due to the vast amount of tools we have as modern computer users, and the multitude of ways of thinking and approaching a given task, there is, to put it simply, rarely a "one size fits all" workflow.
|
|
</p>
|
|
<p class="article-content">
|
|
The modern Desktop Environment found on Microsoft Windows is the most popular interface with which the average desktop computer user interacts. This is due mainly to the fact that they (the users) are unaware that there are alternatives (or that these alternatives are worth investigating). Even beginner programmers rarely take the time to investigate alternative Desktop Environments, limiting themselves to either working on Windows or MacOs and accepting the default keybindings and workflow instilled in them by the designers and developers of that Desktop Environment. They may investigate what kind of text editors are available to them, although this also is becoming increasingly rare as the majority of beginner programmers reach for VS Code and don't look into what alternatives are out there. This is somewhat unfortunate, as by taking the time to investigate these alternative tools, you may very well find more optimal solutions that better coordinate with your particular workflow. This article is to give you a brief introduction to how the Tiling Window Manager can play into a keyboard-centric workflow.
|
|
</p>
|
|
<h4 class="article-header4">The Keyboard-Centric Workflow</h4>
|
|
<p class="article-content">
|
|
There have been few articles written on the keyboard-centric workflow. The subject is the realm mainly focused on by productivity enthusiasts and computer programmers (perhaps also the occasional stenographer). I have touched briefly on the concepts of the keyboard-centric workflow in <router-link class="inter-article-links" to="/musings-on-vim">my article on The Vim Text Editor</router-link>, but will spend more time elaborating on the subject here.
|
|
</p>
|
|
<p class="article-content">
|
|
I have always enjoyed the sensation of typing from an early age when I first sat down at a keyboard. In high school and especially college, I took the time to learn some of the classic keyboard shortcuts present in nearly every application. The knowledge of these shortcuts allowed me to navigate more quickly throughout applications, edit text more quickly, and generally work with the computer much faster than others. In short, I became what is known colloquially as a "power user".
|
|
</p>
|
|
<p class="article-content">
|
|
It is intriguing to me, having now used Linux for a little over two years, to come to understand that the subject of keyboard shortcuts, or "keybindings," is a point of divergence within the varying philosophies amongst the developers of the major Operating Systems and their Desktop Environment Designs. Within Microsoft Windows and MacOs, one is heavily restricted to utilizing their specific keybindings. The standardization of keybindings, I'll admit, is somewhat essential so that when a user sits down at a colleague's computer, they are not completely lost as to which keys do what, as they are the same across all machines. Unix-like Operating Systems and their many Desktop Environments operate on the general philosophy that user freedom, and by proxy, customization options, is paramount. Thusly anyone operating a Linux or BSD based Operating System today is capable of setting up their own custom keybindings to their liking on their personal machines. This does make working from machine to machine difficult in terms of cohesion when working on a team, but by the same token, this freedom allows for a customizable work environment that is specific to its user. It is in my opinion that this is preferable as it allows the user the freedom to customize their Desktop Environment to their unique and particular workflow, which should, in theory, mesh well with their own personal thought process and problem solving techniques.
|
|
</p>
|
|
<p class="article-content">
|
|
Obviously, my preferences in Desktop Environment Design are geared towards creating a personalized keyboard-centric workflow that is unique to the regular user of that particular machine. The remainder of this article will focus on transitioning from a mouse-centric orientation with your computer towards a more keyboard-centric one, with the end goal of installing a Tiling Window Manager on Linux and the introducing the basics of utilizing it.
|
|
</p>
|
|
<h4 class="article-header4">A Brief Note On The Linux Desktop</h4>
|
|
<p class="article-content">
|
|
As you may have already ascertained if you have read my <router-link class="inter-article-links" to="why-use-linux">Why Use Linux</router-link> article, Linux allows for a great deal of user freedom and choice. Linux Desktop Environments are no different. There are a wide variety of options for Desktop Environments, each with their own features, advantages, and disadvantages. I must confess I only have extensive experience in one Linux Desktop Environment, that being XFCE. If you are curious, the other popular Linux Desktop Environments currently include GNOME, KDE, Cinnamon, and the LXQT Desktop environments. I cannot speak to the quality of these Desktop Environments, but would assume they have a similar amount of customization options to XFCE.
|
|
</p>
|
|
<p class="article-content">
|
|
<h4 class="article-header4">Customized Keybindings On Linux</h4>
|
|
</p>
|
|
<p class="article-content">
|
|
Most Desktop Environments on Linux have a GUI interface for changing the default keybindings, and I would encourage you to look into your particular interface for doing so. The Desktop Environment I utilized when I first started using Linux was XFCE, afterwards I then utilized the i3 Tiling Window Manager (and then the bspwm Tiling Window Manager, which is what I use currently). I will first go into how to adjust the keybindings in XFCE both via XFCE's native GUI application. After that, I will then go into how to utilize the i3, which is considered by many as a good introduction to Tiling Window Managers.
|
|
</p>
|
|
<p class="article-content">
|
|
Firstly, let's start by configuring the keybindings in XFCE. Here we see the base install of Debian Linux with the default XFCE Desktop Environment installed:
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_debian_xfce-b14da7cf.webp</url>
|
|
<title>The Default Debian XFCE Desktop Environment</title>
|
|
</image>
|
|
<p class="article-content">
|
|
The default terminal emulator in the XFCE Desktop Environment is called xfce4-terminal, thusly if we invoke it from the command line, another terminal emulator should spawn:
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_debian_terminal_spawn-186101b1.webp</url>
|
|
<title>A Picture of the XFCE Terminal Calling Another Instance of Itself</title>
|
|
</image>
|
|
<p class="article-content">
|
|
And indeed it does. So now we know we can call xfce4-terminal by typing out that exact name into the command line, but what if I want to call it using a custom keybinding?
|
|
</p>
|
|
<p class="article-content">
|
|
In XFCE's version of the start menu (located on the upper left hand side), you will find a menu item called "settings", where you will find the "keyboard" option. This is one of two GUI menus that allow for the modification of keybindings. Click on that so we can get started with one of the first recommended keybindings, that being of "super+enter", which we will bind to open our terminal emulator.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_debian_xfce_keybindings01-8b32dcd3.webp</url>
|
|
<title>XFCE menu navigation to change keyboard shortcuts</title>
|
|
</image>
|
|
Once opened, Navigate to the Application Shortcuts sub-menu which should present to you some previously configured keybindings that are present by default. We are going to leave those alone and set up our own custom one by clicking on the "Add" button on the bottom left hand side of the menu. You will be presented with an empty input prompt asking for the command you will wish to invoke with this new keyboard shortcut. We want to open our terminal so let's enter the command 'xfce4-terminal':
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_debian_xfce_keybindings02-199b6eae.webp</url>
|
|
<title>XFCE menu navigation to change keyboard shortcuts</title>
|
|
</image>
|
|
<p class="article-content">
|
|
After hitting the "OK" button, we will be presented with a menu that asks us to "Press any Key". Most keyboard shortcuts invoked utilize at at least two buttons so as to not accidentally invoke commands whenever typing, so let's choose a classic keybinding "super+enter". To the uninitiated the "super" key is the "windows" key in Microsoft Windows or the "options" key in MacOs. Once entered, the window prompt will disappear and you may notice the new keyboard command show up on the Application Shortcuts menu.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_debian_xfce_keybindings03-acc939b0.webp</url>
|
|
<title>XFCE menu navigation to change keyboard shortcuts</title>
|
|
</image>
|
|
<p class="article-content">
|
|
Let's test it out, go ahead and enter "super + enter":
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_debian_keybinding_01-a71368f6.gif</url>
|
|
<title>Demonstration of new Keybinding in XFCE</title>
|
|
</image>
|
|
<p class="article-content">
|
|
And indeed, we have created a useful keybinding that calls one of our most used applications. You can chain various keys to open applications, but usually the alt, ctrl, or super keys are utilized. You can call any application that you can invoke on the terminal in this fashion, and usually these are GUI applications, like your browser, your file manager, your music player, etc.
|
|
</p>
|
|
<p class="article-content">
|
|
I will now move onto our next subject, which covers the useful feature of workspaces. The use of workspaces is more important than application-related keyboard shortcuts as they essentially maximize the use of space on your screen, allowing you to bring up an entirely new work area for you to fill with your various applications. Instead of moving application windows around and minimizing them when not in use, Workspaces allow you to simply keep those applications open at whatever screen size you like, hiding them from view temporarily, while you navigate to another workspace to do some other sort of work, and then navigate back to your previous workspace to utilize the applications you had been using earlier. The below GIF demonstrates the use of Workspaces, which are changed using keybindings.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_debian_keybinding_02-29e9b0ed.gif</url>
|
|
<title>Demonstration of Navigating Workspaces in XFCE</title>
|
|
</image>
|
|
<p class="article-content">
|
|
As you can see, each time I enter the super key followed by a number, it brings me to that numbered workspace. The change of the various applications is the change of the workspace, each one having different applications open. There are usually 10 workspaces available in tiling window managers. XFCE allows for 12 (using by default ctrl + f1-12 keys). In case you were wondering if I modified the keys for these, I did. That is because the super+number keybinding is more traditional in tiling window managers for switching workspaces. In XFCE, if you wish to change the workspace keybindings, navigate from the start menu to the settings > window manager sub-menu and select keyboard. You should then edit the keybindings labeled "Workspace" followed by the workspace number. This is basically the same process as editing keybindings for applications.
|
|
</p>
|
|
<p class="article-content">
|
|
I could continue to explore the XFCE interface, but let us now move onto the subject of Tiling Window Managers with the introduction of the i3.
|
|
</p>
|
|
<h4 class="article-header4">The i3 Tiling Window Manager</h4>
|
|
<p class="article-content">
|
|
The installation of the i3 Tiling Window Manager is relatively straight forward, as it simply involves utilizing your native package manager to do so. It is highly likely that if you wish to install a Tiling Window Manager for the first time, that you'd like to keep your current Desktop Environment in the event that you don't like it, and wish to revert back. This is completely understandable, and thus our tutorial here will cover how to install i3 alongside XFCE so that you can simply choose one or the other at login.
|
|
</p>
|
|
<p class="article-content">
|
|
Let's get started with first installing the needed pieces of software. From your terminal emulator , install the i3 window manager, the i3status display bar, the picom compositor, the dynamic menu, dmenu, and also the feh image viewer, for setting our background wallpaper.
|
|
</p>
|
|
<p class="article-content">
|
|
On Arch Linux:
|
|
<pre><code class="language-bash">[~]$ sudo pacman -S i3 i3status picom dmenu feh</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
On Debian Linux:
|
|
</p>
|
|
<pre><code class="language-bash">[~]$ sudo apt-get install i3 i3status picom dmenu feh</code></pre>
|
|
<p class="article-content">
|
|
Now we can simply reboot our machine, upon login, before entering your name and password, be sure to select i3 from the wrench icon available at the top right hand corner of our login screen:
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_debian_i3_01-c15fb4df.webp</url>
|
|
<title>Screenshot of i3 Selection in LightDm Menu</title>
|
|
</image>
|
|
<p class="article-content">
|
|
Immediately you will be presented with a far more minimal set up than XFCE. You will be prompted if you'd like to generate a default configuration for i3, go ahead and choose "Yes" and hit enter.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_debian_i3_02-4d047981.webp</url>
|
|
<title>Screenshot of i3 Welcome Prompt</title>
|
|
</image>
|
|
<p class="article-content">
|
|
Afterwards which you will be asked which "Mod" key you'd like as default, either the "super" or "alt" key. This key will be the default for chaining with other keys which when used in sequence will call various applications and change workspaces. I personally prefer the "super" key, so I'm going to choose the first option.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_debian_i3_03-f38213c6.webp</url>
|
|
<title>Screenshot of i3 mod key choice prompt</title>
|
|
</image>
|
|
<p class="article-content">
|
|
After this choice is made and you hit enter, you'll be left with no further instruction, which can be jarring for beginners. Don't worry, remember the keybinding to call the terminal we made in XFCE? Well the reason I chose "super + enter," was because that is the same command in the default i3 configuration for calling the terminal. So you can do the same here in i3, calling the terminal with "super + enter". In fact, let's call a few terminals to see the default tiling behavior of i3, hit "super + enter" a couple of times:
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_debian_i3_demo_01-143d061e.gif</url>
|
|
<title>Gif showing i3 calling terminals</title>
|
|
</image>
|
|
<p class="article-content">
|
|
As you can see, a Tiling Window Manager "tiles" its windows in a cascading fashion, utilizing as much of the available screen space (known in some circles as screen "real estate"). So how do we navigate this? Well you can indeed use the mouse to select which of your open applications you'd like to utilize, but obviously, this article being about the keyboard-centric workflow, we'll choose to navigate using our keyboard. Hitting "super+j" or "super+;"(super + semicolon) will navigate left and right respectively. Additionally, if we move a window to the bottom so that it is in a horizontal orientation using (super+shift+k), then we can demonstrate navigation up and down windows using (super+k) or (super+l)
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_debian_i3_demo_02-a9072a57.gif</url>
|
|
<title>Gif showing basic navigation in i3</title>
|
|
</image>
|
|
<p class="article-content">
|
|
Already you can see the elegant simplicity this kind of workflow enforces. Utilizing some simple keybindings, one can navigate from one window to the next, all the while entering commands into a terminal, text into a text editor, and search queries into a browser.
|
|
</p>
|
|
<p class="article-content">
|
|
I won't be going into any kind of extensive coverage of customizing your i3 environment, suffice it to say that Tiling Window Managers in general are highly customizable. Instead, I will refer you to the excellent <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://i3wm.org/docs/">i3 documentation</a>.
|
|
</p>
|
|
<p class="article-content">
|
|
As an aside, you may have noticed I also had you install dmenu and feh alongside i3 and its status bar. This is because the default configuration of i3 has a built in call to dmenu (super+d). This application is an excellent piece of software that, like the terminal, can call any application simply by entering its name into its prompt. I recommend playing around with it and checking out The Arch Wiki's <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://wiki.archlinux.org/title/Dmenu">documentation</a> on dmenu. The image viewer, feh, has a nice feature of being able to set the background wallpaper to whatever image you'd like when i3 starts. In your ~/.config/i3/config file, simply enter on its own line the following command:
|
|
</p>
|
|
<pre><code class="language-bash">exec feh --bg-fill /path/to/your/preferred_image.png</code></pre>
|
|
<p class="article-content">
|
|
If you'd like to restart i3 without having to log out, simply enter super+shift+r(if you make any adjustments to your i3 configuration file, you won't see the changes implemented until you reload i3 using this command or you log out of i3).
|
|
</p>
|
|
<p class="article-content">
|
|
To log out of i3, enter super+shift+e. This will bring up a yellow message at the top of your screen asking if you'd like to exit i3, click 'Yes,' and it will return you to the login screen.
|
|
</p>
|
|
<h4 class="article-header4">Conclusion</h4>
|
|
<p class="article-content">
|
|
There is so much more I could cover regarding Tiling Window Managers and the keyboard-centric workflow, but I will leave you with this basic introduction on how to get started with creating your own version of it. While a classic Desktop Environment is fine for most, and will probably always be more popular than Tiling Window Managers, for those of you that have an affinity towards working on the keyboard (which, if you are invested in becoming more productive on the computer, you should), a Tiling Window Manager might be something worthwhile for you to investigate. Below I provide you with a short clip of my standard workflow (if you're wondering how to get transparency to work in the terminal like in this GIF, you'll want to look into The Arch Wiki's <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://wiki.archlinux.org/title/Picom">documentation</a> on picom). To further emphasize the use of the keyboard, I have installed the <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://addons.mozilla.org/en-US/firefox/addon/vimium-ff/">Vimium extension</a> into the <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://librewolf.net/">Librewolf browser</a> to demonstrate further the possibilities of working almost completely without a mouse. Enjoy, and keep keybinding.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_debian_i3_demo_03-2b892e61.gif</url>
|
|
<title>Demo of a highly customized i3 setup</title>
|
|
</image>
|
|
</description>
|
|
</item>
|
|
<item>
|
|
<pubDate>Sun, 18 Dec 2022 12:30:00 +0200</pubDate>
|
|
<title>Ortholinear Keyboards</title>
|
|
<link>https://leafbytes.com/ortholinear-keyboards</link>
|
|
<guid isPermaLink="false">armnnyicpnraruotpoozvnqnlpchuwpulbyrnkbq</guid>
|
|
<description>
|
|
<h1>ortholinear keybords</h1>
|
|
<h3>they're just better</h3>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/OLKB_Planck-20119d22.webp</url>
|
|
<title>A 40% Planck Ortholinear Keyboard</title>
|
|
</image>
|
|
<blockquote class="article-quotes" cite="book: How Linux Works, by Brian Ward">
|
|
"The orthogonal features, when combined, can explode into complexity."
|
|
<br> -<a class="blockquote-links" target="_blank" rel="noopener noreferrer" href="https://en.wikipedia.org/wiki/Yukihiro_Matsumoto"><em>Yukihiro Matsumoto<br>Author of The Ruby Language</em></a>
|
|
</blockquote>
|
|
<h4 class="article-header4">Introduction</h4>
|
|
<p class="article-content">If you've read any of my previous articles, you can probably tell that I'm pretty obsessed with The Keyboard-Centric Workflow. In utilizing the NeoVim Text Editor, The Vimium Browser Extension, and the bspwm Tiling Window Manager. I can honestly say that my <em>potential</em> productivity has greatly increased. Although I owe a great deal of this increased potential productivity to the aforementioned pieces of software, there is one piece of hardware that has been a game-changer to my workflow and that is the ortholinear keyboard.
|
|
</p>
|
|
<p class="article-content">I first encountered an ortholinear keyboard after witnessing my mentor working with a variety of ergonomic keyboards with different layouts in an attempt to address the carpal tunnel he had developed over nearly nine years of programming as a software developer. At one point he pulled out what is known as a 40% Planck ortholinear keyboard. You can see an example of of such a keyboard at the beginning of this article.
|
|
</p>
|
|
<p class="article-content">At the time I first saw one of these I was a little perplexed as it appeared to have no number or symbol keys (and in the case of my mentor, there were nothing printed on the keys themselves, so it was even more perplexing). I was more interested in learning the basics of Vim at the time, and had shelved investigating these odd looking mysterious devices until I had a better grasp on text editing and the syntax of JavaScript. At one point, however, on perusing reddit, I discovered a subreddit devoted to these interesting devices, <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://www.reddit.com/r/olkb">r/olkb</a>.
|
|
</p>
|
|
<p class="article-content">I decided that, while I loved my current standard keyboard, that I was tired of reaching for keys, and that the 40% Planck ortholinear keyboard (OLKB) from <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://drop.com/buy/planck-mechanical-keyboard">Drop</a> was a worthy investment. After a short two day period, I had memorized the new layout and was flying faster across my Tiling Window Manager than I ever had before. It solidified and dare I say, finalized, my keyboard-centric workflow. A Tiling Window Manager, A Vim Text Editor, Vimium in The Browser, and an ortholinear keyboard, these things didn't render the computer mouse obsolete, but did indeed heavily enforce use of the keyboard to the point where there was far less context switching between applications, and far less reaching away from home row.
|
|
</p>
|
|
<p class="article-content">This brief article is an introduction to ortholinear keyboards. In it, I will cover why they are beneficial to anyone who spends a decent amount of time at their desktop computer, and the varying types available to anyone looking to invest in them.
|
|
</p>
|
|
<p class="article-content">As a brief disclaimer, I must say that no one has sponsored me for this article, and the brands mentioned are solely there as a reference in a truthful account of my limited, but particularly positive, experience with ortholinear keyboards.
|
|
</p>
|
|
<h4 class="article-header4">Standard Vs Ortholinear</h4>
|
|
<p class="article-content">The Keyboard, as we know it today, has a <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://en.wikipedia.org/wiki/Computer_keyboard#History">long history</a>, originating with the invention of the <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://en.wikipedia.org/wiki/Typewriter">Typewriter</a>. The standard of staggering of the keys diagonally out from the space key originated with the Typewriter in order to accommodate the mechanical linkage of the switches. This staggering of the keys was adopted by the computer keyboard, and persists on the majority of keyboards to this day. Many of us, myself included, learn to type on these staggered layouts, and rarely, if ever, question this choice in design. I would posit, however, having experienced and enjoyed the use of an ortholinear keyboard for a short time now, that perhaps you should.
|
|
</p>
|
|
<p class="article-content">The orthogonal orientation and linear layout of the keys is what differentiates an ortholinear keyboard from the standard keyboards the majority of computer users are accustomed to. In orienting the keys in this way, the digits of the hand no longer "reach outwards and to the left" towards the periphery of the keyboard in order to access certain keys. Rather, the fingers "reach symmetrically both vertically and horizontally" which is a more natural movement when making small dextrous motions like typing. Additionally, ortholinear keyboards often incorporate other ergonomic design choices, such as reducing the overall size of the keyboard by utilizing other keys known as "layer" keys which allow the typist to access symbols and numbers through holding down what is akin to a second and third shift key. This allows for even less movement of the hands away from home row. There are also what is known as split keyboards, where the board itself is physically divided into two halves. Split keyboards are designed so that the typist may have their hands rest in a more natural position closer to the sides of their body (many of these split keyboards also incorporate the aforementioned design choices like ortholinear layout and the use of layer keys).
|
|
</p>
|
|
<h4 class="article-header4">A Brief Word On Layouts</h4>
|
|
<p class="article-content">There are an extremely wide variety of keyboard designs in use today, but the majority of them use only one layout, the QWERTY layout, with COLEMAK and DVORAK being relatively unknown alternatives with their own niche user base. These layouts are designed to be more ergonomic and can theoretically be utilized more efficiently (faster) than QWERTY. I'll admit I have no experience utilizing these other layouts and as much as I love the keyboard-centric workflow, will probably not explore these other layouts for some time, if ever. This is due to the fact that I personally believe that having comfortable access to the entirety of the physical keyboard has a greater impact on typing speed than the layout itself. This is because the time taken moving your hands up and down and away from home row may have a greater effect on typing speed than the key layout. This isn't to say that in the hands of an experienced COLEMAK or DVORAK user, an ortholinear keyboard can't be used more efficiently than a typist using that same ortholinear keyboard with the QWERTY layout. Rather, I am simply expressing my opinion that this increase in words per minute is probably negligible when compared to the benefits of simply converting to an ortholinear keyboard. I'll admit that currently, I'd rather invest in a split ortholinear keyboaord than invest in learning one of these other layouts, but I am always open to debate this topic if you'd like to reach out to me, perhaps you can change my mind.
|
|
</p>
|
|
<h4 class="article-header4">Should You Use An OLKB?</h4>
|
|
<p class="article-content">Obviously, my preference is to utilize an ortholinear keyboard, but just like with the previous topics I have covered, it is a matter of personal taste and workflow. The choice of keyboard, in particular, is a very personal one because unlike a piece of software, you are interacting with the keyboard physically, and very very often. Thusly what may be comfortable and enjoyable for me to use may not be so for you. That said, I do believe an investigation into utilizing some kind of specialized keyboard is worthwhile for any software developer or heavy desktop computer user. Programmers in particular spend an exorbitant amount of time in front of the computer and thusly investing in certain pieces of equipment that make that experience comfortable, efficient, and enjoyable, are paramount. This is not just limited to your choice of keyboard, but also office chair, computer screen, and other pieces of equipment. This may very well be even more important than choice of software, as a poor choice in equipment can, over time, result in poor posture and all the physical ailments that can result from that. Physically speaking, man was never meant to sit still hunched over a computer screen for hours on end. Thusly it is imperative that you ensure the least amount of harm to your body is incurred while you pursue your computer related endeavors.
|
|
</p>
|
|
<h4 class="article-header4">Conclusion</h4>
|
|
<p class="article-content">Unlike my other articles, which often offer up an introductory tutorial on the subject, this article will not provide you with any such introduction, as the concepts surrounding the use of ortholinear keyboards and the use of layer keys is rather self explanatory. If you do choose to purchase and learn to use an ortholinear keyboard, know that it may take a few days to a week to reorient yourself to it, depending on frequency of use. Keep at it, you'll find the benefit of learning to use your new keyboard to be worthwhile, especially when combined with use of Vim and a Tiling Window Manager.
|
|
</p>
|
|
<p class="article-content">Although I'm sure that if you're intrigued by the subject, you'll do your own research, I have provided some images of various ortholinear keyboards below as a reference. Additionally I encourage you to watch <a class="article-outside-links" target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/watch?v=Ho_CFfdsmc8">this video</a> from Ben Vallack, where he goes into depth covering the differences between standard and ortholinear keyboards. I should note that I have no personal or professional affiliation with Ben Vallack, but I've thoroughly enjoyed Ben's videos for some time now, and I feel like he covers this subject very well.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/olkb_01-343c22aa.webp</url>
|
|
<title>A Minimaliist Split OLKB</title>
|
|
</image>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/olkb_02-1232d01e.webp</url>
|
|
<title>An Ergodox Split OLKB</title>
|
|
</image>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/olkb_03-c09b69d8.webp</url>
|
|
<title>An Miniaxe 40% Split OLKB</title>
|
|
</image>
|
|
</description>
|
|
</item>
|
|
<item>
|
|
<pubDate>Wed, 11 Jan 2023 12:30:00 +0200</pubDate>
|
|
<title>Espanso</title>
|
|
<link>https://leafbytes.com/espanso-text-expander</link>
|
|
<guid isPermaLink="false">tshcowhfkacysmspjzlhlsmcurlwuudibdtqnkrq</guid>
|
|
<description>
|
|
<h1>espanso</h1>
|
|
<h3>expand your text</h3>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/espanso_logo-15ea8537.webp</url>
|
|
<title>An image of the espanso logo</title>
|
|
</image>
|
|
<blockquote class="article-quotes" cite="essay: The Deep Zoo, by Rikki Ducornet">
|
|
"The texts we write are not visible until they are written. Like a
|
|
creature coaxed from out a deep wood, the text reveals itself little by little.
|
|
The maze evokes a multiplicity of approaches, the many tricks we employ to tempt
|
|
the text hither."
|
|
<br> -<a class="blockquote-links" target="_blank"
|
|
rel="noopener noreferrer"
|
|
href="https://library.indstate.edu/about/units/rbsc/obscure/PDFs/ducornet_deep.pdf"><em>Ricki Ducornet<br>The Deep Zoo</em></a>
|
|
</blockquote>
|
|
<h4 class="article-header4">Introduction</h4>
|
|
<p class="article-content">
|
|
Prior to a friend of mine mentioning espanso to me, I was unaware of such a
|
|
thing as a text expander. I was familiar with the idea of expanding text, and
|
|
until I adopted espanso, I was utilizing Neovim's configuration file to set
|
|
custom text expansion. For example within my init.vim (which I used instead of
|
|
lua at the time), I had set up a shortcut to write out "console.log()" whenever
|
|
I inputted "ccl" while in insert mode.
|
|
</p>
|
|
<p class="article-content">
|
|
I had many such shortcuts, mainly meant for use with various console calls in
|
|
JavaScript, as well as some generic coding shortcuts. At one point my friend had
|
|
pointed me in the direction of a new text expander written in rust known as
|
|
espanso, and today it has become a regular part of my workflow. Whether it be a
|
|
part of the command line, Neovim, or my browser, I utilize espanso in nearly
|
|
every aspect of my workflow now, and I felt it was worthwhile to cover in
|
|
detail.
|
|
</p>
|
|
<h4 class="article-header4">What Is A Text Expander?</h4>
|
|
<p class="article-content">
|
|
Most standard workflows by "Power Users" involve the use of keyboard shortcuts.
|
|
Mainly Ctrl+C, Ctrl+V, Ctrl+A, and Ctrl+Z. If one is particularly resourceful,
|
|
they are aware of various keyboard shortcuts involving the additional use of ALT
|
|
and SHIFT keys, but I digress. While these shortcuts are still very useful and a
|
|
necessary tool in the belt of any serious Computer user, these methods still
|
|
only hold a candle to the ultra capable workflows one can achieve with a tiling
|
|
window manager, a modal text editor, and an ortholinear keyboard (as well as the
|
|
Vimium extension installed on the browser). Each of these subjects I have covered
|
|
in detail in previous articles, and each of them continually improves upon the
|
|
user's implementation of the keyboard-centric workflow. There is, however, one
|
|
other tool that greatly adds to the keyboard-centric workflow, and that is the
|
|
text-expander.
|
|
</p>
|
|
<p class="article-content">
|
|
Let's say you have a series of commands or parts of a document that you
|
|
repeatedly find yourself typing over and over again. Commonly known as
|
|
boilerplate, these repeated pieces of text can become cumbersome and are the
|
|
bane of any serious computer user, as this information is usually a formality,
|
|
and has little to do with the meat of the content of the document itself. Of
|
|
course, if there is a lot of text, one may find oneself simply copying and
|
|
pasting the text, or making a multitude of copies via some script. Let's say
|
|
there is some subtle difference between the documents though? Well using
|
|
standard UNIX utilities like grep, sed, and awk can accomplish what one wants in
|
|
an automated fashion. So where does that leave the text expander? With so many
|
|
other tools available to the modern power user like autocomplete in the shell
|
|
and text editor, as well as keyboard shortcuts like Ctrl+C/Ctrl+V in pretty much
|
|
every application, what more could you need?
|
|
</p>
|
|
<p class="article-content">
|
|
Indeed, when I first discovered that there even were applications like text
|
|
expanders, I found myself wondering why they even existed when one could write
|
|
aliases for your shell, and write custom shortcuts for NeoVim. After a short
|
|
period of time, however, it dawned on me the power of text expanders, and that
|
|
power was the ability to write quick aliases/text shortcuts that could be used
|
|
in <em>any</em> application. And when used in conjunction with shell scripts
|
|
and aliases, the power of text expansion becomes even more obvious.
|
|
</p>
|
|
<h4 class="article-header4">Espanso Basics</h4>
|
|
<p class="article-content">
|
|
While I could go into the details of the espanso program itself, I'll simply
|
|
leave <a class="article-outside-links" target="_blank"
|
|
rel="noopener noreferrer" href="https://espanso.org/">this link</a> to the official
|
|
website for you to peruse. There are many other text expanders out there, but espanso
|
|
is open source and OS-agnostic. Additionally it is written in rust, which is known
|
|
to provide fast applications when utilized by a capable
|
|
programmer. It is the only text expander I have used, so I cannot speak
|
|
to how it compares to others, but considering the aforementioned features, along with my own
|
|
positive experiences utilizing the program, is enough reason for me to not investigate
|
|
the alternatives at the time of this writing. Should you wish to install espanso
|
|
and try it for yourself, please see their official <a class="article-outside-links" target="_blank"
|
|
rel="noopener noreferrer" href="https://espanso.org/install/">installation
|
|
documentation</a>.
|
|
</p>
|
|
<p class="article-content">
|
|
Using espanso is very simple. For example once you have the daemon running (see
|
|
the <a class="article-outside-links" target="_blank" rel="noopener noreferrer"
|
|
href="https://espanso.org/docs/get-started/">documentation</a>), you can check your ip
|
|
address simply by typing in any application:
|
|
<pre><code class="language-bash">[~]$ :ip</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
This will expand out to display your ip address! Of course, one could easily see this
|
|
using command line. Prior to using espanso, I had created a bash alias
|
|
to do just that (and admittedly it gives more information than espanso does by default):
|
|
<pre><code class="language-bash">[~]$ alias ipaddr="curl ifconfig.me/all.json | jq"</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Now, if this was all espanso ever did, I'd say the program was trivial and this
|
|
article wouldn't even exist. The power of espanso is not in its out of the box
|
|
settings, but rather in its simple config file. On Linux, this configuration
|
|
file can be found in:
|
|
<pre><code class="language-bash">~/.config/.config/espanso/match/base.yml</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Here, you will find the default text expansions under the section "match":
|
|
<pre><code class="language-yaml">
|
|
matches:
|
|
# Simple text replacement
|
|
- trigger: ":espanso"
|
|
replace: "Hi there!"
|
|
</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
And indeed if we type out the trigger ":espanso", we'll see our text is replaced
|
|
with "Hi there!":
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/espanso_example-d90dca07.gif</url>
|
|
<title>Demonstration of Basic Usage of Espanso</title>
|
|
</image>
|
|
There are various default examples showing espanso's
|
|
utility. If you look towards the bottom of the
|
|
example text expansions, you'll see the ":ip"
|
|
example, which includes a very similar command to my ip alias:
|
|
<pre><code v-pre class="language-yaml">
|
|
# Returns public ip address
|
|
- trigger: ":ip"
|
|
replace: "{{output}}"
|
|
vars:
|
|
- name: output
|
|
type: shell
|
|
params:
|
|
cmd: "curl ifconfig.me ; echo ''"
|
|
</code></pre>
|
|
</p>
|
|
<h4 class="article-header4">Writing Espanso Aliases</h4>
|
|
<p class="article-content">
|
|
Now, all this is well and good, but what sort of things can one accomplish with
|
|
this tool? Well one of my most constantly repeated series of code that I need on
|
|
the fly is "console.log()" whenever debugging a JavaScript file. While this
|
|
isn't a lot of text to write, it can indeed get cumbersome to rewrite it many
|
|
times over, and so one my first espanso aliases was:
|
|
<pre><code class="language-yaml">
|
|
- trigger: ";cll"
|
|
replace: "console.log()"
|
|
</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Note that instead of using the colon, I opted to use the semicolon for my custom
|
|
espanso aliases as the likelihood of typing out anything directly after a
|
|
semicolon is even less likely than after a colon (especially if using Vim in
|
|
command mode). While this might seem trivial at first, if anyone has ever
|
|
debugged a JavaScript file using this most basic of tools, one can see how
|
|
useful this could be.
|
|
</p>
|
|
<p class="article-content">
|
|
Within JavaScript (or any programming language), there are
|
|
many times one can find themselves writing various words or
|
|
series of code blocks over and over again, here a few examples
|
|
of what I have written in my espanso config to occasionally speed this up:
|
|
<pre><code class="language-yaml">
|
|
- trigger: ";for"
|
|
replace: "for (;;) {}"
|
|
|
|
- trigger: ";while"
|
|
replace: "while () {}"
|
|
|
|
- trigger: ";if"
|
|
replace: "if () {}"
|
|
|
|
- trigger: ";elif"
|
|
replace: "else if () {}"
|
|
|
|
- trigger: ";else"
|
|
replace: "else {}"
|
|
|
|
- trigger: ";$"
|
|
replace: "`${}`"
|
|
|
|
- trigger: ";do"
|
|
replace: "do {} while ()"
|
|
|
|
- trigger: ";func"
|
|
replace: "function () {}"
|
|
|
|
- trigger: ";=>"
|
|
replace: "() => {}"
|
|
|
|
- trigger: ";try"
|
|
replace: "try {} catch(error) {}"
|
|
</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Okay, so what about use outside of the terminal? Well in writing any website,
|
|
any good web developer will be typing either "127.0.0.1:" or "localhost:" a lot,
|
|
right? Well why not use this espanso alias instead?:
|
|
<pre><code class="language-yaml">
|
|
- trigger: ";loc"
|
|
replace: "localhost:"
|
|
</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Again, many of these seem trivial on the surface, and you might even be rolling
|
|
your eyes reading this thinking "Really? You can't be bothered to type out nine
|
|
characters vs four?" I'll admit time savings rarely come up to typing out only a
|
|
few less characters, but one of the powers of Vim is its ability to accomplish
|
|
more with less keystrokes, and when used in its entirety, I'd argue that no one
|
|
using the classic keybindings available in the majority of non-modal text
|
|
editors can accomplish the same speed of workflow as those who use some form of
|
|
modal text editing. Espanso moves these cumulative time savings into any
|
|
application where typing is a part of its interface!
|
|
</p>
|
|
<p class="article-content">
|
|
Let's move onto another use for espanso. I'm a big fan of
|
|
using DuckDuckgo's bangs. If you're unaware of bangs, check out the
|
|
<a class="article-outside-links" target="_blank" rel="noopener noreferrer"
|
|
href="https://duckduckgo.com/bangs">website</a>.
|
|
Essentially, if one has DuckDuckgo as their default search engine
|
|
(or searx, which has this feature too), one can
|
|
simply enter into your search/url bar: !yt and any other words typed after that
|
|
will be directly searched in YouTube. There are a multitude of these bangs
|
|
available and I'd encourage you to take a look at what is available. There are,
|
|
however, a few websites that DuckDuckgo hasn't integrated into bangs, so what to
|
|
do? While I'm sure there are other ways to accomplish this, I have utilized
|
|
espanso to do this for certain sites, like Odysee, a Youtube alternative:
|
|
<pre><code class="language-yaml">
|
|
- trigger: "!ody"
|
|
replace: "https://odysee.com/$/search?q="
|
|
</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Note my decision to use the exclamation point instead of the semicolon here, in
|
|
order to keep with the consistencies of DuckDuckgo's bang syntax. When I type
|
|
"!ody" into my url, this immediately expands to "https://odysee.com/$/search?q="
|
|
and I can now type in my search query. This is even more efficient on the
|
|
utilized network than DuckDuckgo's bangs as it never even
|
|
queries DuckDuckgo before re-routing to the requested page. I also use this same
|
|
technique for other sites, like Quetre, a non-Javascript front-end for Quora:
|
|
<pre><code class="language-yaml">
|
|
- trigger: "!que"
|
|
replace: "https://qr.vern.cc/search?q="
|
|
</code></pre>
|
|
</p>
|
|
<h4 class="article-header4">An Interesting Use Case</h4>
|
|
<p class="article-content">
|
|
Now, any other power user of Linux and Vim would note, "yeah, but I can easily
|
|
accomplish alot of these same things in the shell or vim itself, I don't need a daemon
|
|
listening in the background taking up (a little bit) of RAM for this." Which is
|
|
a fair point, but I'd argue that what one can accomplish with espanso integrated
|
|
into your workflow with the shell, vim, and the browser, is just a little more
|
|
streamlined than without. Now, this last and final example on the uses of the
|
|
espanso text expander will involve use of the shell, a shell script, and NeoVim.
|
|
I am positive there are other ways of accomplishing what I have done here, but
|
|
nevertheless I am happy with the result as it stands right now.
|
|
</p>
|
|
<p class="article-content">
|
|
For a while, I had been writing and rewriting a simple shell script that would save my
|
|
current working directory. Additionally the script would take an optional
|
|
argument of a file which would be utilized by a separate script or alias that
|
|
would return me immediately to the saved directory and open
|
|
the specified file when invoked. So, for example, if I wanted to save
|
|
my current directory with a file I was working on, I could call the script like so:
|
|
<pre><code class="language-bash">[~]$ sdir myfile.txt</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
The script very simply saves an environment variable called $sdir, and an
|
|
optional environment variable for the file called $sdoc into a
|
|
dotfile. A corresponding alias, "rdir" could then return to said directory like so:
|
|
<pre><code class="language-bash">[~]$ rdir</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Originally, rdir was a shell script that looked for the existence of the $sdoc,
|
|
and if it existed, would call nvim on it, and if it didn't, would simply
|
|
navigate to the saved directory $sdir. This worked for some time, but I wanted
|
|
to be able to save a different directory to this dotfile and seamlessly return
|
|
to it, and the built-in command "cd", doesn't work in shell scripts. I thought
|
|
"No problem, cd works in an alias, I'll just source the file in the alias and
|
|
then use cd to move into that new directory." Only to find out that source
|
|
didn't work inside an alias...
|
|
</p>
|
|
<p class="article-content">
|
|
Like I said, there are probably other, less hacked together, ways to accomplish my goal
|
|
here. Nevertheless, it dawned on me that I could remove my rdir script and forego
|
|
using an alias by simply combining the sdir shell script with an espanso alias like so:
|
|
<pre><code class="language-yaml">
|
|
- trigger: ";rr"
|
|
replace: "source ~/.config/.sdrc && cd $sdir && nvim $sdoc"
|
|
|
|
- trigger: ";rd"
|
|
replace: "source ~/.config/.sdrc && cd $sdir && ls"
|
|
</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Although the above commands solved my issues with both cd and source in the
|
|
shell, typing this entire command out each time I wanted to start working again
|
|
would have been cumbersome. Using the espanso text-expander daemon takes care of that for me!
|
|
This solution is definitely not as elegant as some might like, but it serves my simple purposes
|
|
(save my current directory and a desired file so I can easily navigate back to it, and also easily
|
|
save a different directory and file at any time).
|
|
</p>
|
|
<h4 class="article-header4">Conclusion</h4>
|
|
<p class="article-content">
|
|
Admittedly, there are probably many other use cases for espanso I have not
|
|
explored in this article. If one looks over the documentation in more detail,
|
|
one will find a myriad of other useful tips more in-depth than the ones I have
|
|
presented here, so please take the time to check out their great <a
|
|
class="article-outside-links" target="_blank" rel="noopener noreferrer"
|
|
href="https://espanso.org/">documentation</a>.
|
|
Now that I utilize espanso, I can't really imagine working without it.
|
|
It's like the last puzzle piece to my keyboard-centric work flow was filled in when I
|
|
discovered this amazing tool.
|
|
</p>
|
|
<p class="article-content">
|
|
To cap things off, I'll share with you the simple sdir shell
|
|
script below (as well as this <a class="article-outside-links" target="_blank"
|
|
rel="noopener noreferrer"
|
|
href="https://raw.githubusercontent.com/tomit4/notes/main/scripts/sdir">link
|
|
on my GitHub</a>).
|
|
Additionally, I'll provide you with some lines of Lua code that when put into
|
|
your <a class="article-outside-links" target="_blank"
|
|
rel="noopener noreferrer"
|
|
href="https://github.com/tomit4/notes/tree/main/.config/nvim">
|
|
NeoVim configuration files</a>, will return you to wherever you last saved in
|
|
your files (this works incredibly well with the aforementioned sdir script and
|
|
espanso aliases, as I simply return to the exact directory, file, and
|
|
place in that file I left off on simply by typing ";rr" into the command
|
|
line). Enjoy, and please do check out espanso, it's a great project!
|
|
<pre><code class="language-bash">
|
|
#!/bin/bash
|
|
# sdir.sh
|
|
# used with espanso ;rr and ;rd command
|
|
# A simple bookmarking script used in conjunction with rdir
|
|
# to save a directory for easy navigation later
|
|
|
|
# save our current working directory
|
|
sdir=$(pwd)
|
|
sdoc="${1:-''}"
|
|
# allow overwriting of sdrc
|
|
set +o noclobber
|
|
|
|
# define and create .sdrc file
|
|
sdrc="$HOME/.config/sdir/".sdrc
|
|
if [[ ! -f "$sdrc" ]]; then
|
|
/usr/bin/touch "$sdrc"
|
|
fi
|
|
|
|
if [[ $# -gt 0 ]]; then
|
|
sdoc="$1"
|
|
else
|
|
sdoc=""
|
|
fi
|
|
|
|
echo 'export sdir='"$sdir" >"$sdrc"
|
|
echo 'export sdoc='"$sdoc" >>"$sdrc"
|
|
</code></pre>
|
|
|
|
<pre><code class="language-lua">
|
|
-- init.lua
|
|
-- jump to last place visited in file
|
|
vim.api.nvim_create_autocmd('BufReadPost', {
|
|
callback = function()
|
|
local mark = vim.api.nvim_buf_get_mark(0, '"')
|
|
local lcount = vim.api.nvim_buf_line_count(0)
|
|
if mark[1] > 0 and mark[1] <= lcount then
|
|
pcall(vim.api.nvim_win_set_cursor, 0, mark)
|
|
end
|
|
end,
|
|
})
|
|
</code></pre>
|
|
</p>
|
|
</description>
|
|
</item>
|
|
<item>
|
|
<pubDate>Wed, 11 Jan 2023 12:30:00 +0200</pubDate>
|
|
<title>Git Basics</title>
|
|
<link>https://leafbytes.com/git-basics</link>
|
|
<guid isPermaLink="false">wzameclujxawqcztqifurjclekhgizzbghiqlnrz</guid>
|
|
<description>
|
|
<h1>git basics</h1>
|
|
<h3>understanding version control</h3>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/git_logo-d785b39e.webp</url>
|
|
<title>An image of the git logo</title>
|
|
</image>
|
|
<blockquote class="article-quotes" cite="https://commons.wikimedia.org/wiki/File:Git_format.png">
|
|
"I'm an egotistical bastard, and I name all my projects after myself.
|
|
First 'Linux', now 'Git'"
|
|
<br> -<a class="blockquote-links" target="_blank"
|
|
rel="noopener noreferrer"
|
|
href="https://git.wiki.kernel.org/index.php/GitFaq#Why_the_.27Git.27_name.3F"><em>Linus Torvalds</em></a>
|
|
</blockquote>
|
|
<h4 class="article-header4">Introduction</h4>
|
|
<p class="article-content">
|
|
Whether working in data science, software/web development, or even if one is
|
|
just a modern power user of computers in general, one is probably at least
|
|
somewhat familiar with the Git version control system, or at least with the now
|
|
infamous hosting service, Github.
|
|
</p>
|
|
<p class="article-content">
|
|
As a beginning software/web developer, I often find myself overwhelmed by the sheer
|
|
vastness of the amount of tools available, and the intrinsically complicated
|
|
ecosystem in which modern software development takes place. There are few pieces
|
|
of software on which there is a ubiquitous standard in place like there is with
|
|
Git. In this article, I will attempt to introduce the Git version control system
|
|
and its most basic features. The intended audience of this article is a complete beginner to
|
|
Git. Thusly, this article will not cover some of Git's more in-depth features,
|
|
but please take a look at the provided links for more documentation at the
|
|
end.
|
|
</p>
|
|
<h4 class="article-header4">A Brief History of Git</h4>
|
|
<p class="article-content">
|
|
In looking over my previous article covering <router-link class="inter-article-links"
|
|
to="/why-use-linux">Why Use Linux</router-link>, I now realize I
|
|
never referenced the history of Linux and its creator, Linus Torvalds. This was
|
|
probably due to the extensive history of Linux, and I didn't wish for that
|
|
article to turn into more of a history lesson than a beginner's installation
|
|
tutorial. While it is not my intention to do so with this article either, I feel
|
|
that Git's history is far more easy to cover, as it is a more recently developed
|
|
piece of software and has a far shorter timeline to cover.
|
|
</p>
|
|
<p class="article-content">
|
|
Git was originally developed by Linus Torvalds in 2005. Torvalds, as I mentioned
|
|
earlier, is the creator and current maintainer of the Linux Kernel. Linux in its
|
|
initial days of distribution, was passed around by software enthusiasts using
|
|
floppy disks and later on CD-ROMs. Updates to the Linux Kernel in the early days
|
|
were distributed via email mailing lists. The emails included files known as "patches",
|
|
which provided the differing lines of code which were either added, removed, or
|
|
altered from the pre-existing code base. While some form of version control had been a part of
|
|
software development since the early 1960s, concurrent version systems would
|
|
become the standard for decades starting in 1975, which would later be overtaken
|
|
by Apache's Subversion system, and finally in the late 1990s, distributed
|
|
revision control systems would come to dominate the preferred versioning control
|
|
system by the majority of software developers.
|
|
</p>
|
|
<p class="article-content">
|
|
BitKeeper was the first of these distributed version control systems, and was a
|
|
boon to the Linux Kernel development team, who adopted a beta version of
|
|
Bitkeeper in 1999. There was some controversy surrounding the use of BitKeeper,
|
|
which at the time was a piece of proprietary software, and many
|
|
within the Linux community felt that this was in conflict with the principles
|
|
under which Linux was founded. In April of 2005, BitMover
|
|
(owner of BitKeeper) announced that it would stop providing
|
|
a free version of their software to the community. Linus Torvalds then decided
|
|
to take a couple of weeks off from development on the Linux Kernel to create a
|
|
new distributed version control system which he later called
|
|
"Git", named after the British slang for a "stupid person."
|
|
</p>
|
|
<p class="article-content">
|
|
Although originally not intended to be a full-blown version control system, Git
|
|
eventually became more than just a simple handful of
|
|
scripts, and is now utilized by the majority of software developers today.
|
|
</p>
|
|
<h4 class="article-header4">What Is Version Control?</h4>
|
|
<p class="article-content">
|
|
To those uninitiated into the ecosystem of modern software development, version
|
|
control is pretty much what it sounds like. You have a piece of software you
|
|
have written, and you have posted it up online for all to enjoy (because you
|
|
released it under an open source license, right?). Eventually someone uses it
|
|
and discovers a bug, or has a feature request, or simply wants to take your project
|
|
and make their own version of it, but how do you do this quickly and easily?
|
|
</p>
|
|
<p class="article-content">
|
|
As I covered in the introduction, in the early days there wasn't a very easy way
|
|
to do this. You emailed a patch file to an email mailing list, and everyone who
|
|
utilized your software had to be subscribed to that mailing list and manually
|
|
patch the files themselves (oftentimes this process was partially automated via
|
|
makefiles or bash scripts). Thank goodness today we have distributed version control
|
|
systems like Git that largely make this process incredibly easy by comparison.
|
|
</p>
|
|
<h4 class="article-header4">Why Version Control is So Important</h4>
|
|
<p class="article-content">
|
|
Let's make our example scenario from before more simple for the sake of
|
|
explanation. Let's say you write some basic JavaScript code like so:
|
|
<pre><code class="language-javascript">console.log("hello");</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
You save it to your local machine in a file called 'hello.js'. Eventually you
|
|
realize the triviality of such a program, and want to extend out its
|
|
functionality. For the sake of brevity, I'll not write out more code, but let's
|
|
say you write a series of functions and the total lines of code (LOC) goes from
|
|
being 1 to 40 lines. You intelligently save your work and also decide to back it
|
|
up on an external hard drive, and even have a friend back up the current version
|
|
of your software on their server at their house. Great!
|
|
</p>
|
|
<p class="article-content">
|
|
But the ideas keep coming, you keep on coding and adding features, occasionally
|
|
refactoring the code to be less verbose and more succinct. You're becoming a
|
|
better developer and the program is starting to look good. Eventually you decide
|
|
to integrate a large new feature and start to write out a substantial amount of
|
|
code. Once completed, you save your progress, back it up on your external hard drive
|
|
as well as at your friend's server. Satisfied with the new feature, you decide to call
|
|
it a night, and hit the hay.
|
|
</p>
|
|
<p class="article-content">
|
|
In the morning you return to your project only to find that this new feature has
|
|
broken a different part of your program. You accidentally didn't
|
|
compartmentalize the features, resulting in spaghetti code. It'll take you two
|
|
days to remove all the code you wrote yesterday, and the chance of introducing a
|
|
bug during this refactor is high. If only you could just roll back time and go
|
|
back...to a previous version.
|
|
</p>
|
|
<p class="article-content">
|
|
This simple example is but one of the many reasons why version control is so
|
|
important to software development, and doesn't even include the benefits when
|
|
working with multiple developers on a single project. So how would this scenario
|
|
play out had you used Git? Let's take a look on how to do that in the next
|
|
section.
|
|
</p>
|
|
<h4 class="article-header4">Getting Started On Github</h4>
|
|
<p class="article-content">
|
|
Again, we write out our basic example code:
|
|
<pre><code class="language-javascript">console.log("hello");</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
We save our file, 'hello.js,', but this time we decide to use Git to save our
|
|
progress on Github. I won't be covering how to set up a Github account, but here
|
|
is <a class="article-outside-links" target="_blank" rel="noopener noreferrer"
|
|
href="https://docs.github.com/en/get-started/signing-up-for-github/signing-up-for-a-new-github-account">
|
|
a tutorial on how to do so</a>.
|
|
</p>
|
|
<p class="article-content">
|
|
Once you've established a Github account, log into Github, click on the "New"
|
|
button in the top left-hand corner. Set up a project name called "my_awesome_js_project"
|
|
and give it a brief description before hitting the "Create Repository" button at the bottom.
|
|
</p>
|
|
<p class="article-content">
|
|
After this, you will be presented with a project screen that is a visual
|
|
representation of your project. This initial screen is pretty bare bones, but
|
|
provides you with a helpful series of commands to enter into your terminal to
|
|
start using Git to version control your project.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_github_01-6b8c17cf.webp</url>
|
|
<title>Initial Github Repository Page</title>
|
|
</image>
|
|
While you could technically start creating files and pushing them
|
|
to Github using their GUI interface here in the browser, that was
|
|
never the intended way of working with Git, which is a command line tool.
|
|
</p>
|
|
<p class="article-content">
|
|
So, returning to our initial example, we have a 'hello.js' file, in a project
|
|
directory under the same name as our project name from before,
|
|
"my_awesome_js_project". Let's initialize a Git repository inside of this
|
|
directory by typing into the terminal:
|
|
<pre><code class="language-bash">[ ~]$ git init</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Great, you should receive a brief message that covers the initialization of your
|
|
project. If you look around using the "ls" command, however, you'll find that
|
|
there aren't any new files...or are there? If you then try the "ls" command with
|
|
the "-a" flag, you'll see that we now have a hidden ".git" directory. You
|
|
shouldn't need to access this directory as a beginner, but it's good to know
|
|
it's there in case you do need to make some direct modifications to your Git
|
|
configuration.
|
|
</p>
|
|
<p class="article-content">
|
|
Continuing on, let's add some basic files to our repository. While we do have
|
|
our "hello.js" file, it's always a good practice to have a README.md file in our
|
|
repository. Github will present this README to anyone who navigates to your
|
|
project via Github, and it's generally a good idea to provide some basic
|
|
documentation about our project to those who take a look at it. Let's create a
|
|
very basic README.md via the command line per the suggestion on Github like so:
|
|
<pre><code class="language-bash">[ ~]$ echo "# my_awesome_js_project" >> README.md</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
This will create a simple header in a README.md file, which you should now see in
|
|
your "my_awesome_js_project" directory alongside your "hello.js" file. Now let's
|
|
use Git to add these files to the repository.
|
|
<pre><code class="language-bash">[ ~]$ git add README.md hello.js</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Now, we're going to "commit" these files to our repository. You can think of
|
|
this as a kind of "staging" of our files.
|
|
<pre><code class="language-bash">[ ~]$ git commit -m "first commit"</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Technically at this point, the next suggested command is optional, but it is
|
|
very good practice to change branches. A brief explanation of what branches are
|
|
is necessary to the uninitiated here. One of the most powerful aspects of Git
|
|
and other versioning systems is its ability to keep track of multiple "branches"
|
|
of your project. Much as the name implies, you can think of branches as
|
|
divergences along a tree of versions of your project. Remember in our initial
|
|
example that you added an extensive feature that once written broke the rest of
|
|
the program? Well that is a good example of when a separate branch would have
|
|
been helpful, as once you were done working on that branch of the project, it
|
|
would not have been part of the "main" or "master" branch of the project. You
|
|
can think of the "main" branch as being the trunk of a tree, the major body of
|
|
representation of your project. When adding a new feature, fixing a bug, or
|
|
doing any sort of work where you don't wish to change the current code base,
|
|
it's always a good idea to start a new branch.
|
|
</p>
|
|
<p class="article-content">
|
|
Whenever a new git repository is initialized, it defaults to a branch known as
|
|
"master". This branch, in practice, should never be touched except by the
|
|
project maintainer, who will "merge" the project branches first into a
|
|
development branch commonly known as "main." Upon completion of certain
|
|
versions, the project maintainer will merge these changes into the "master" branch.
|
|
This is why Github's documentation instructs us to create a main branch like so:
|
|
<pre><code class="language-bash">[ ~]$ git branch -M main</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Finally, we'll configure Git to send our changes to our Github repository using
|
|
the following command:
|
|
<pre><code class="language-bash">[ ~]$ git remote add origin https://github.com/'your_name'/my_awesome_js_project.git</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
This saves your remote Github repository in the .git directory's config file
|
|
allowing you to quickly send your changes to Github. Let's send it off to Github now:
|
|
<pre><code class="language-bash">[ ~]$ git push -u origin main</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
You'll be asked to enter your login credentials. Github no longer uses passwords
|
|
and instead requires use of either a Personal Access Token(PAT) or an SSH key to make
|
|
changes to your repository. The set up for these are well documented, but can be
|
|
somewhat intimidating for a new user. While I recommend setting up an
|
|
<a class="article-outside-links" target="_blank" rel="noopener noreferrer"
|
|
href="https://docs.github.com/en/authentication/connecting-to-github-with-ssh/adding-a-new-ssh-key-to-your-github-account">
|
|
SSH key</a>, you can also set up a <a
|
|
class="article-outside-links" target="_blank" rel="noopener
|
|
noreferrer" href="https://docs.github.com/en/authentication/keeping-your-account-and-data-secure/creating-a-personal-access-token">
|
|
PAT</a> for this purpose as well.
|
|
</p>
|
|
<p class="article-content">
|
|
Once you've entered your credentials, a short message letting you know of your
|
|
successful push to your repository will display in your terminal emulator.
|
|
Refresh the repository page on Github and you'll see that your project is now up
|
|
and running.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_github_02-f2136b66.webp</url>
|
|
<title>Initial Repository Instantiation Page</title>
|
|
</image>
|
|
<p class="article-content">
|
|
Excellent, you have successfully instantiated your first Github repository. Now,
|
|
on the surface, this can appear just like a glorified backup system, and while
|
|
Git can be used for backups, the main feature of using Git
|
|
is for version control. Let's add some code to our "hello.js" file to demonstrate.
|
|
Open up the "hello.js" file in your favorite text editor and add the following line after
|
|
our initial console.log call:
|
|
<pre><code class="language-javascript">
|
|
console.log("hello");
|
|
console.log("this is my second line of code to commit");
|
|
</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Any good piece of version control software will immediately recognize this
|
|
change to your code. You can confirm this by running a
|
|
status check via Git:
|
|
<pre><code class="language-bash">[ ~]$ git status</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Upon entering this command, Git will now provide you with a brief summary of the
|
|
changes to your project. In this case we have "modified hello.js". We have yet
|
|
to have added our changed files, committed our changes with a brief message
|
|
about what we did, and pushed our changes up to our repository, so let's do all
|
|
of that now:
|
|
<pre><code class="language-bash">[ ~]$ git add hello.js</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Note that we are only adding the files we've changed. We never touched the
|
|
README.md and thusly do not have to add that to our commit. Next let's write a
|
|
helpful commit message:
|
|
<pre><code class="language-bash">[ ~]$ git commit -m "Added a second line as an example"</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Here, I'd like to provide a brief word on best practices regarding commit
|
|
messages. A good commit message should be a short, concise pieces of documentation
|
|
that informs others working on the project (or just your future self) of what changes
|
|
were made. These messages should be descriptive enough to cover a specific change
|
|
that was made, without being overly verbose (less than 50 characters is a good
|
|
rule of thumb when writing commit messages).
|
|
</p>
|
|
<p class="article-content">
|
|
Finally, let's push our changes up to Github:
|
|
<pre><code class="language-bash">[ ~]$ git push</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Note that you no longer have to provide the remote name, nor the branch
|
|
name here. Github will once again prompt you for your credentials (either SSH
|
|
key or PAT). Once entered, you will get a confirmation message in your terminal
|
|
emulator, and can visit your Github repository to see the changes online:
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/ss_github_03-9689d6e0.webp</url>
|
|
<title>Github repository now shows updated changes</title>
|
|
</image>
|
|
As you can see, our update is reflected next to our hello.js file on our
|
|
repository page. At this point, you will have a very basic understanding about
|
|
how to use Git. Now I'll cover some other useful aspects.
|
|
</p>
|
|
<h4 class="article-header4">Git Log And Reverting Back</h4>
|
|
<p class="article-content">
|
|
You can see changes pushed to your Git repository locally by
|
|
invoking Git's builtin log:
|
|
<pre><code class="language-bash">[ ~]$ git log</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Invoking git log will show you the history of the project for every commit you make.
|
|
This output is useful should you wish to revert back to one of your previous
|
|
commits, or simply wish to review the history of a project.
|
|
Since you only currently have two commits, let's cover how to simply revert back
|
|
by one commit using the information presented here at git log.
|
|
</p>
|
|
<p class="article-content">
|
|
Next to each commit you'll see a long series of letters and numbers. This is a
|
|
unique identifier for that particular commit. Copy this unique identifier for
|
|
your initial commit using your mouse to highlight the identifier, and invoking
|
|
"CTRL + SHIFT + C". This will save the identifier to your clipboard.
|
|
</p>
|
|
<p class="article-content">
|
|
Now enter into the command line:
|
|
<pre><code class="language-bash">[ ~]$ git reset --hard 'unique-identifier-goes-here'</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Keep in mind that this will only change your local repository, and nothing will
|
|
have changed on your remote over at Github. If you wish to revert the remote
|
|
repository as well, you can do so by using git push with the -f or --force
|
|
option:
|
|
<pre><code class="language-bash">[ ~]$ git push --force</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Keep in mind that using --force is considered to be somewhat overbearing, and
|
|
you should always heavily consider the ramifications of using this option on a
|
|
collaborative project, as you can accidentally overwrite another contributor's code.
|
|
This is why when working on non-trivial projects it is always a good idea to
|
|
<a class="article-outside-links"
|
|
target="_blank" rel="noopener noreferrer"
|
|
href="https://git-scm.com/book/en/v2/Git-Branching-Basic-Branching-and-Merging">
|
|
create a different branch</a>.
|
|
</p>
|
|
<h4 class="article-header4">Conclusion</h4>
|
|
<p class="article-content">
|
|
Whatever your preferences regarding text editors, desktop environments, or
|
|
operating systems, using Git as a version control system is an essential skill
|
|
for the modern day software developer. Even though there are other version
|
|
control systems out there, Git has become ubiquitous with
|
|
version control. It is essential that if you are just starting out with
|
|
software development that you become familiar with Git and its many features, as
|
|
they will inevitably become a part of your daily workflow.
|
|
</p>
|
|
<p class="article-content">
|
|
As an aside, there are far more features of Git than what is covered here in
|
|
this article, so please see the
|
|
<a class="article-outside-links" target="_blank"
|
|
rel="noopener noreferrer" href="https://git-scm.com/doc"> official documentation</a>
|
|
for more information. Additionally, there are many pieces of software that make
|
|
working with Git less cumbersome than what is available at the standard command
|
|
line. Some of these projects include
|
|
<a class="article-outside-links" target="_blank" rel="noopener noreferrer"
|
|
href="https://github.com/jesseduffield/lazygit">
|
|
lazygit</a>, <a class="article-outside-links" target="_blank" rel="noopener noreferrer"
|
|
href="https://github.com/cli/cli">Github's offical CLI tool</a>, and for those of you
|
|
who use Vim, there is
|
|
<a class="article-outside-links" target="_blank" rel="noopener noreferrer"
|
|
href="https://github.com/tpope/vim-fugitive"> Vim-Fugitive</a>.
|
|
</p>
|
|
<p class="article-content">
|
|
I would be remiss not to mention my own CLI tool that I wrote in bash, called
|
|
<a class="article-outside-links" target="_blank" rel="noopener noreferrer"
|
|
href="https://github.com/tomit4/bgit">bgit</a>. While not nearly as fully featured as the
|
|
aforementioned software, it is a very basic wrapper around Git that automates
|
|
away some of the commands covered in this article. I wrote this script as
|
|
a way to teach myself a little more about Git and bash, and it is certainly not
|
|
without its flaws, but take a look if you're interested.
|
|
</p>
|
|
<p class="article-content">
|
|
Lastly, I'll encourage you to first become familiar with the
|
|
basics of Git before going to one of these other pieces of software, as understanding
|
|
how Git works from the ground up is essential before moving on to
|
|
utilizing these other tools. I wish you well in your journey towards better
|
|
software development and I hope I have helped you understand a little bit
|
|
more about this essential piece of software.
|
|
</p>
|
|
</description>
|
|
</item>
|
|
<item>
|
|
<pubDate>Fri, 13 Jan 2023 12:30:00 +0200</pubDate>
|
|
<title>The README</title>
|
|
<link>https://leafbytes.com/the-readme</link>
|
|
<guid isPermaLink="false">gystmpokwxqglbnuzzhbhlwcvxwobayyntfvcwhv</guid>
|
|
<description>
|
|
<h1>the readme</h1>
|
|
<h3>documentation for beginners</h3>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/markdown_logo-53c5ed00.webp</url>
|
|
<title>An image of the markdown logo</title>
|
|
</image>
|
|
<blockquote class="article-quotes" cite="https://upload.wikimedia.org/wikipedia/commons/4/48/Markdown-mark.svg">
|
|
"Documentation is a love letter that you write to your
|
|
future self."
|
|
<br> -<a class="blockquote-links" target="_blank"
|
|
rel="noopener noreferrer"
|
|
href="https://en.wikipedia.org/wiki/Damian_Conway"><em>Damian
|
|
Conway</em></a>
|
|
</blockquote>
|
|
<h4 class="article-header4">Introduction</h4>
|
|
<p class="article-content">
|
|
Documentation in the world of software is an essential part of the development
|
|
process. Without proper documentation both users and developers are given the
|
|
monumental task of parsing out a project line by line in order to understand how
|
|
to debug the project, contribute to the project, or indeed, even utilize the
|
|
software itself.
|
|
</p>
|
|
<p class="article-content">
|
|
There are many forms of documenting projects, be they man pages accessible via
|
|
the terminal to official documentation provided by the developer hosted on their
|
|
website. One essential type of documentation that a new software developer
|
|
must become familiar with is the README.md file. If you have ever
|
|
perused a properly maintained repository on Github or other hosting
|
|
service websites, you have most certainly come across a README.md. The finished
|
|
document looks something like this:
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/readme-pic-01-cf144d08.webp</url>
|
|
<title>A sample page of a readme</title>
|
|
</image>
|
|
<h4 class="article-header4">The Basic Readme</h4>
|
|
<p class="article-content">
|
|
The README is a document that one can think of as being the entry point to learning
|
|
about and using a piece of software. Oftentimes this document provides
|
|
instructions on installation, basic usage, and configuration. Sometimes multiple
|
|
READMEs are provided on more extensive projects to help developers extend,
|
|
debug, and manage a piece of software.
|
|
</p>
|
|
<p class="article-content">
|
|
Not including a README, even when working on a trivial or basic project, is
|
|
considered poor etiquette, as having no README leaves any potential user or
|
|
developer with absolutely no information about what lies within the project, and
|
|
indicates that the project maintainer doesn't care about the project, or at
|
|
least, doesn't care to provide documentation. Very simply, it is always a good
|
|
idea to provide at least a basic README when creating a project.
|
|
</p>
|
|
<p class="article-content">
|
|
Although a README can be written in plain text or even HTML, the markdown
|
|
language has become the standard for writing READMEs, as it provides a quick way
|
|
to create formatted text that is well presented to the reader. READMEs are
|
|
traditionally capitalized so that the 'ls' command prioritizes its display, and
|
|
the .md appended to the end of the README indicative that the document is
|
|
written in markdown.
|
|
</p>
|
|
<h4 class="article-header4">The Markdown Language</h4>
|
|
<p class="article-content">
|
|
Anyone familiar with The HyperText Markup Language, commonly known as HTML, will
|
|
find themselves comfortable working in Markdown, as many pieces of Markdown are
|
|
interchangeable with classic HTML elements, just expressed differently.
|
|
</p>
|
|
<p class="article-content">
|
|
In certain circumstances, the Markdown language is even more powerful than HTML,
|
|
as it can very quickly represent tables, graphs, checkboxes, and other common
|
|
presentation elements in a way that is easier to read and requires fewer typed
|
|
characters to express them.
|
|
</p>
|
|
<p class="article-content">
|
|
For the remainder of this blog post, I will cover how to create a standard README
|
|
for a software project. While Markdown has many extensive features such as
|
|
presentation graphs and tables, I will solely be covering the basics for the
|
|
sake of brevity and this is only meant as an introduction. Should you desire to
|
|
explore what other features the Markdown language has to offer, I advise you to
|
|
take a look at the <a class="article-outside-links" target="_blank" rel="noopener
|
|
noreferrer" href="https://www.markdownguide.org/">official guide</a>.
|
|
</p>
|
|
<h4 class="article-header4">Getting Started</h4>
|
|
<p class="article-content">
|
|
At the end of the day, Markdown is simply an extension upon a plain text
|
|
document, so one can get started working in it right away. Navigate to the base
|
|
of a project you'd like to write a README for (or just create a test directory),
|
|
and let's create one from the command line using the touch command:
|
|
<pre><code class="language-bash">[ ~]$ touch README.md</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Next we'll open up our newly created README.md file in our favorite text editor
|
|
and start documenting our project. I'll be using NeoVim for my examples, and
|
|
will also be using an extension called
|
|
<a class="article-outside-links" target="_blank" rel="noopener noreferrer"
|
|
href="https://github.com/iamcco/markdown-preview.nvim">markdown-preview</a>. If
|
|
you are reading this blog post and want to follow along in
|
|
VS Code, there is equivalent functionality available for that editor as well
|
|
in the form of different extensions.
|
|
</p>
|
|
<p class="article-content">
|
|
Let's write out a header, with the title of our project. I'm going to call my
|
|
project, "markdown_ex".
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/readme-pic-02-be84a5af.webp</url>
|
|
<title>a h1 header displayed in both neovim and the browser</title>
|
|
</image>
|
|
As you can see, a single hashtag "#" character is interpreted by Markdown as
|
|
indicating the beginning of a header. This is equivalent to an <h1> tag in HTML.
|
|
Let's create some other headers as an example.
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/readme-pic-03-f2ec3447.webp</url>
|
|
<title>a series of headers expressed in markdown</title>
|
|
</image>
|
|
Now, what's nice about Markdown is at this point you can simply start typing out
|
|
your documentation. Unlike in HTML, there is no need to encapsulate everything
|
|
in paragraph tags, so working in Markdown becomes more akin to working in an
|
|
extremely basic word processor. You can revert to using HTML elements if you'd
|
|
like, but especially in this mentioned example, it is not necessary:
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/readme-pic-04-4ccd74c8.webp</url>
|
|
<title>basic display of paragraph text in markdown</title>
|
|
</image>
|
|
<p class="article-content">
|
|
Let's now explore some of the basic features that Markdown has to offer. Let's
|
|
say we wish to stylize our text a little beyond just making headers. Well, we
|
|
have many options at our disposal. Let's create some bold, italic, underline,
|
|
and strike-through pieces of text:
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/readme-pic-05-0f464300.webp</url>
|
|
<title>various stylizing of markdown text</title>
|
|
</image>
|
|
<p class="article-content">
|
|
Here we see the various syntax utilized for styling pieces of text in markdown.
|
|
I'll cover briefly the basic syntax here:
|
|
<pre><code class="language-markdown">**two stars creates bold text**
|
|
__two underscores also creates bold text__</code></pre>
|
|
<pre><code class="language-markdown">*single star creates italicized text*
|
|
_single underscore also creates italicized text_</code></pre>
|
|
<pre><code class="language-markdown">~~two tildes creates strike-through text~~</code></pre>
|
|
<pre><code class="language-markdown"><<u>>html style u tags create underline text<</u>></code></pre>
|
|
</p>
|
|
<h4 class="article-header4">Creating Lists</h4>
|
|
<p class="article-content">
|
|
As I mentioned earlier, the syntax of Markdown can be far nicer than HTML in
|
|
many respects. A good example of this is creating ordered and unordered lists. In
|
|
HTML, creating an unordered list looks like this:
|
|
<pre><code class="language-cshtml"><ul>
|
|
<li>My first item</li>
|
|
<li>My second item</li>
|
|
<li>My third item</li>
|
|
</ul></code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
As opposed to in Markdown:
|
|
<pre><code class="language-markdown">- My first item
|
|
- My second item
|
|
- My third item</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
The following picture demonstrates the simple creation of ordered and unordered
|
|
lists in markdown:
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/readme-pic-06-b264e549.webp</url>
|
|
<title>a demonstration of creating lists in markdown</title>
|
|
</image>
|
|
<p class="article-content">
|
|
Markdown is especially easy on the eyes when it comes to creating links. In
|
|
HTML, creating a basic link can be created like so:
|
|
</p>
|
|
<pre><code class="language-cshtml"><<a href="https://www.example.com">my example link<</a></code></pre>
|
|
<p class="article-content">
|
|
The same can be accomplished in Markdown like so:
|
|
<pre><code class="language-markdown">[my example link](https://www.example.com)</code></pre>
|
|
</p>
|
|
|
|
<h4 class="article-header4">Code Snippets</h4>
|
|
<p class="article-content">
|
|
The Markdown language is multifaceted, it can be utilized to document anything
|
|
from scientific papers to simple blog posts and is often utilized in online
|
|
forums. One of the most common usage for Markdown is code snippets, which can be
|
|
expressed using backticks like so:
|
|
<pre><code class="language-markdown">```console.log('nice code block!')```</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
Or Like so:
|
|
<pre><code class="language-markdown">`console.log('nice code block!')`</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
If, for example, you needed to present some basic JSON, you could do so very
|
|
simply like so:
|
|
<pre><code class="language-markdown">``
|
|
{
|
|
"firstName: "John",
|
|
"lastName": "Smith",
|
|
"age": 25
|
|
}
|
|
``</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
The following picture demonstrates the effect:
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/readme-pic-07-e7acff6e.webp</url>
|
|
<title>demonstration of writing code blocks in markdown</title>
|
|
</image>
|
|
<h4 class="article-header4">Checkboxes</h4>
|
|
<p class="article-content">
|
|
One of my personal favorite uses of Markdown is to place a list of checkboxes
|
|
towards the bottom of my READMEs. This usually is a list of various aspects of
|
|
my software that need to be worked on, such as new features, bug fixes, and
|
|
documentation.
|
|
</p>
|
|
<p class="article-content">
|
|
Checkboxes can be instantiated like so, one is checked off, the other is not:
|
|
<pre><code class="language-markdown">- [x] This is a completed task
|
|
- [ ] This task has yet to be done</code></pre>
|
|
</p>
|
|
<p class="article-content">
|
|
And here is an example Picture showing the results:
|
|
</p>
|
|
<image>
|
|
<url>https://leafbytes.com/assets/readme-pic-08-52d67547.webp</url>
|
|
<title>demonstration of how to write checkboxes in markdown</title>
|
|
</image>
|
|
<h4 class="article-header4">Conclusion</h4>
|
|
<p class="article-content">
|
|
The capabilities of Markdown are vast. In addition to what has been covered here,
|
|
one can create tables, graphs, and embed images/GIFs into Markdown files to
|
|
further help document your projects.
|
|
</p>
|
|
<p class="article-content">
|
|
A good README can often be the saving grace of a project. Even if a project is
|
|
poorly designed or not well maintained, a good README can provide a general overview
|
|
of a piece of software and help others navigate its use, configuration, and
|
|
further development. Without a README, the potential user or developer is left
|
|
solely with the code itself to determine everything about the project. Indeed, a
|
|
project without a README is probably not worth investigating, unless the
|
|
codebase is particularly small and even then, some form of introductory
|
|
documentation would be highly encouraged.
|
|
</p>
|
|
<p class="article-content">
|
|
As a beginning software developer, the README is one of your most important
|
|
resources when learning about a new tool, or even referring back to one of your old
|
|
projects. It is within your best interest to develop a good habit of writing
|
|
READMEs and other forms documentation for your projects, so take the time to
|
|
familiarize yourself with one of the most common forms of it, Markdown.
|
|
</p>
|
|
<p class="article-content">
|
|
I do hope this has been helpful to you and provides you with a basic
|
|
understanding of the Markdown language and how to utilize it for a basic README.
|
|
Cheers and Happy Coding!
|
|
</p>
|
|
</description>
|
|
</item>
|
|
</channel>
|
|
</rss>
|