Why Vim and TMux?
Vim is a modal, highly customizable and lightweight text/code editor that comes preinstalled on most *nix machines. As the word modal suggests, it supports various modes of execution allowing one to achieve text manipulation objectives using powerful and finely-tuned built-in commands and user-defined macros.
Vim’s modality being its most powerful feature also make it incredibly difficult to master. That said, the rewards of mastering it quickly outweigh the initial cost of learning it.
Here are a few reasons that make Vim outstanding among other editors:
1. Performance — Vim’s core is implemented in C which makes it blazingly fast and lightweight. Unlike most of the existing code editors which are Electron-based like VSCode (which is essentially a browser instance) or running on JVM like IntelliJ, it is optimized through the use of low-level machine specific code.
2. Highly Customizable — the ability to configure your editor down to a keystroke is an immensely valuable feature. Through the use of a high-level scripting language (VimScript), one can compose built-in commands to create macros that tweak the different modes on Vim to one’s suiting.
3. Distraction-free — as a developer, I value having a distraction-free zone to concentrate on a task I am working on. Noise, however, does not relate to the environment only. In most editors, you continually have to reach out to your trackpad to open a new file or click on a button to trigger some action. With this, you can easily drift away from the task at hand. Vim, on the other hand, supports the use of the keyboard only to achieve everything imaginable on an editor.
TMux is a terminal multiplexer(therefore the name TMux) that allows you to run multiple terminal sessions simultaneously on the same window. It is also highly configurable to support keybindings that can spawn new windows and to quickly navigate between them.
Together, both Vim and TMux marry harmoniously to form a Swiss army knife for all your code editing needs.
Learning Curve Awareness
Before we get to how to installing and configuring both Vim and TMux it is important to be aware that mastering these two would require both time and effort. Although comical, the Vi (now known as Vim) learning curve indicated below is a good depiction of what to expect.
I would, therefore, advise you do not rush through this write-up and instead regard it as a reference for close to one week.
Installing and Configuring Vim
If you are running a *nix machine(Unix, GNU/Linux, and its derivatives or MacOS) you would most likely have Vim preinstalled. It is possible, however, to have Vim’s predecessor Vi installed and so you would still need to install it.
To be sure that we have Vim installed, kindly run the following command on a MacOS terminal (for GNU/Linux based machines kindly check how to install Vim using your specific package manager):
$ brew install vim
Having installed it, we can now fire it up by running the following command:
$ vim
This should land you on the following window:
Although the cursor can be seen, Vim doesn’t allow you to immediately type anything on the document as by default it will land you in a command mode. For now, you can quit the app by typing :q<Enter> .
As Vim requires that you learn a few basic commands before proceeding to actually customize it, I would suggest you run Vim’s interactive tutor which can be accessed through:
$ vimtutor
This will have a text-based simplified Vim mode that will contain a step-by-step guide through some basic commands:
Going through the tutor, in my opinion, is the one stage that demands a lot of discipline and determination and one in which most people are likely to give up.
Although the tutor suggests you use 25–30 minutes to go through it, I would advise you have the 30 minutes sessions for 3 days to make sure you master most of the commands. Over time you will realize that these actions become intuitive and instead of having to think about what to type next, you find yourself navigating through the tutor rather easily.
The default Vim without extra configuration is really powerful for text editing. However, a few pain points may be realized such as not having a project’s files tree, code completion, integration with Version Control, fuzzy file search and syntax highlighting for certain languages. This is where plugins come to the rescue to unravel the full power of Vim.
To get you started, you would have to install a plugins manager. For this, I would recommend using VimPlug, which can be installed as directed here.
Having installed VimPlug, you can now install some basic plugins by creating a ~/.vimrc file running the following command:
$ touch ~/.vimrc
Within the file, ensure you have the following content (I would advise you use a code editor you are familiar with like VSCode):
syntax on set number set nocompatible set encoding=utf-8 filetype plugin indent on
call plug#begin('~/.vim/plugged')
" ---> this is where you add your plugins <---
call plug#end()
Save it and on your terminal run Vim again through:
$ vim
Now to add plugins, simply edit the ~/.vimrc file (using a code editor of your choice) and paste their configuration in the section indicated with ("---> this is where you add you plugins <---)above and restart Vim.
You would then type:PlugInstall while on Vim’s command mode to install the plugins. The following are the most essential plugins I believe you will need:
- Project’s files explorer — NerdTree is currently what I use as my files explorer. To install it, add the following to
~/.vimrc:
"{{ Configuring NerdTree
Plug 'scrooloose/nerdtree' " ---> to hide unwanted files <--- let NERDTreeIgnore = [ '__pycache__', '\.pyc$', '\.o$', '\.swp', '*\.swp', 'node_modules/' ]
" ---> show hidden files <--- let NERDTreeShowHidden=1
" ---> autostart nerd-tree when you start vim <---
autocmd vimenter * NERDTree
autocmd StdinReadPre * let s:std_in=1
autocmd VimEnter * if argc() == 0 && !exists("s:stdn_in") | NERDTree | endif
" ---> toggling nerd-tree using Ctrl-N <--- map <C-n> :NERDTreeToggle<CR>
"}}
2. Code completion — to enable code completion for Vim, install YouCompleteMe plugin.
"{{ Configuring YouCompleteMe
Plug 'valloric/youcompleteme', { 'do': './install.py' }
" ---> youcompleteme configuration <---
let g:ycm_global_ycm_extra_conf = '~/.vim/.ycm_extra_conf.py'
" ---> compatibility with another plugin (ultisnips) <---
let g:ycm_key_list_select_completion = [ '<C-n>', '<Down>' ]
let g:ycm_key_list_previous_completion = [ '<C-p>', '<Up>' ]
let g:SuperTabDefaultCompletionType = '<C-n>'
" ---> disable preview window <--- set completeopt-=preview
" ---> navigating to the definition of a a symbol <---
map <leader>g :YcmCompleter GoToDefinitionElseDeclaration<CR>
"}}
3. Fuzzy Finder — to support fuzzy file searching, you would have to add CtrlP plugin as follows.
"{{ Configuring CtrlP
Plug 'ctrlpvim/ctrlp.vim'
"}}
4. Snippets — code snippets allow you to quickly write some boilerplate code that is often repetitive. To add code snippets support, you will have to add UltiSnips.
"{{ Configuring UltiSnips
Plug 'SirVer/ultisnips' Plug 'honza/vim-snippets' let g:UltiSnipsExpandTrigger = "<tab>" let g:UltiSnipsJumpForwardTrigger = "<tab>" let g:UltiSnipsJumpBackwardTrigger = "<s-tab>"
"}}
5. Version Control — to add an integration to git add the following plugins:
"{{ Git integration
" ---> git commands within vim <--- Plug 'tpope/vim-fugitive'
" ---> git changes on the gutter <--- Plug 'airblade/vim-gitgutter'
" ---> nerdtree git changes <--- Plug 'Xuyuanp/nerdtree-git-plugin'
"}}
6. Color scheme configuration — Vim comes with quite a number of preinstalled color-schemes. There is the one I personally use though and I highly recommend it. To add it use:
"{{ Color-scheme
Plug 'morhetz/gruvbox' set background=dark colorscheme gruvbox let g:gruvbox_contrast_dark='default'
"}}
7. Autoclosing tags brackets and braces — typing out pairs of tags and braces can be rather painful. To fix this, use:
"{{ Autopairs
" ---> closing XML tags <--- Plug 'alvan/vim-closetag'
" ---> files on which to activate tags auto-closing <--- let g:closetag_filenames = '*.html,*.xhtml,*.xml,*.vue,*.phtml,*.js,*.jsx,*.coffee,*.erb'
" ---> closing braces and brackets <--- Plug 'jiangmiao/auto-pairs'
"}}
8. TMux integration — as we are going to be integrating Vim with TMux this plugin will be required on Vim’s side:
"{{ TMux - Vim integration
Plug 'christoomey/vim-tmux-navigator'
"}}
This completes the main configurations required on Vim to be up and running. In case of any pain points, a quick search will usually land you a solution in the form of a plugin or a script you would have to add to your configuration.
Installing and Configuring TMux
TMux also comes preinstalled on most of the *nix machines. To ensure that it is installed(or to install it), run:
$ brew install tmux
Now to integrate this with Vim, first, install the TMux plugins manager as directed here and then create a file ~/.tmux.conf file by running:
$ touch ~/.tmux.conf
Now, using a code editor of your choice add the following to the ~/.tmux.conf file:
# better prefix key set -g prefix C-a bind C-a send-prefix
# better splitting
bind | split-window -h -c "#{pane_current_path}"
bind - split-window -v -c "#{pane_current_path}"
# less colourful status set -g status-bg colour240 set -g status-fg white
# 256 colors support set -g default-terminal "screen-256color"
# sane scrolling set -g mouse on
# list of plugins set -g @plugin 'tmux-plugins/tpm' set -g @plugin 'tmux-plugins/tmux-sensible' set -g @plugin 'christoomey/vim-tmux-navigator'
# TMUX plugin manager (keep at the bottom of tmux.conf) run -b '~/.tmux/plugins/tpm/tpm'
Restart your terminal and this time, run:
$ tmux
Now, to split your window simply press Ctrl-A (referred to as the prefix key) followed by either | for a vertical split or - for a horizontal split. This way you can have as many terminal sessions as you want.
The Vim-TMux integration allows you to quickly navigate between the two by pressing Ctrl together with the HJKL keybindings used by default in Vim. This also works between any TMux sessions.
Conclusion
In conclusion, it might take quite a lot to get your Vim-TMux configuration working but the reward of having a code editor you have configured yourself next to your favorite terminal shell is totally worth it.
Lastly, I hope this has been helpful and in case you would prefer to use my configurations instead, you can easily access them here.
The post Configuring Vim and TMux to boost your productivity. appeared first on Andela.
