cabin

Source code for personal website
git clone git://git.dimitrijedobrota.com/cabin.git
Log | Files | Refs

commit 6afda30cfc5757c5a32851d4f079bed9dc1cf08a
parent 1b48349c3763bc1177b5fa65138d1247e4e5a5a3
Author: Dimitrije Dobrota <mail@dimitrijedobrota.com>
Date:   Wed, 26 Jun 2024 22:15:52 +0200

Cabin reinvention

* From now on this repo will contain all articles in .md format
* cabin-deploy.sh and stamd will be used to generate .html file
* Hope to start writing more...

Diffstat:
M.gitignore | 4+++-
Ablog/HelloWorld.md | 53+++++++++++++++++++++++++++++++++++++++++++++++++++++
Ablog/LFS.md | 34++++++++++++++++++++++++++++++++++
Ablog/Stamd.md | 142+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Ablog/TEST.md | 239+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Ablog/VimPugins.md | 146+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Ablog/VimShowcase1.md | 167+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Ablog/VimShowcase2.md | 107+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Acabin-deploy.sh | 19+++++++++++++++++++
Mcss/colors.css | 6+++---
Mcss/index.css | 106+++++++++++++++++++++++++++++++++++++++++++++++++++----------------------------
Dindex.html | 40----------------------------------------
Aindex.md | 38++++++++++++++++++++++++++++++++++++++
Msitemap.xml | 2+-
14 files changed, 1021 insertions(+), 82 deletions(-)

diff --git a/.gitignore b/.gitignore @@ -1 +1,3 @@ -blog/* +*/*.html +*/*.xml +*/*.txt diff --git a/blog/HelloWorld.md b/blog/HelloWorld.md @@ -0,0 +1,53 @@ +@title: Hello World +@date: 2021-08-17 +@language: en +@categories: general + + +# Hello world! + +Hello everyone this is a short introduction to my site and blog where I'll be +talking about Tech, programming, GNU/Linux and possibly other things as well. + + +## About + +I am Dimitrije Dobrota, 19-year old freshman of Electrical and Computer +Engineering, who is obsessed with programming and tech in general. + +I've been fascinated by Linux for a long time and have been using it on and off +for a number of year. It's been more than year and a half since I've fully +committed and have been using it as the only OS. + +This blog will be powered by +[stamd](https://git.dimitrijedobrota.com/stamd/log.html), a static markdown +page generator written in C, that I am currently developing. + +My other projects can be found in my [repos](https://git.dimitrijedobrota.com/) +or on [Github](https://github.com/DimitrijeDobrota). + + +## Software I use + +While I've experimented with a lot of different things, I've landed on the +current setup by trying to find flexible and extensible but sane daily driver setup: + +- OS: GNU/Linux +- Distro: Artix +- WM: bspwm +- Term: urxvt +- Text editor: vim +- PDF viewer: zathura + + +## Motivation + +This initiative was inspired by [Luke Smith](https://lukesmith.xyz), as he +prompted me to reconsider the effects of being too dependent on social media, as +well as showed me the benefits of owning your platform in modern day where +people are susceptible to censorship. + +This is a way of future-proofing myself from any possible problems that might arise down the +road. + +> It's better to be safe than sorry... diff --git a/blog/LFS.md b/blog/LFS.md @@ -0,0 +1,34 @@ +@title: Linux From Scratch - non-POSIX compliant bloat +@date: 2021-09-29 +@language: en +@hidden + +# Linux From Scratch - non-POSIX compliant bloat + +Taken from [LFS](https://www.linuxfromscratch.org/) site: +> Linux From Scratch (LFS) is a project that provides you with step-by-step +instructions for building your own custom Linux system, entirely from source +code. + +This description really summarizes it nicely and it is exactly what you are +getting. To understand the reasoning behind this clickbait title, it's +important for me to clarify my expectations of this project as well as the project itself. + +## Linux From Scratch + +Linux From Scratch is a project that provides you with a book that contains a +step-by-step instructions on how to build your own Linux system. It is supposed to: + +- Teach people how a Linux system works internally +- Produce a very compact Linux system +- Be extremely flexible +- Offer you added security + +LFS deliverers on all promises hands down. + +It's not exactly a book for beginners as some important topics like disk +partitioning are not explained in depth, and as decent proficiency in terminal +is assumed for a smooth ride. + +If proper amount of care is not taken there are quite a few headache that may arise down +the road, but if proper backups were made, (almost) every issue can be resolved. diff --git a/blog/Stamd.md b/blog/Stamd.md @@ -0,0 +1,142 @@ +@title: Introducing stamd +@date: 2021-08-18 +@language: en +@categories: linux, c, personal projects, + +# Introducing stamd + +Stamd or static markdown is, as the name suggests, a static markdown page +generator, written in C, that I'm developing for use in this blog. + +As I write more articles the program will get streamlined and I you will be +informed of any big changes down the road. + + +## About + +Motivated by [stagit](https://git.codemadness.org/stagit/), I've decided to take on this challenge +primarily because document parsing always fascinated me as well as to have a +complete control over to looks of articles the program produces. + +I chose markdown as it's really simple and similar to HTML. I'm using it to +take personal notes in vim using vimwiki, which I am going to explain +in another article, so apart from already being familiar with it, I have some +snippets of content prepared and ready to share. + + +## Challenges + +### List Items + +The biggest challenge was parsing nested list items.<br> + +- A standard list item is detonated with: + + `-` + + `*` + + `+` +- There is unlimited number of nesting that can take place + - Nesting No. 1 + - Nesting No. 2 + - Nesting No. 3 + - Nesting No. 4 + - After every nesting it is possible to return to any previous one + 1. Ordered lists can be present on the same level + 2. Like + 3. this + 1. Or they can be nested + 2. With other ordered, + - Or Unordered variants + * While using the different detonator on the same level + + Must lead to new list being created + +After a lot of thinking I've figured that in order to keep track of the nesting +level at any time, be able to return to the previous and create a new one, as +well as terminate all of the nesting at once on encountering a blank line, my +best bet is to use a stack to keep track of `<ol>`, `<ul>` and `<li>`, as well +as recursive function that calls itself for every new nesting level. + +With this approach all of the heavy lifting is done by the recursion, which is +deepened by a bigger indent and returned by encountering a smaller one. + +With a usage of global variables I am able to save the last recursion state +post return, and allow the lower level to continue like nothing has happened at +all. + +Similar approach is taken to deal with nested `blockquotes` but with a different nesting detection and without a need to worry about the detonator + + +### Inline blocks + +There are quite a few options when it comes to text and inline block: + +- ~~Strikethrough~~, detonated by `~~text~~` +- **This is bold text**, detonated by `**text**` +- *This is italic text*, detonated by `*text*` +- __This is bold text__, detonated by `__text__` +- _This is italic text_, detonated by `_text_` +- [This is a link](https://dimitrijedobrota.com/), detonated by `[Text](Link)` + +This is, again, solved by a simple recursion that takes the pointer to the start and the end of the text, and parses that section. + +If the detonator is reached, it checks if its closed properly, in which case +recursive call is made to parse only the text between the opening and closing +tags, after which the parsing resumes normally from after the closing tags. + + + +## Usage + +The source code can be obtained using with: + + $ git clone git://git.dimitrijedobrota.com/stamd.git + +After that we need to use `make` to install it: + +``` +$ cd ./stamd +$ make +$ sudo make install +``` + +This will install `stamd` and `stamd-index` to be used anywhere in the system.<br> +If we run the commands now we will get a hint about their usage: + +``` +$ stamd + stamd [-o outdir] articledir + +$ stamd-index + stamd-index articledir articledir ... +``` + +`stamd` requires that the article directory is provided. It looks for +`article.md` and `config.txt` inside the article directory in order to create +the output HTML file. + +Providing output directory is optional with `-o outdir` +and it instructs `stamd` to place the HTML file in specified directory. If the +directory is not provided output will be placed in article directory. + +*** + +`stamd-index` takes in arbitrary number of article directories and writes, to +the standard output, the list of all the articles provided to be used as index +HTML file. + +*** + +You will also receive `create_articles.sh` script which I use to bulk create all of the articles and sort them by date. + +If you want to use it for yourself, you will need to edit `blogdir` and `sitedir` to match your setup, and after that you can simple run: + + $ ./create_articles.sh + +*** + +Config file, as of now accepts Title, Date and Language option. Every option should start in a new line and general format is: + + Option: value + +I am looking for a way to get rid of the config file in the future, so that all +of the necessary data can be extracted from the markdown file itself + diff --git a/blog/TEST.md b/blog/TEST.md @@ -0,0 +1,239 @@ +@title: Test +@date: 2021-08-17 +@language: en +@categories: general + +# h1 Heading 8-) +## h2 Heading +### h3 Heading +#### h4 Heading +##### h5 Heading +###### h6 Heading + + +## Horizontal Rules + +___ + +--- + +*** + + +## Typographic replacements + +Enable typographer option to see result. + +(c) (C) (r) (R) (tm) (TM) (p) (P) +- + +test.. test... test..... test?..... test!.... + +!!!!!! ???? ,, -- --- + +"Smartypants, double quotes" and 'single quotes' + + +## Emphasis + +**This is bold text** + +__This is bold text__ + +*This is italic text* + +_This is italic text_ + +~~Strikethrough~~ + + +## Blockquotes + + +> Blockquotes can also be nested... +>> ...by using additional greater-than signs right next to each other... +> > > ...or with spaces between arrows. + + +## Lists + +Unordered + ++ Create a list by starting a line with `+`, `-`, or `*` ++ Sub-lists are made by indenting 2 spaces: + - Marker character change forces new list start: + * Ac tristique libero volutpat at + + Facilisis in pretium nisl aliquet + - Nulla volutpat aliquam velit ++ Very easy! + +Ordered + +1. Lorem ipsum dolor sit amet +2. Consectetur adipiscing elit +3. Integer molestie lorem at massa + + +1. You can use sequential numbers... +1. ...or keep all the numbers as `1.` + +Start numbering with offset: + +57. foo +1. bar + + +## Code + +Inline `code` + +Indented code + + // Some comments + line 1 of code + line 2 of code + line 3 of code + + +Block code "fences" + +``` +Sample text here... +``` + +Syntax highlighting + +``` js +var foo = function (bar) { + return bar++; +}; + +console.log(foo(5)); +``` + +## Tables + +| Option | Description | +| ------ | ----------- | +| data | path to data files to supply the data that will be passed into templates. | +| engine | engine to be used for processing templates. Handlebars is the default. | +| ext | extension to be used for dest files. | + +Right aligned columns + +| Option | Description | +| ------:| -----------:| +| data | path to data files to supply the data that will be passed into templates. | +| engine | engine to be used for processing templates. Handlebars is the default. | +| ext | extension to be used for dest files. | + + +## Links + +[link text](http://dev.nodeca.com) + +[link with title](http://nodeca.github.io/pica/demo/ "title text!") + +Autoconverted link https://github.com/nodeca/pica (enable linkify to see) + + +## Images + +![Minion](https://octodex.github.com/images/minion.png) +![Stormtroopocat](https://octodex.github.com/images/stormtroopocat.jpg "The Stormtroopocat") + +Like links, Images also have a footnote style syntax + +![Alt text][id] + +With a reference later in the document defining the URL location: + +[id]: https://octodex.github.com/images/dojocat.jpg "The Dojocat" + + +## Plugins + +The killer feature of `markdown-it` is very effective support of +[syntax plugins](https://www.npmjs.org/browse/keyword/markdown-it-plugin). + + +### [Emojies](https://github.com/markdown-it/markdown-it-emoji) + +> Classic markup: :wink: :crush: :cry: :tear: :laughing: :yum: +> +> Shortcuts (emoticons): :-) :-( 8-) ;) + +see [how to change output](https://github.com/markdown-it/markdown-it-emoji#change-output) with twemoji. + + +### [Subscript](https://github.com/markdown-it/markdown-it-sub) / [Superscript](https://github.com/markdown-it/markdown-it-sup) + +- 19^th^ +- H~2~O + + +### [\<ins>](https://github.com/markdown-it/markdown-it-ins) + +++Inserted text++ + + +### [\<mark>](https://github.com/markdown-it/markdown-it-mark) + +==Marked text== + + +### [Footnotes](https://github.com/markdown-it/markdown-it-footnote) + +Footnote 1 link[^first]. + +Footnote 2 link[^second]. + +Inline footnote^[Text of inline footnote] definition. + +Duplicated footnote reference[^second]. + +[^first]: Footnote **can have markup** + + and multiple paragraphs. + +[^second]: Footnote text. + + +### [Definition lists](https://github.com/markdown-it/markdown-it-deflist) + +Term 1 + +: Definition 1 +with lazy continuation. + +Term 2 with *inline markup* + +: Definition 2 + + { some code, part of Definition 2 } + + Third paragraph of definition 2. + +_Compact style:_ + +Term 1 + ~ Definition 1 + +Term 2 + ~ Definition 2a + ~ Definition 2b + + +### [Abbreviations](https://github.com/markdown-it/markdown-it-abbr) + +This is HTML abbreviation example. + +It converts "HTML", but keep intact partial entries like "xxxHTMLyyy" and so on. + +*[HTML]: Hyper Text Markup Language + +### [Custom containers](https://github.com/markdown-it/markdown-it-container) + +::: warning +*here be dragons* +::: + diff --git a/blog/VimPugins.md b/blog/VimPugins.md @@ -0,0 +1,146 @@ +@title: Vim Plugins - Installation guide +@language: en +@date: 2021-08-19 +@categories: linux, vim + +# Vim Plugins - Installation guide + +In preparation for 'Vim Showcase' series, were I'll be showcasing plugins and other vim tricks, I've decided to dedicate this short +article to the process of setting up vim for installing plugins, as a reference to those of you who haven't done it already. + +Vim is a great tool with a lot of amazing features that come out of the box. +Sometimes, though, a little push is needed to take the experience to a whole new level. + +This article expects the readers to be familiar with running basic commands in +the terminal as well as basic vim knowledge including running vim commands. + + +## Introduction + +- _What are vim plugins_?<br> + Vim plugins are, in essence, scripts that are used to add new features to the + editor or extend the already existing ones +- _What are plugins used for_?<br> + Plugins are used to bring anything from color schemes to providing full fledged IDE-like features to vim editor. +- _How are vim plugins written?_<br> + Vim plugins are written using Vim Script +- _What is Vim Script_?<br> + Vim Script is a language used by vim for startup files, syntax files, plugins and any other configuration of the editor<br> + For more info you can reference [vim help](https://vim.help/41-write-a-vim-script) +- _How to get vim plugins_?<br> + Staring from Vim 8 plugins are supported and should be placed in `~/.vim/pack/vendor/`.<br> + There is also a possibility of using a plugin manager to streamline the process of installing, using, updating and removing plugins + + +In this article I am going to explain how to use [Vundle](https://github.com/VundleVim/Vundle.vim), short for vim bundle, as the plugin manager + +As taken from their help page: + +Vundle allows you to... + + - keep track of and configure your scripts right in the `.vimrc` + - install configured scripts (a.k.a. bundle) + - update configured scripts + - search by name all available Vim scripts + - clean unused scripts up + - run the above actions in a single keypress with interactive mode + +Vundle automatically... + + - manages the runtime path of your installed scripts + - regenerates help tags after installing and updating + + +## Installing Vundle + +In order to install Vundle `git` must be present on the system, which you can check by running: + + git + bash: git: command not found + +If you get `command not found` you will need to install it using your distribution package manager. + +*** + +With that out of the way, we are ready to install Vundle. All you have to do is run: + + git clone https://github.com/VundleVim/Vundle.vim.git ~/.vim/bundle/Vundle.vim + + +After the Vundle has installed, there is a little configuration that needs to +be done, in order for vim to recognize Vundle and start loading the plugins + +## Configuring Vundle + +Open your `vimrc` file, which will most likely be `~/.vimrc`, and paste the following boilerplate code at the beginning: + +``` +set nocompatible " be iMproved, required +filetype off " required + +set rtp+=~/.vim/bundle/Vundle.vim +call vundle#begin() + +Plugin 'VundleVim/Vundle.vim' " leave as first item + +" All of your Plugins must be added here + +call vundle#end() " required +filetype plugin indent on " required" +``` + +This code ensures that Vundle is started with vim, and to keep track of the installed plugins. + +**Note**: As the comment in the boilerplate suggests, all of the Plugins must be added +after `call vundle#begin()` and before `call vundle#end()` in order for them to +be recognized by Vundle, and not cause error when starting vim. + + +With this out of the way, we are ready to install some plugins + + +## Installing Plugins + + +To install a plugin from github, do the following: + +1. Find the plugin you want to install and note the URL.<br> Example: `https://github.com/kana/vim-textobj-user` +2. Take the `author/name` portion of the URL.<br> In this case: `kana/vim-textobj-user` +3. Put `Plugin 'author/name'` in the designated area in `vimrc` file.<br> Example: `Plugin 'kana/vim-textobj-user'` + +**Note**: To see all of the URLs supported, reference `:h vundle-plugins-uris` + +After, we have put in the list of plugins we want, vim needs to be +reloaded.<br> We can do it by simply exiting and entering vim again or by running +`:source %` directly in vim. + +Finally to instruct Vundle to download the necessary plugins run +`:PluginInstall`.<br> You will see a new window pop up on the side, with the +list of all the plugins, and each line will be highlighted one by one as the +plugin is being installed. + +**Note**: This window can be closed like any other, using `:q` or `Ctrl + zz`. + +After vim is restarted the plugin will be loaded and ready to use. + +For any plugin specific configuration reference the specific usage guide. + + +## Vundle Commands + +For reference purposes, I will list all of the commands that are available after configuring Vundle. + +- `:PluginInstall`: Will install all plugins configured in your `.vimrc`. Newly installed plugins will be automatically enabled. +- `:PluginUpdatate`: Install or update the configured plugins. +- `:PluginSearch`: Search [Vim Scripts](http://vim-scripts.org/vim/scripts.html) for matching plugins. +- `:PluginClean`: Requests confirmation for the removal of all plugins no longer configured - in your `.vimrc` but present in your bundle installation directory. +- `:PluginList`: Displays a list of installed bundles. + +**Note**: For more information about any of these commands, reference `:h command` + + +## Conclusion + +With this one time setup out of the way, you are ready to explore the wonderful world of vim plugins. + +Stay tuned for 'Vim Showcase' series to learn more about vim, and to discover some great vim plugins to boost your productivity. diff --git a/blog/VimShowcase1.md b/blog/VimShowcase1.md @@ -0,0 +1,167 @@ +@date: 2021-08-20 +@title: Vim Showcase #1 - Text Object +@language: en +@categories: linux, vim + +# Vim Showcase #1 - Text Object + + Welcome to the new series called **"Vim Showcase"** + + In this series, as the title suggests, I am going to showcase vim and all of + its wonderful features as well as plugins> + + Even though I am starting this series off by showcasing plugins, I will try to + cover the vanilla vim as much as possible. + + I restrain myself from using too much plugins as I find vim really usable out + of the box (with some tweaking of course), but sometimes it takes just a + handful of small, lightweight plugins to enhance the vim experience and boost + the writing speed by simplifying repetitive and tedious tasks. + + +## Introduction + + With vim being the editor with a primary focus on editing text, it's fair to + say that it is filled to the brim with features that support that. + + Today I am going to present to you a few plugins that complement existing + features as well as bust your productivity while writing. + + For the rest of the article I will assume that you know how to install vim plugins. + + If you are new to the world of vim plugins make sure to check out my previous + article on how to install plugins with plugin manager. It can be found [HERE](https://dimitrijedobrota.com/articles/VimPugins.html) + + +## Textobj User by kana + +This plugin is the base that all of the other plugins that I am about to showcase today are based on. + +This plugin is, in essence, a framework that allows it's users to easily define +new text objects by helping you avoid common pitfalls as well as hiding all of +the tedious implementation details, allowing you to focus on the task at hand. + +You can install it by putting the following line in your `vimrc`: + + Plugin 'kana/vim-textobj-user' + +Instruction on how to use this plugin can be found on [Github](https://github.com/kana/vim-textobj-user), + +Before do so, it's a good idea to get a feel for what kind of functionality it +is used for by reading ahead or full checking out the full list of other +plugins that depend on this one [here](https://github.com/kana/vim-textobj-user/wiki). + + +# Textobj Brace and Textobj Quotes + +If you want to quickly change all of the parameters of a function, array +initialization or anything else that revolves around quotes or braces, vim has +you covered. + +Text object 'Inside' or `i` is very powerful utility. It works with: + +- Brackets: `(`, `[` and `{` +- Quotes: `'`, `"` and `&grave;` +- Tag: `t` + +It allow you to use any motion and the contents of the brackets or quotes. You can delete, change, yank and more. + +After a while, it gets tedious to always have to specify the exactly what you want to change. That's where these two plugins step in, and go one step further. The plugins provide the following set of binding: + +- Brace: + - `ij`: operate on the content between the closest pair of braces + - `aj`: operate on the content between the closest pair of braces, including the braces +- Quotes: + - `iq`: operate on the content between the closest pair of quotes + - `aq`: operate on the content between the closest pair of quotes, including the quotes + +Where these two plugins shine, apart from being able to target the surrounding itself, is that you don't even need to be inside the area to do the change. + +It's easier to understand by looking at examples (the cursor is shown with `|`): + +1. Before: `foo '1, |2, 3' bar`; after pressing `diq`: `foo '|' bar` +2. Before: `foo| '1, 2, 3' bar`; after pressing `diq`: `foo '|' bar` +3. Before: `foo '1, 2, 3' |bar`; after pressing `daq`: `foo | bar` + +These plugins can be installed with: + + Plugin 'Julian/vim-textobj-brace' + Plugin 'beloglazov/vim-textobj-quotes' + + +# Textobj Variable Segment + +Renaming is an unavoidable part of any project, whether it be a CSS attribute +or a variable name, you often have to deal with `snake case` and `title case` +text, which can be a pain to do in vim. This plugin is here to solve that +problem. + +It provides two bindings `iv` and `av` and their usage is illustrated in the example: + +- Before: `foo_ba|r_baz`; after pressing `civ`: `foo_|_baz` +- Before: `QU|UX_SPAM`; after pressing `civ`: `|_SPAM` +- Before: `eggsAn|dCheese`; after pressing `civ`: `eggs|Cheese` +- Before: `_privat|e_thing`; after pressing `civ`: `_|_thing` + +- Before: `foo_ba|r_baz`; after pressing `dav`: `foo_baz` +- Before: `QU|UX_SPAM`; after pressing `dav`: `SPAM` +- Before: `eggsAn|dCheese`; after pressing `dav`: `eggsCheese` +- Before: `_privat|e_thing`; after pressing `dav`: `_thing` + + +This plugin is installed with: + + Plugin 'Julian/vim-textobj-variable-segment' + + +# Textobj Parameter + +When dealing with functions, changing names and types of the parameters is inevitable. To make that process more easy consider using this plugin. + +Following the logic of the previous ones, this one allows you to change each of the parameter one by one. Look at the example: + +`i,` to inner parameter object + +``` +function(param_a, param_b, param_c) + |<--->| |<--->| |<--->| +``` + +`a,` to a parameter object including whitespaces and comma + +``` +function(param_a, param_b, param_c) + |<----->| +function(param_a, param_b, param_c) + |<----->| +function(param_a, param_b, param_c) + |<----->| +``` + +In addition, 'i2,' is similar to `a,` except trailing whitespace characters (especially for first parameter) + +``` +function(param_a, param_b, param_c) + |<---->| +``` + +This plugin can be installed with: + + Plugin 'sgur/vim-textobj-parameter' + + +## Conclusion + +Plugins showcased today are the great introductory plugins, as their are both +lightweight and provide only a handful of biding to remember while still +packing a good punch. + +As you can see, all of these plugins share the same philosophy. They provide a +simple textobject to be used with any existing motion such as `d`, `c` or `y`. + +After you feel comfortable with using these plugins I encourage you to check +out [this](https://github.com/kana/vim-textobj-user/wiki) link for even more plugins that provide similar functionality + +If you feel particularly brave, you can try writing your own using Textobject +User API detailed +[here](https://github.com/kana/vim-textobj-user/blob/master/doc/textobj-user.txt) diff --git a/blog/VimShowcase2.md b/blog/VimShowcase2.md @@ -0,0 +1,107 @@ +@date: 2021-08-25 +@title: Vim Showcase #2 - Text Motion +@language: en +@categories: linux, vim + + # Vim Showcase #2 - Text Motion + + Welcome to the second installment of the **"Vim Showcase"** series. + + Today, I've prepared some interesting vim default capabilities as well as plugins to + enhance those capabilities to he maximum for even better experience. We will + take a look at sorting, interacting with system clipboard and finally + interacting with vim registers. + + ## Vim sort motion + + Vim allows its user to leverage the power of the shell utilities by typing + `:!util-name`. This allows for a numerous possibilities for text editing as + you can write special shell scripts to be used when needed. + + Sorting in a file is extremely useful when you need to order some collection + of data after it has been gathered by some some script or simply to sorting a + header file includes or function declarations for better readability. + + A easy way to sort some lines of text is to enter line-visual mode + with `Shift+v`, select the lines you want to sort, then typing `:!sort`. + +This plugin builds on top of this setup, by providing a sort motion for easy +access, without a need for visual mode, and more. It can be installed with: + + Plugin 'christoomey/vim-sort-motion' + +The primary interface to this plugin is via the `gs` mapping, which stands for `go sort`, for sorting based +on a text object or motion. For example to sort 10 lines down, type: `gs10j`. + +Where this plugin surpasses the shell variant is that it also provides a +capability of sorting comma separated lists of items. For example by typing +`gsi(` you can sort `(b, c, a)` to become `(a, b, c)`. + +One other neat feature of this plugin is that, because it uses sort shell +function under the hood, it's possible to pass user specified flags for +different sort behavior. For example by adding the following line to `vimrc` sort will +become case insensitive and it will also remove duplicates: + + let g:sort_motion_flags = 'ui' + +**Note**: This feature only works for linewise sorting + +By passing an `n` flag it's possible to sort numbers by their value regardless of the length. + +## System copy + +Another great plugin by christoomey which defines `cp` to be copy motion and +`cv` as paste motion, allows you to easily copy and paste to and from system +clipboard without much hassle. Install it by adding: + + Plugin 'christoomey/vim-system-copy' + +You will also need to have `xsel` installed from your terminal, as the plugin +needs a way to interact with the system clipboard, with `apt-get install xsel` +if you use Debian based distro, or `pacman -S xsel` if you use Arch based +distro. It's possible to change the program used, in case you prefer the other +one, with: + + let g:system_copy#copy_command='xclip -sel clipboard' + let g:system_copy#paste_command='xclip -sel clipboard -o' + +Also make sure to add the following line in order to get rid of the message +every time you use the plugin: + + let g:system_copy_silent = 1 + +Some examples: + +- `cpiw` => copy word into system clipboard +- `cpi'` => copy inside single quotes to system clipboard +- `cvi'` => paste inside single quotes from system clipboard +- `cP` => is mapped to copy the current line directly +- `cV` => is mapped to paste the content of system clipboard to the next line + + +## Replace with Register + +In the last section you saw how to interact with system clipboard. Now I am +going to talk about vim's built in registers. + +Out of the box, vim provides place to store yanked text called register. To yank +the text use `y`, and to later put it use `p`. Vim provides multiple registers +whose content can be inspected with `:register`. To specify the register to be +used, prefix any yank or put command with `"name`, where name is a character +representing a specific register. + +This plugin provides a motion to replace content of a text object with selected +register. The default biding is `gr`, which stands for `go replace`. + +Some examples: + +- `"2gri(` => replace the contents of the brackets with the content of register 2 +- `griw` => replace the current word with the content of default register + +This can also work with visual selections. + +## Conclusion + +Today, we had a look at some simple but powerful plugins. Because these plugins +are just new text motions they can be utilized with any text object showcased in the +previous article, so their use is truly limitless. diff --git a/cabin-deploy.sh b/cabin-deploy.sh @@ -0,0 +1,19 @@ +# cabin-deploy.sh: generate blog files and deploy to server + +if [ "$#" -ne 2 ]; then + echo "Error: Invalid number of arguments" + echo "Usage: $0 source destination" + exit 1 +fi + +src="$1" +dst="$2" + +pushd "$src" +find . -not -iname "*.md" -a -not -path "*.git*" -a -not -path "*.git*"| cpio -pvd "$dst" +popd + +stamd --output "$dst/blog" --index $src/blog/*.md +stamd --output "$dst" $src/*.md + +rsync -a $dst server:/var/www/cabin diff --git a/css/colors.css b/css/colors.css @@ -91,7 +91,7 @@ } /* Switched mode */ -#theme_switch:checked ~ main { +#theme_switch:checked ~ #content { --switch_icon: var(--light_switch_icon); --switch_text: var(--light_switch_text); @@ -161,12 +161,12 @@ transition: opacity .2s; } -.theme_switch:focus ~ main .switch_label::before, +.theme_switch:focus ~ #content .switch_label::before, .switch_label:hover::before { text-shadow: 0 0 15px var(--theme_fg0); } -.theme_switch:focus ~ main .switch_label::after, +.theme_switch:focus ~ #content .switch_label::after, .switch_label:hover::after { opacity: 1; } diff --git a/css/index.css b/css/index.css @@ -5,28 +5,75 @@ input, textarea, button, select, a { html, body { margin: 0; padding: 0; + border: 0; font: inherit; vertical-align: baseline; } +body { + font-family: monospace; + font-size: 1.2em; +} + +#content { + background-color: var(--theme_bg0); + color: var(--theme_fg0); + + min-width: 100vw; + min-height: 100vh; + + padding-top: 2em; + padding-bottom: 2em; + + position: relative; + display: flex; + flex-direction: column; + justify-content: center; + box-sizing: border-box; + + padding-left: 5vw; + padding-right: 5vw; +} + hr { color: var(--theme_fgt0_hard); width: 100%; + margin-left: auto; + margin-right: auto; } -footer { max-width: 1200px ; } +header, footer { + width: 100%; -main { display: flex; + flex-direction: column; justify-content: center; align-items: center; +} - background-color: var(--theme_bg0); - color: var(--theme_fg0); +header nav, +footer nav { + display: flex; + justify-content: space-between; - font-family: monospace; - /* font-size: 1.5em; */ + width: 100%; + + margin-left: auto; + margin-right: auto; + /* padding-right: 40px; */ +} + +main { + min-height: 100% ; + + margin-bottom: auto; + + position: relative; + display: flex; + flex-direction: column; + justify-content: center; + box-sizing: border-box; } p { @@ -40,18 +87,6 @@ img { height: 100%; } -.content { - position: relative; - display: flex; - flex-direction: column; - box-sizing: border-box; - max-width: 900px ; - min-height: 100vh ; - padding: 1em; - width: 100%; - height: 100%; -} - pre, code { background-color: var(--theme_bg1); @@ -174,7 +209,7 @@ blockquote:after { li { - margin-top: 1em; /* IE: lack of space above a <li> when the item is inside a <p> */ + margin-top: 0.5em; /* IE: lack of space above a <li> when the item is inside a <p> */ } :not(blockquote) > p, @@ -185,7 +220,7 @@ ul { .categories{ display: flex; - align-items: center + align-items: baseline; } .categories h3{ @@ -212,12 +247,6 @@ ul { margin: 0.15em; } -nav { - display: flex; - justify-content: space-between; - /* padding-right: 40px; */ -} - .bottom { margin-top: auto; } @@ -235,9 +264,6 @@ nav { margin-right: 0.5em; } - - - .small { display: flex; align-items: center; @@ -256,25 +282,31 @@ img { } h1 { + margin-bottom: 0; color: var(--theme_aqua); } h2 { + margin-bottom: 0; color: var(--theme_purple); } -h4 { - color: var(--theme_yellow); -} - -h6 { - color: var(--theme_gray); -} - h3 { + margin-bottom: 0; color: var(--theme_orange); } +h4 { + margin-bottom: 0; + color: var(--theme_yellow); +} + h5 { + margin-bottom: 0; color: var(--theme_green); } + +h6 { + margin-bottom: 0; + color: var(--theme_gray); +} diff --git a/index.html b/index.html @@ -1,40 +0,0 @@ -<!DOCTYPE html> -<html lang="en"> - <head> - <title>Dimitrije Dobrota's Cabin</title> - <meta charset="UTF-8" /> - <meta name="viewport" content="width=device-width,initial-scale=1"/> - <meta name="description" content="Dimitrije Dobrota's personal site. You can find my daily findings in a form of articles on my blog as well as various programming projects." /> - <link rel="stylesheet" type="text/css" href="/css/index.css?v=1.0.0" /> - <link rel="stylesheet" type="text/css" href="/css/colors.css?v=1.0.0" /> - <link rel="icon" type="image/png" sizes="32x32" href="/img/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="/img/favicon-16x16.png"> - </head> - <body> - <input type="checkbox" id="theme_switch" class="theme_switch"> - <main> - <div class="content"> - <label for="theme_switch" class="switch_label"></label> - <h1>Dimitrije Dobrota</h1> - <h4>21-year old junior of Computer Engineering and Information Theory interested in linux and CS</h4> - <h2>Articles</h2> - <p>I try to document my daily findings and the things I find interesting in my <a href="./blog/">blog</a></p> - <p>You can subscribe to my <a href="https://dimitrijedobrota.com/blog/rss.xml">RSS feed</a> or <a href="https://dimitrijedobrota.com/blog/index.atom">Atom feed</a> for updates</p> - <h2>Highlighted projects</h2> - <li><a href="https://git.dimitrijedobrota.com/alec/log.html">Alec</a>: Abstraction Layer for Escape Sequences for C++</li> - <li><a href="https://git.dimitrijedobrota.com/cabin/log.html">Cabin</a>: Source code for this website</li> - <li><a href="https://git.dimitrijedobrota.com/dotfiles/log.html">Dotfiles</a>: Dotfiles with my latest configuration files and scripts</li> - <li><a href="https://git.dimitrijedobrota.com/gol/log.html">Game of Life</a>: Implementation of Conway's Game of Life for terminal written in C</li> - <li><a href="https://git.dimitrijedobrota.com/leetcode/log.html">Leetcode</a>: Solution to 1000+ leetcode probems in C++</li> - <li><a href="https://git.dimitrijedobrota.com/stamen/log.html">Stamen</a>: Static menu generator for C and C++</li> - <li><a href="https://git.dimitrijedobrota.com/stellar/log.html">Chess Engine</a>: 2100+ rated bitboard chess engine written in C++</li> - <ul> - </ul> - <p>All of my projects can be found in my <a href="https://git.dimitrijedobrota.com">repos</a> or on <a href="https://github.com/DimitrijeDobrota">Github</a></p> - <h2>Contact</h2> - <p>For any questions feel free to <a href="mailto:mail@dimitrijedobrota.com">email me</a></p> - </div> - </main> - <script src="/scripts/main.js"></script> - </body> -</html> diff --git a/index.md b/index.md @@ -0,0 +1,38 @@ +@filename: index.html +@nonav + + +# Dimitrije Dobrota + +## Junior of Computer Engineering and Information Theory interested in Linux, C++ and CS + +### Articles + +I try to document my daily findings and the things I find interesting in [blog](./blog). + +You can subscribe to my [RSS feed](./blog/rss.xml) or [Atom feed](./blog/atom.xml) for updates. + + +### Highlighted Projects + +* [Alec](https://git.dimitrijedobrota.com/alec/log.html): Abstraction Layer for Escape Sequences for C++ +* [Cabin](https://git.dimitrijedobrota.com/cabin/log.html): Content, styles and scripts for this site +* [Dotfiles](https://git.dimitrijedobrota.com/dotfiles/log.html): Dotfiles with latest configuration files and scripts +* [Game of Life](https://git.dimitrijedobrota.com/gol/log.html): Implementation of Conway's Game of Life for terminal written in C +* [Leetcode](https://git.dimitrijedobrota.com/leetcode/log.html): Solution to 1200+ leetcode problems in C++ +* [Stamd](https://git.dimitrijedobrota.com/stamd/log.html): Static markdown blogging platform that automatically generates indexes, atom feed, rss feed and sitemap +* [Stamen](https://git.dimitrijedobrota.com/stamen/log.html): Static menu generator for C and C++ +* [Stellar](https://git.dimitrijedobrota.com/stellar/log.html): 2200+ rated bitboard chess engine written in C++ + +All of my projects can be found in [repos](https://git.dimitrijedobrota.com). + + +### Social + +* [Github](https://github.com/DimitrijeDobrota) +* [Leetcode](https://www.leetcode.com/dimitrijed) +* [Linkedin](https://www.linkedin.com/in/dimitrijedobrota) + +### Contact + +For any questions feel free to send me an [email](mailto:mail@dimitrijedobrota.com). diff --git a/sitemap.xml b/sitemap.xml @@ -5,7 +5,7 @@ <changefreq>weekly</changefreq> </url> <url> - <loc>https://dimitrijedobrota.com/articles</loc> + <loc>https://dimitrijedobrota.com/blog</loc> <changefreq>daily</changefreq> </url> <url>