DEV Community: Konstantin

Handling multiple branches in AI projects with git worktree

Konstantin — Sun, 28 Dec 2025 21:01:21 +0000

One of the most important features of git in terms of AI is git worktree. It allows you to checkout different branches at the same time in different folders like so:

git worktree add <branch> path

And all worktrees share the common stash list between them. This is crucial for AI use in projects where you might be running a long training job in one worktree, while simultaneously preprocessing data in another, and fixing a bug in code in a third—all without conflicts or context switching.

One of the big drawbacks of git worktree in my opinion was always unintuitive syntax, where I always would have to look up how to do a specific thing.

My solution: gwt

To fix this, I created gwt, a simple helper that makes git worktree intuitive.

Once installed you can simply type:

gwt

To list all available worktrees.

Before gwt

You would have to git worktree list → copy the path → cd ../../path/to/the-other-feature.

With gwt

Just run gwt and choose the branch and you're there.

gwt add <branch> would automatically create a new worktree with checked out branch.

If you already know the branch's worktree you want to jump into you can simply type gwt <branch>. Gwt supports autocomplete for branch names.

And finally gwt remove interactively prompts you to choose which worktree to delete.

Bundle frontend into axum binary using include_dir

Konstantin — Sun, 14 Apr 2024 01:45:34 +0000

If you have a frontend client that is tightly coupled with backend it might make sense to bake the frontend files inside backend binary. This way you can deploy only backend and be sure that frontend will be deployed as well.

There are some proposals on how to do it already such as https://github.com/tokio-rs/axum/issues/1698.

But we'll be using include_dir.

Setup

Our project will have the following structure:

├── src/ -> server source code
│   ├── routes/
│   │   ├── mod.rs
│   │   ├── healthcheck.rs
│   │   └── frontend.rs
│   └── main.rs
├── frontend/
│   ├── dist/ -> folder that we'll be baking into binary
│   ...
├── Cargo.toml
└── build.rs

First, let's prepare the Cargo.toml and specify all dependencies:

[package]
name = "axum_include_dir"
version = "0.1.0"
edition = "2021"

[dependencies]
axum = "0.7.5"
tokio = { version = "1", features = ["full"] }
mime_guess = "2.0.4"
include_dir = "0.7.3"
time = "0.3.36"

Healthcheck route

Now we can start implementing our routes. We need health route for two reasons:

it's a good idea in general to have a health in order to determine whether backend is up and running
in our case we want to make sure that our solution won't rewrite backend routes (in case if we have files with the same name as routes)

Here's our simple route(src/routes/healthcheck.rs):

use axum::{Router, routing::get};

pub(crate) fn router() -> Router {
    Router::new().route("/health", get(|| async { "ok" }))
}

Frontend

We can easily generate the frontend with vite:

$ npm create vite@latest frontend -- --template react

The only other thing that we need to do is to install frontend dependencies:

$ npm install

Frontend router

Frontend router would be responsible for multiple things:

calling include_dir in order to bake the frontend/dist folder into the server binary
serving static files that were bundled
handling default files, like index.html if we called a route that points to a folder
handling not found errors

Here is the full src/routes/frontend.rs file:

use std::path::PathBuf;
use axum::{
    http::{StatusCode, header},
    response::{Response, IntoResponse},
    Router,
    routing::get,
    extract::Path,
    body::Body
};

use include_dir::{include_dir, Dir, File};
use mime_guess::{Mime, mime};
use time::Duration;

const ROOT: &str = "";
const DEFAULT_FILES: [&str; 2] = ["index.html", "index.htm"];
const NOT_FOUND: &str = "404.html";

static FRONTEND_DIR: Dir<'_> = include_dir!("$CARGO_MANIFEST_DIR/frontend/dist");

async fn serve_asset(path: Option<Path<String>>) -> impl IntoResponse {
    let serve_file = |file: &File, mime_type: Option<Mime>, cache: Duration, code: Option<StatusCode>| {
        Response::builder()
            .status(code.unwrap_or(StatusCode::OK))
            .header(header::CONTENT_TYPE, mime_type.unwrap_or(mime::TEXT_HTML).to_string())
            .header(header::CACHE_CONTROL, format!("max-age={}", cache.as_seconds_f32()))
            .body(Body::from(file.contents().to_owned()))
            .unwrap()
    };

    let serve_not_found = || {
        match FRONTEND_DIR.get_file(NOT_FOUND) {
            Some(file) => serve_file(file, None, Duration::ZERO, Some(StatusCode::NOT_FOUND)),
            None => Response::builder()
                .status(StatusCode::NOT_FOUND)
                .body(Body::from("File Not Found"))
                .unwrap()
        }
    };

    let serve_default = |path: &str| {
        for default_file in DEFAULT_FILES.iter() {
            let default_file_path = PathBuf::from(path).join(default_file);

            if FRONTEND_DIR.get_file(default_file_path.clone()).is_some() {
                return serve_file(
                    FRONTEND_DIR.get_file(default_file_path).unwrap(),
                    None,
                    Duration::ZERO,
                    None,
                );
            }
        }

        serve_not_found()
    };

    match path {
        Some(Path(path)) => {
            if path == ROOT {
                return serve_default(&path);
            }

            FRONTEND_DIR.get_file(&path).map_or_else(
                || {
                    match FRONTEND_DIR.get_dir(&path) {
                        Some(_) => serve_default(&path),
                        None => serve_not_found()
                    }
                },
                |file| {
                    let mime_type = mime_guess::from_path(PathBuf::from(path.clone())).first_or_octet_stream();
                    let cache = if mime_type == mime::TEXT_HTML {
                        Duration::ZERO
                    } else {
                        Duration::days(365)
                    };

                    serve_file(file, Some(mime_type), cache, None)
                },
            )
        }
        None => serve_not_found()
    }
}

pub(crate) fn router() -> Router {
    Router::new()
        .route("/", get(|| async { serve_asset(Some(Path(String::from(ROOT)))).await }))
        .route("/*path", get(|path| async { serve_asset(Some(path)).await }))
}

Here we bundle frontend/dist with:

static FRONTEND_DIR: Dir<'_> = include_dir!("$CARGO_MANIFEST_DIR/frontend/dist");

On each request we try to get the file first by using FRONTEND_DIR.get_file(&path) and if None is returned we check if the path is a folder with FRONTEND_DIR.get_dir(&path).

In case of the folder we try to find one of the DEFAULT_FILES array inside it and serve them. If we can't find neither a file nor a folder we try to return 404.html file if it exists in the FRONTEND_DIR or a simple File Not Found message with 404 code. In order to add 404.html in a frontend generated by vite you need to simply create that file in frontend/public folder.

We also try to guess the mime type with the help of mime_guess crate and cache duration based on file type.

Building frontend

In order to trigger the frontend build we need to create build.rs file:

use std::process::Command;

fn main() {
    let output = Command::new("npm")
        .args(&["run", "build"])
        .current_dir("frontend")
        .output()
        .expect("Failed to execute command");

    if !output.status.success() {
        panic!("Command executed with failing error code");
    }
}

Each time we'll run cargo run the frontend will be built as well.

Merging routes

Now that we have all routes ready we can merge them in main.rs file and launch axum server:

mod routes;

use axum::Router;

use crate::routes::{healthcheck, frontend};

#[tokio::main]
async fn main() {
    let app = Router::new()
        .merge(healthcheck::router())
        .merge(frontend::router());

    let listener = tokio::net::TcpListener::bind("0.0.0.0:3000").await.unwrap();
    axum::serve(listener, app).await.unwrap();
}

Running the server

To run server we can either run

$ cargo run

or we can install cargo-watch and run it like so:

$ RUST_BACKTRACE=1 cargo watch -x run -w src -w frontend/src

This way every time that you change either server source code or frontend source code cargo will rebuild both.

And there it is on localhost:3000:

The frontend that is served right from inside of server binary.

Is this a good code?

Konstantin — Sat, 21 Jan 2023 19:05:55 +0000

Disclaimers

First let me make two disclaimers:

I'm not trying to tell here that the developer that wrote this code is a bad developer. For all I know he/she might be a much better developer than me.
I write a bad code all the time, so this post is nor to try compare my work to their's.

The code

You probably noticed this famous tweet:
// Detect dark theme var iframe = document.getElementById('tweet-1615204074588180481-1'); if (document.body.className.includes('dark-theme')) { iframe.src = "https://platform.twitter.com/embed/Tweet.html?id=1615204074588180481&theme=dark" }

You can find the code in question here:
https://github.com/MinBZK/woo-besluit-broncode-digid-app/blob/ad2737c4a039d5ca76633b81e9d4f3f9370549e4/Source/DigiD.iOS/Services/NFCService.cs#L182-L206

The internet became split between two types of developers. There were some developers saying that this is a bad code and providing an interesting one-liners that can do the same thing, and there were others that were praising it for its readability and simplicity.

I don't think that this code is really bad, but I don't agree with those that say that this is an amazing code either. Although, I completely agree that it's highly readable and you clearly understand what the author was trying to do, I do think it has some flaws. But first, let me share my solutions to the same problem.

My version

The first thing I asked myself is how I would solve this problem. I came up with initial version:

which was criticised fairly for being less optimised than the original:
// Detect dark theme var iframe = document.getElementById('tweet-1616224674903658496-978'); if (document.body.className.includes('dark-theme')) { iframe.src = "https://platform.twitter.com/embed/Tweet.html?id=1616224674903658496&theme=dark" }

So I went on and made a second version:
// Detect dark theme var iframe = document.getElementById('tweet-1616430404327870468-501'); if (document.body.className.includes('dark-theme')) { iframe.src = "https://platform.twitter.com/embed/Tweet.html?id=1616430404327870468&theme=dark" }

that seems to be as readable and as efficient as original one:
// Detect dark theme var iframe = document.getElementById('tweet-1616520533092495361-548'); if (document.body.className.includes('dark-theme')) { iframe.src = "https://platform.twitter.com/embed/Tweet.html?id=1616520533092495361&theme=dark" }

So what is wrong with the original code?

For me a part from readability and efficiency there is another important criteria for a good code: maintainability.

Imagine a scenario where you've shipped the initial solution and you received right away the new product requirements that change its behaviour.

In this scenario, the less effort you have to make to adapt to these requirements, the more maintainable your solution will be.

And I can think of at least two potential changes to product requirements:

making the scale bigger / smaller (instead of 10 slots show 5 or 20)
change the symbol from blue dot to let's say a star.

The first case would require making the original code twice as long / short. Or in the worst case it might be a complete rewrite. And the second case would require a search and replace through the whole function body. (it might not be a big deal in this case but it just shows the flaw)

In my version the modifications for those new requirements would be the following:

extract the number of steps into a scale variable:

public static string GetPercentageRounds(double percentage) {
  const string blueSpotSymbol = "🔵";
  const string emptySpotSymbol = "⚪";
  const int scale = 20;
  // 0 to 10
  double blueSpotsToDraw = Math.Ceiling(percentage * 10) * scale/10;
  string overallProgress = "";

  for (int i = 0; i < scale; i++) {
    overallProgress += blueSpotsToDraw-- > 0 ?
      blueSpotSymbol :
      emptySpotSymbol;
  }

  return overallProgress;
}

just change the symbols at the top of the function

Even if there is another team that comes to you and asks you to make this code configurable and share it with them it is fairly easy to do. You can simply add scale and symbols to function parameters.

Conclusion

Maintainability is as important as efficiency or readability. The more maintainable we make the system today, the less work and technical debt we will leave to someone else in the future.

Checking out multiple branches at the same time in git and moving files between them using git worktree

Konstantin — Tue, 21 Apr 2020 17:52:00 +0000

Imagine that you're working on some branch that is out of sync with master and you have already made a lot of changes. All of the sudden you realise that you want to move some of the files to a new branch that will be sourced from master (i.e. changes are needed by other members of the team).

Git Worktrees

To do that, you first need to create a git worktree:

git worktree add <folder> master

This will basically create a folder with a repository and checkout master branch. It also creates a link between the new and the "original" repository folder.

You can use git worktree list to list worktrees and git worktree remove to remove them. For more information about git worktree please refer to the official documentation.

Moving files

As mentioned earlier, git worktree creates a link between local folders. That means that your stashes are the same between them. So you can just stash interactively necessary hunks with:

git stash -p

or you can git add unwanted changes, and git stash -k to stash the unstaged files.

Now you need to switch to the new worktree with master and create a new branch:

cd <folder>
git checkout -b new_branch

and do git stash apply. It's better to use apply most of the time and not pop since if you have some conflicts you can always abort without losing stashed changes.

Generating shorter aliases from .gitconfig file

Konstantin — Fri, 07 Feb 2020 20:43:40 +0000

In previous articles I showed how to configure aliases in your ~/.gitconfig file.

As you might have noticed you need to type git alias which might be inconvenient. Even if you make an alias g=git you have to remember to type space between g and alias.

To make things easier we can automatically generate shell aliases from the .gitconfig file:

here we grep all the git config values from alias section and get the alias name with sed. Then we check that alias g + alias name doesn't already exist and set it.

Now, if you had for instance alias a = add you can type both g a and ga.

That's it.

Write everything down

Konstantin — Mon, 06 Jan 2020 13:08:37 +0000

If you have any thought, even if it doesn't appear to be interesting at first, try to write it down. This way you can keep a history of your discoveries.

Otherwise, if you have a brilliant idea and it's in the way of something else (i.e. current work) , writing it down can eliberate the burden that you had and you actually will be able to focus on the tasks at hand, knowing that your idea is safely stored and that you can come back to it later.

Once you gain an experience of quickly writing down something you'll find that your ideas become much better formed and more polished. You'll also be able to communicate them to other people in a more clear manner.

Make sure that you have at all times something to write on, or that your writing app is one tap away, that it will open a note right away and the only thing that is left for you is to write down your thought. It also should provide an easy way to categorize, tag and find your notes.

There is only one disadvantage—it takes time. But this disadvantage is still easily beaten by a potential regret of a missed thought (that could have transformed to something interesting).

Write everything down!

Managing your projects

Konstantin — Mon, 23 Dec 2019 19:54:26 +0000

As most of developers I have ~/projects folder where I stock all my projects.

To jump from one project to another I normally use either a cd with

zsh-users / zsh-autosuggestions

Fish-like autosuggestions for zsh

rupa / z

z - jump around

But sometimes I get to a wrong folder (z sometimes jumps to parent folder) and if I want to create a project I have to:

create folder
cd to it
do git init
do npm init or cargo init
do hub create

A lot of stuff, just to create a project.

Enter `gko/project`

Some time ago I created a small zsh plugin (it works in bash as well):

gko / project

☕️ Create node, rust, python or ruby project locally and on github (private or public)

Project

Create npm, cargo, gem or pip project locally and on github or just cd into existing.

After project init you will be prompted to create a github repo (private or public).

You can read more about it in the «Managing your projects» article.

Installation

You will need to install github cli (see this installation instructions) in order to create project repository on github.

With antigen

In your .zshrc

antigen bundle gko/project

Manually

You need to clone repo:

git clone --recursive --depth 1 https://github.com/gko/project

then add it to .bashrc or .zshrc:

source ./project/project.sh

Usage

Usage: project [options]
Example:
  project -p test
Options:
  -h, --help      help
  -p, --private   create private github repository
  -f, --folder    your projects folder(defaults to ~/projects)
  -n, --no-init   avoid initializing package

then to create public repo:

project test

create private repo:

project -p test

If the project exist you will just cd…

View on GitHub

It allows you to just type:

project <project name>

and it will prompt you to create npm, cargo, gem or pip package

as well as a private or public github repo (you need to install and configure hub for that) and jump into it:

If the project exists you will just cd to the project folder.

Project folder

By default project folder is ~/projects but you can either specify another folder when running project:

project -f /projects_path

or use PROJECTS_HOME variable

export PROJECTS_HOME=/projects_path

`ZSH` autocomplete

It supports zsh-autocomplete. On Tab will show the list of available projects.

Alias it

You can also alias it (in ~/.zshrc or ~/.bashrc):

alias p='project'

to get:

p test-project

Preview replace results in Neovim

Konstantin — Tue, 17 Dec 2019 06:24:39 +0000

There is an interesting option in Neovim called inccommand. It allows you see the live preview of your buffer after some command (i.e. replace).

To configure it add following to your ~/.config/nvim/init.vim:

set inccommand=nosplit

Or if you're using ~/.vimrc to configure both vim and neovim:

if has("nvim") 
  set inccommand=nosplit
endif

Now, as you type %s/text/replace/before you hit Enter you'll see the live result of your command so you can cancel it by hitting Esc.

You can also set inccommand to split. In that case the result will be shown in a separate split pane.

Find and replace text in project files with vim

Konstantin — Mon, 16 Dec 2019 00:37:58 +0000

I've seen a lot of articles describing how to replace text with the cfdo command and others that describe how to find files with FZF, but I couldn't find one that «puts it all together», so I decided to make a short instruction.

Prerequisites

First you need to install fzf via vim-plug:

call plug#begin()

" if you have fzf installed via brew
if isdirectory('/usr/local/opt/fzf')
    Plug '/usr/local/opt/fzf'
else
    Plug 'junegunn/fzf', { 'dir': '~/.fzf', 'do': './install --all' }
endif
Plug 'junegunn/fzf.vim', {
        \ 'on': [
            \ 'Ag',
            \ 'Rg',
            \ 'FZF',
            \ 'Files',
            \ 'Buffers',
            \ 'Commits',
            \ 'BCommits',
            \ 'Tags',
            \ 'BTags',
            \ 'History',
            \ 'Lines',
            \ 'BLines',
            \ 'Marks'
        \ ] }

call plug#end()

and then ripgrep

Configuring `Meta key` (⌥) in `macOS` terminal

Some shortcuts use Meta key. To make it work properly in macOS terminal check the «Use option as meta key»:

Or «Esc+» option in iterm2:

Finding and replacing text

To search text within project files simply type :Rg <text>. This will open up a FZF buffer with a list of files.
Then with a Tab key you can select/deselect files that you want to pass to quickfix window. To select all files tap Alt/⌥-a and to deselect Alt/⌥-d.
Once your selection is ready hit Enter to pass selected files to quickfix buffer.
Now you can replace text in all files within quickfix buffer with :cfdo %s/<text to search>/<text to replace with>/g | update.

The cfdo command simply executes command on every file in the list, and the update command after the pipe saves the results to the disk.

I've used here some of the snippets from my vim setup. You can find it here:

gko / vimio

🎩 easy to install/use vim settings

Vim Settings

An article describing key features of this config.

Prerequisites

In order to get all features you might want to install following packages:

Installation

On unix and windows(with bash which can be installed with git):

curl -L https://raw.github.com/gko/vimio/main/install.sh | bash

macOS

In macOS terminal.app don't forget to check the «Use option as meta key»:

And «Esc+» option in iterm2:

Shortcuts

Some of shortcuts(Leader key is comma):

Ctrl + s saves current file
Leader + s in both select and normal mode initiates search and replace
Alt + Up/Down moves line or selection above or below current line(see upside-down for more info)
Alt + Left/Right moves character or selection to left or to the right
Leader + n toggles NERDTree
Leader + m shows current file in NERDTree
when in select mode ', ", ( wraps selection accordingly
y…

View on GitHub

Configuring a perfect editor for frontend development

Konstantin — Mon, 21 Oct 2019 06:12:04 +0000

I've seen a lot of tweets recently that basically state that vim is not suitable for frontend development. So I decided to do a small overview of my setup(I'm mostly a frontend developer although I do some backend and devops stuff as well).

My setup

You can find all configuration and instructions on how to install it in my github repo:

gko / vimio

🎩 easy to install/use vim settings

Vim Settings

An article describing key features of this config.

Prerequisites

In order to get all features you might want to install following packages:

Installation

On unix and windows(with bash which can be installed with git):

curl -L https://raw.github.com/gko/vimio/main/install.sh | bash

macOS

In macOS terminal.app don't forget to check the «Use option as meta key»:

And «Esc+» option in iterm2:

Shortcuts

Some of shortcuts(Leader key is comma):

Ctrl + s saves current file
Leader + s in both select and normal mode initiates search and replace
Alt + Up/Down moves line or selection above or below current line(see upside-down for more info)
Alt + Left/Right moves character or selection to left or to the right
Leader + n toggles NERDTree
Leader + m shows current file in NERDTree
when in select mode ', ", ( wraps selection accordingly
y…

View on GitHub

File structure

The main file is init.vim that is symlinked to .vimrc during the installation. All the configuration scripts are stored in after/plugin/*.vim. This way I can just add another script to that folder(with a name of a plugin for instance) and it will be automatically loaded during vim startup. It also helps me to keep things modular.

Spoiler

I should point out right away that perfect editor doesn't exist or at least it's different for everyone.

Why vim

I think there are many great editors and IDEs out there but there is one thing among others that stands out if you're using vim: you don't switch environment. So if you're in terminal and you've cloned a project, once you open it you're still in terminal. Even if you quit vim you're still in the same environment. For me, that's the most important thing about using vim(beside many other things, obviously).

With that out of the way let's take a look at some key features of my config.

Opening a project

In my mind any project is strongly linked with a repository(except monorepos of course), so when I open any file in a repository I want my editor to go to the root of the project(i.e. where the .git folder is located). There is a plugin for that:

airblade / vim-rooter

Changes Vim working directory to project root.

It goes through parent folders until it finds a repo, or your custom file or folder pattern that you can configure.

mhinz / vim-startify

🔗 The fancy start screen for Vim.

will help me quickly go back to recent projects.

Opening a file

Locally

I use fzf and ctrlp extensions.
The second one has also a ctrlb shortcut to switch between buffers.

In future I would like to use only fzf

Also with this plugin:

wsdjeg / vim-fetch

Make Vim handle line and column numbers in file names with a minimum of fuss

I can open a certain line, for instance:

vim ~/.vimrc:123

will open line 123 of .vimrc file.

Opening file in the browser

Sometimes when you have a file opened you want to quickly jump to a Web version(for instance to leave a comment). For this I use the following plugin:

ruanyl / vim-gh-line

vim plugin that open the link of current line on github

The main shortcuts are:

Leadergh — open file in the browser(current revision)
Leadergb — open blame view for current file
Leadergo — open repository in the browser

Please note, that if you use it in visual mode, it will automatically highlight selected line(s).

Sharing code via Carbon

Carbon is a code sharing website, that adds swag to it. To share selection(if you're in visual mode) or the whole file I use following vim extension:

kristijanhusak / vim-carbon-now-sh

Open selected text in https://carbon.now.sh

Here's my Carbon config:

let g:carbon_now_sh_options = {
\  'ln': 'true',
\  'bg': 'rgba(74,144,226,1)',
\  't': 'night-owl',
\  'wt': 'none',
\  'ds': 'true',
\  'dsyoff': '20px',
\  'dsblur': '68px',
\  'wc': 'true',
\  'wa': 'true',
\  'pv': '56px',
\  'ph': '56px',
\  'fm': 'Fira Code',
\  'fs': '14.5px',
\  'lh': '141%',
\  'si': 'false',
\  'es': '2x',
\  'wm': 'false'
\}

Miscellaneous

To configure vim to change indentation rules per project I use:

editorconfig / editorconfig-vim

EditorConfig plugin for Vim

To search text within all files and replace it I use ripgrep that is supported natively in fzf extension(Rg command):

junegunn / fzf.vim

fzf ❤️ vim

Taking notes with vim

I recently wrote a post about how to configure vim to quickly take notes:

Taking notes in vim revisited

Konstantin ・ Sep 12 '19

#neovim #vim #notes #vimwiki

I can add following plugin to that article:

MattesGroeger / vim-bookmarks

Vim bookmark plugin

It allows you to bookmark anything anywhere(even in NERDTree).

Color themes

By default I use:

cormacrelf / vim-colors-github

A Vim colorscheme based on Github's syntax highlighting as of 2018.

But I also installed the base16(this is a fork, due to some problems with the original repo) themes and configured vim so that it looks into ~/.vimrc_background file and takes current base16 theme from there:

" set colorscheme
" if you have base16 installed take that colorscheme
try
    if filereadable(expand("~/.vimrc_background"))
        let base16colorspace=256
        source ~/.vimrc_background
        let g:airline_theme='base16'
    else
        colorscheme github

        " https://github.com/cormacrelf/vim-colors-github/pull/5
        hi! link SignColumn LineNr

        let g:airline_theme = "github"
    endif
catch /^Vim\%((\a\+)\)\=:E185/
    colorscheme default
endtry

This way vim stays consistent with terminal theme.

Autocompletion

For autocompletion I use coc.nvim.

It's based on the same language server as vscode.

Javascript

By default you won't have an autocompletion in javascript. To enforce typescript to enable autocompletion within javascript you have to add:

// @ts-check

At the top of the file. In my setup I have
a templates folder that contains predefined templates for new files(config can be found in templates.vim). So once I create new js file it already contains that comment.

Jumping between files

Coc already provides different shortcuts to jump to function definition and what not:

nmap <silent> gd <Plug>(coc-definition)
nmap <silent> gy <Plug>(coc-type-definition)
nmap <silent> gi <Plug>(coc-implementation)
nmap <silent> gr <Plug>(coc-references)

However vim provides a magic shortcut gf that allows you to jump to a file under cursor. The magic is that you can alter it's behavior per file type. For instance, in javascript we want to use the following algorithm to resolve the file:

Check file locally
If it doesn't exist check file in node_modules
If it exists and it is a folder check the package.json for main field. If it is present open it.
If the main field is not there check for index.js

You can find the implementation in the after/ftplugin/javascript.vim file.

Linters

For linting I use Ale(config — ale.vim):

dense-analysis / ale

Check syntax in Vim/Neovim asynchronously and fix files, with Language Server Protocol (LSP) support

and prettier to autoformat:

prettier / vim-prettier

A Vim plugin for Prettier

Conclusion

Here I highlighted key features of my configuration. I encourage you to go check the full list of extensions that I use in the init.vim file and the configuration scripts in the after/plugin/ folder. I listed all the file types and commands for every extension explicitly so that there is nothing that fires up randomly.

Taking notes in vim revisited

Konstantin — Thu, 12 Sep 2019 20:38:46 +0000

In my previous post I talked about a vimwiki plugin for taking notes:

Taking notes with vim

Konstantin ・ May 31 '19

#vim #notes #vimwiki #markdown

I was still unsatisfied with the results, such as redefining markdown behavior and losing some of the essential shortcuts. Then I stumbled across an article «You (probably) don’t need Vimwiki» by Joe Reynolds.

Replacing `vimwiki`

So to replace vimwiki we need to configure following features:

open/create new file under cursor.
open notes from any location(with Leaderww)
shortcut for toggling checkboxes to make TODO lists
align tables in markdown
previewing html

Create new file under cursor.

The article that I mentioned above did say that you can replace the vimwiki's enter shortcut that creates new markdown files and opens them with gf(open file under cursor). Unfortunately, it works only when the file actually exists. We want to be able to quickly create and open a new note once we typed its name. However, there is an alternative shortcut in markdown plugin by plasticboy –– ge that allows you to open file under cursor(if it is a markdown link) even if it doesn’t exist... unless it's in a subfolder(s) that doesn't exist. Lucky for us, there is a plugin that creates all subfolders in the path of the file(mkdir -p for vim):

pbrisbin / vim-mkdir

Automatically create any non-existent directories before writing the buffer.

Note

All of my GitHub repositories have been archived and will be migrated to Codeberg as I next work on them. This repository either now lives, or will live, at:

https://codeberg.org/pbrisbin/vim-mkdir

If you need to report an Issue or raise a PR, and this migration hasn't happened yet, send an email to me@pbrisbin.com.

Mkdir

Maggie! Don't even ask. Just bring it. Come on.

-- Hot Rod

Installation

Add pbrisbin/vim-mkdir to your preferred vim plugin management plugin list.

I happen to use lua configuration and minpac, so my ~/.config/nvim/init.lua contains,

vim.cmd [[ packadd minpac ]]

vim.call('minpac#init')
vim.call('minpac#add', 'pbrisbin/vim-mkdir')

Usage

:e this/does/not/exist/file.txt
:w

Smile when you are not presented with an error. Instead, notice that vim has automatically created the non-existent directory for you.

View on GitHub

so if you add to your .vimrc or init.vim following plugins:

Plug 'pbrisbin/vim-mkdir'
Plug 'plasticboy/vim-markdown', { 'for': 'markdown' }

provided that you're using vim-plug as a plugin manager, you should be able to type ge in md file(on a markdown link) and vim would create the file under cursor, as well as all subfolders and open this file for editing.

You can find more information about markdown plugin mappings in README.

Open notes from any location

I store all my notes in ~/Documents/notes folder(and in MacOS all files are automatically synced with iCloud).

Our shortcut should essentially open the ~/Documents/notes/index.md file:

" open ~/Documents/notes/index.md
nnoremap <Leader>ww :e ~/Documents/notes/index.md<cr>

since we've configured plugin that creates subfolders it should automatically create notes folder as well.

Toggling checkboxes to make TODO lists

For this I found a nice plugin:

jkramer / vim-checkbox

Vim plugin for toggling checkboxes.

Vim Checkbox

Description

Simple plugin that toggles text checkboxes in Vim. Works great if you're using a markdown file for notes and todo lists.

Requirements

The action provided by this plugin can be repeated with the native action .. This is provided by tpope/vim-repeat. Please be sure to install it before installing this plugin.

Installation

Just copy the script into your plugin folder, e.g. ~/.vim/plugin/. If you're using pathogen, just clone this repository in ~/.vim/bundle.

Custom mappings

If you do not want to use <leader>tt you can set it via e.g.:

augroup checkbox_mappings
    nnoremap <leader>oo <plug>ToggleCheckbox
augroup END

Hint: In this case the default mapping <leader>tt will not be configured.

Usage

Press <leader>tt to toggle the (first) checkbox on the current line, if any. That means, [ ] will be replaced with [x] and [x] with [ ]. If you want more or different checkbox…

View on GitHub

the shortcut that interests us is Leadertt that searches and toggles the checkbox on the cursor line. In visual mode it will toggle all checkboxes on selected lines.

Align tables in markdown

The previously mentioned markdown plugin already contains this feature in form of a command: :TableFormat. It will align a table under cursor.

Previewing html

To preview markdown in a browser I'm using this amazing plugin:

iamcco / markdown-preview.nvim

markdown preview plugin for (neo)vim

✨ Markdown Preview for (Neo)vim ✨

Powered by ❤️

Introduction

It only works on Vim >= 8.1 and Neovim

Preview Markdown in your modern browser with synchronised scrolling and flexible configuration.

Main features:

Cross platform (MacOS/Linux/Windows)
Synchronised scrolling
Fast asynchronous updates
KaTeX for typesetting of math
PlantUML
Mermaid
Chart.js
js-sequence-diagrams
Flowchart
dot
Table of contents
Emojis
Task lists
Local images
Flexible configuration

Note the plugin mathjax-support-for-mkdp is not needed for typesetting math.

Installation & Usage

Install with vim-plug:

" If you don't have nodejs and yarn
" use pre build, add 'vim-plug' to the filetype list so vim-plug can update this plugin
" see: https://github.com/iamcco/markdown-preview.nvim/issues/50
Plug 'iamcco/markdown-preview.nvim', { 'do': { -> mkdp#util#install() }, 'for': ['markdown', 'vim-plug']}
" If you have nodejs
Plug 'iamcco/markdown-preview.nvim', { 'do':

…

View on GitHub

to start a preview you simply need to type :MarkdownPreview and it will open up a browser and sync all your modifications. To stop the preview you can type :MarkdownPreviewStop.

So in the end your .vimrc file should look something like this:

call plug#begin('~/.vim/plugged')

Plug 'pbrisbin/vim-mkdir'

Plug 'jkramer/vim-checkbox', { 'for': 'markdown' }
Plug 'plasticboy/vim-markdown', { 'for': 'markdown' }

if executable('npm')
    Plug 'iamcco/markdown-preview.nvim', { 'do': 'cd app & npm install' }
endif

" Initialize plugin system
call plug#begin('~/.vim/plugged')

" open ~/Documents/notes/index.md
nnoremap <Leader>ww :e ~/Documents/notes/index.md<cr>

You can find these configs and more in my vim config repo:

gko / vimio

🎩 easy to install/use vim settings

Vim Settings

An article describing key features of this config.

Prerequisites

In order to get all features you might want to install following packages:

Installation

On unix and windows(with bash which can be installed with git):

curl -L https://raw.github.com/gko/vimio/main/install.sh | bash

macOS

In macOS terminal.app don't forget to check the «Use option as meta key»:

And «Esc+» option in iterm2:

Shortcuts

Some of shortcuts(Leader key is comma):

Ctrl + s saves current file
Leader + s in both select and normal mode initiates search and replace
Alt + Up/Down moves line or selection above or below current line(see upside-down for more info)
Alt + Left/Right moves character or selection to left or to the right
Leader + n toggles NERDTree
Leader + m shows current file in NERDTree
when in select mode ', ", ( wraps selection accordingly
y…

View on GitHub

You can also find me on twitter: https://twitter.com/konstantin

Taking notes with vim

Konstantin — Fri, 31 May 2019 18:38:53 +0000

For some time I've been searching for a plugin that would allow me to take notes without any hassle. I enjoy using markdown, so naturally this plugin had to support that format.

Recently I came across vimwiki. It has almost everything that I wanted, although there are a couple of flaws. But since it's vim it is very easy to fix them yourself.

Installing `vimwiki`

If you're using vim-plug, you can install it simply by adding following in your ~/.vimrc file:

call plug#begin()

Plug 'vimwiki/vimwiki', { 'branch': 'dev' }

call plug#end()

I recommend using dev branch as I found it to be pretty stable, with a lot of bugfixes.

Using `vimwiki`

vimwiki supports wiki format as well as markdown but since our task is to use the latter we need to add following to ~/.vimrc:

let g:vimwiki_list = [{ 'path': '~/Documents/notes/',
       \ 'syntax':'markdown', 'ext': '.md' }]

This will tell the plugin that all notes must be stored in ~/Documents/notes/, which is compatible with most OS and you will profit automatically of iCloud sync in MacOS. It also tells that we are using markdown format by default and our default root note will be called index.md. To access this note you need to hit Leader + w + w from any vim buffer.

After you've opened any note you can hit Enter on any word or selection and vimwiki will create a link to a child note(with that word or selection as a name) and the note file itself. Once the link is created you can simply navigate to a child note by hitting Enter once again. Magic!

The flaws and how to fix them

The main flaw is that vimwiki replaces itself as syntax highlighter for markdown files. Compare:
vimwiki highlight

to vim-markdown highlight

I know that it depends on colorscheme, but I saw same result on multiple variants.

The second flaw is it changes filetype to vimwiki so that you lose all your snippets and other good stuff that was linked to markdown filetype.

To fix both you need to add following line to ~/.vimrc:

autocmd FileType vimwiki set ft=markdown

That way we reset the vimwiki file type to markdown, all the magic functionality that I talked about earlier will remain.

You can find all the configuration in my vim settings repo:

gko / vimio

🎩 easy to install/use vim settings

Vim Settings

An article describing key features of this config.

Prerequisites

In order to get all features you might want to install following packages:

Installation

On unix and windows(with bash which can be installed with git):

curl -L https://raw.github.com/gko/vimio/main/install.sh | bash

macOS

In macOS terminal.app don't forget to check the «Use option as meta key»:

And «Esc+» option in iterm2:

Shortcuts

Some of shortcuts(Leader key is comma):

Ctrl + s saves current file
Leader + s in both select and normal mode initiates search and replace
Alt + Up/Down moves line or selection above or below current line(see upside-down for more info)
Alt + Left/Right moves character or selection to left or to the right
Leader + n toggles NERDTree
Leader + m shows current file in NERDTree
when in select mode ', ", ( wraps selection accordingly
y…

View on GitHub

I'm also on twitter as konstantin

DEV Community: Konstantin

Handling multiple branches in AI projects with git worktree

My solution: gwt

Before gwt

With gwt

Bundle frontend into axum binary using include_dir

Setup

Healthcheck route

Frontend

Frontend router

Building frontend

Merging routes

Running the server

Is this a good code?

Disclaimers

The code

My version

So what is wrong with the original code?

Conclusion

Checking out multiple branches at the same time in git and moving files between them using git worktree

Git Worktrees

Moving files

Generating shorter aliases from .gitconfig file

Write everything down

Managing your projects

zsh-users / zsh-autosuggestions

Fish-like autosuggestions for zsh

rupa / z

z - jump around

Enter gko/project

gko / project

☕️ Create node, rust, python or ruby project locally and on github (private or public)

Project

Installation

With antigen

Manually

Usage

Project folder

ZSH autocomplete

Alias it

Preview replace results in Neovim

Find and replace text in project files with vim

Prerequisites

Configuring Meta key (⌥) in macOS terminal

Finding and replacing text

gko / vimio

🎩 easy to install/use vim settings

Vim Settings

Prerequisites

Installation

macOS

Shortcuts

Configuring a perfect editor for frontend development

My setup

gko / vimio

🎩 easy to install/use vim settings

Vim Settings

Prerequisites

Installation

macOS

Shortcuts

File structure

Spoiler

Why vim

Opening a project

airblade / vim-rooter

Changes Vim working directory to project root.

mhinz / vim-startify

🔗 The fancy start screen for Vim.

Opening a file

Locally

wsdjeg / vim-fetch

Make Vim handle line and column numbers in file names with a minimum of fuss

Opening file in the browser

ruanyl / vim-gh-line

vim plugin that open the link of current line on github

Sharing code via Carbon

kristijanhusak / vim-carbon-now-sh

Open selected text in https://carbon.now.sh

Miscellaneous

Enter `gko/project`

`ZSH` autocomplete

Configuring `Meta key` (⌥) in `macOS` terminal

Replacing `vimwiki`

Installing `vimwiki`

Using `vimwiki`