How I Setup My VIM as Modern Text Editor

Zafar Saleem
5 min readJun 12, 2019

Text Editors are one of the most widely used softwares. There are too many choices and options to choose from to use modern text editors out there. Simply google and a long list of editors will appear.

However, I personally really like using VIM for my development projects because I see myself more productive with it than any other text editor out there. Secondly, I mostly write code for which simple text editors work perfectly fine.

It is up to you whether to use Vim or not but knowing it, is something important if you are a computer geek.

Vim is a very minimal text editor by default. But adding more plugins to it can make it if not modern then close to modern text editors and can compete with them easily.

I am not going to get into details on how to open vim and shut down or restart your computer(which should be press escape, type :q hit enter to exit) to exit out of vim which in reality should be last source of defence in order to exit vim. All these are newbies issues.

Make sure you already know the basics of vim before proceeding with this blog.

Now let’s get started. In order to make VIM a complete text editor we will require to use set plugins. If you are the one who does not like reading blogs and articles and going straight into the business then go ahead to my github profile where you will be able to sample .vimrc file. Simply copy everything from there and paste in your .vimrc file and execute :PluginInstall inside vim to install all the plugins. Below is the link to my .vimrc

https://github.com/zafar-saleem/vimrc/blob/master/.vimrc

The rest of the blog is for those who likes reading blogs and follow along.

However, I am going to simply list all the plugins used in my above .vimrc file and mention the purpose of all of these plugins.

In order to proceed with plugins to install in vim, we need to have plugin manager. In our above .vimrc we are using Vundle plugin manager.

Vim javascript syntax

The very first plugin you will notice in our .vimrc file is vim javascript syntax. It allows vim to have enhanced JavaScript Syntax. The list of features if offers can be found on its github link above.

Vim node

The second plugin that can be seen on .vimrc is vim-node. It offers set of tools to make nodejs development super cool. Tools such as :Nedit to quickly edit any module, [I to look for a keyword in required file etc.

Vim jsbeautify

It allows us to beautify our JavaScript, HTML and CSS files.

Nerdtree

One of the best plugin. This allows us to have side bar with tabs and file tree. It is a file system explorer. This makes life easier to quickly browse through complex folder structure.

Vim javascript

JavaScript bundle for vim, this bundle provides syntax highlighting and improved indentation.

Command-t

My second favourite plugin for vim. It provides an extremely fast “fuzzy” mechanism for opening files and buffers, jumping to tags and help and running commands, or previous searches and commands.

CSS.vim

Cutting-edge vim css syntax file.

scss-syntax.vim

Vim syntax file for scss (Sassy CSS)

Vim-json

A better JSON for Vim: distinct highlighting of keywords vs values, JSON-specific (non-JS) warnings, quote concealing. Pathogen-friendly.

ctrlp.vim

My another favourite plugin that I use all the time. It is full path fuzzy file, buffer, mru, tag, … finder for Vim.

Emmet Vim

Recall a famous emmet package for sublime? Yes this is exactly what it does for vim. It is emmet for vim to complete different abbreviations for syntax.

Vim multiple cursors

By far one of the best plugin. This plugin allows you to select same text inside vim and then select same text with multiple cursors and edit them all at once.

Nerdcommenter

It allows us to comment single or multiple lines of code commented whenever necessary.

These are some of the plugins that I use in my vim setup to convert my vim into IDE for development. I missed some of them as they are not as necessary but optional. Go ahead and use above .vimrc file as an example to setup your own vim and convert it into complete IDE.

I hope you liked this blog. Please don’t forget to like and share.

And if you would like to hire me for your next project then please Hire Me.

Below are my social media profiles if you would like to get in contact with me.

Linkedin | Github | Gitlab | Website

--

--