Week of the 17/08/2020 - #33
Contents
Tech
- Vim for JavaScript development
- TMux + Urxvt + Neofetch + Fish Linux ricing
- Managing ssh connections
Vim for JavaScript development
I’ve been recently critized by my fellow co-workers for writing code which thows JavaScript linting errors. So I guess it’s time I update my vim configuration so that it lints my code and uses more modern plugins.
I also decided to update my configuration which was pretty old and was a copy-paste from many sources most of which I didn’t understand. I thought best to create a new configuration from scratch and use neo-vim (so I can go to my backup config just in case). Here is what I did:
- Install vim-plug to manage all plugins. Its really nice and simple to use: add a line in your config (
~/.config/nvim/init.vim
) with the plugins you need (Plug xxx/yyyy
) and then install all plugins by executingPlugInstall
. Very cool. - Setup for Javascript development:
- Add Asynchronous Lint Engine (a.k.a ale) and configure to run
eslint
. - Install coc.nvim for auto-completion and add a sever with
:CocInstall coc-tsserver coc-json
- tagalong.vim The plugin is designed to automatically rename closing HTML/XML tags when editing opening ones
- Add Asynchronous Lint Engine (a.k.a ale) and configure to run
- Setup PHP development:
- Install autocomplete for PHP:
CocInstall coc-phpls
- Install autocomplete for PHP:
- Setup Python development:
- Install autocomplete for PHP:
CocInstall coc-python
(https://github.com/neoclide/coc.nvim/wiki/Install-coc.nvim)
- Install autocomplete for PHP:
Here are a couple of articles I need to go over to update my config:
- A guide to setting up Vim for JavaScript development / May 2019
- Vim for JavaScript and React in 2019
- Turning Vim into a JavaScript IDE / July 2018
- Blogs » Use Vim as a JavaScript IDE
Stuff to look at:
- Asynchronous Lint Engine (a.k.a ale) - Plugin for running linters in vim
- deoplete - Autocomplete for vim
- deoplete-ternjs — Autocomplete powered by Tern. Should work with most projects, but less powerful than Flow or TypeScript
- deoplete-flow — Autocomplete powered by Flow (demonstrated below)
- Gutentags - “Gutentags is a plugin that takes care of the much needed management of tags files in Vim. It will (re)generate tag files as you work while staying completely out of your way. It will even do its best to keep those tag files out of your way too. It has no dependencies and just works.”
- CTRLP - Full path fuzzy file, buffer, mru, tag, … finder for Vim. home
- Prettier - An opinionated code formatter
-
vim-plug - A minimalist Vim plugin manager.
-
neovim-gtk - GTK ui for neovim written in rust using gtk-rs bindings. With ligatures support.
- LanguageServer-php-neovim - A simple php language server plugin for LanguageClient-neovim.
- PHP Language Server - A pure PHP implementation of the open Language Server Protocol. Provides static code analysis for PHP for any IDE.
TMux + Urxvt + Neofetch + Fish Linux ricing
Looking at some Linux ricing screenshots I’ve always seen terminal screeshots that have a border which makes them look nicer. Unfortunately there is no such option in gnome terminal. One disadvantage of urxvt (the terminal a lot of people use) is its lack of tabs. For this I will use tmux which I’ve played with a couple of times but never used it much. i’ll give it a shot. Here are a couple of resources for tmux, urxvt and a couple of options I learned for neofetch
tmux bindings
tmux new -s myname
starts a new session with the given name which you can use to re-attach.tmux a
attach to an existing session. Optionally use-t name
to attach to a specific sessiontmux ls
List active sessionsctrl-b
is used to trigger all tmux keybindingsctrl-b c
creates a new windowctrl-b w
this is the killer command (in my opinion): it shows you all your open windows (the equivalent of tabs) and allows you to switch to one of them.ctrl-b n
andctrl-b p
let’s cycle between windows. It’s easier to usew
in my opinion.ctrl-b ,
allows you to name a window which is very useful for the window listing to be useful.ctrl-b d
detach the clent from the server.ctrl-b ?
list current bindings / commandsshift - middle button
used to paste (instead of CTRL-SHIFT-V)- More tmux commands - This Gist has a nice cheatsheet [gist]
- Some configuration advice for tmux - See this post for some useful options.
My current config:
# ==============================================================
# TMux config
# ==============================================================
# To re-read do: CTRL-B :source-file ~/.tmux.conf
# switch windows using Alt-arrow without prefix
bind -n M-Right select-window -n
bind -n M-Left select-window -p
# Open a new window with CTRL-SHIFT-T
bind -n C-T new-window
bind -n C-W choose-tree -Zw
# Reload config
bind r source-file ~/.tmux.conf
# Change terminal title when switching window
set-option -g set-titles on
set-option -g set-titles-string "#S / #W"
# Enable mouse mode (tmux 2.1 and above)
set -g mouse on
# don't rename windows automatically
set-option -g allow-rename off
urxvt
My goto command:
urxvt -depth 32 \
-bg rgba:1b00/1b00/1b00/ffff \
-b 50
~/.Xresources sample config:
! Use Monoid font as default
urxvt*font: xft:Monoid:size=9:antialias=true
! Scroll history
urxvt.saveLines: 1000000
To re-read this config if you change it rememeber you need to run xrdb ~/.Xresources
. To list the fonts you can use fc-list
:
$ fc-list | grep -i monoid
/home/miquel/.local/share/fonts/Monoid-Bold.ttf: Monoid:style=Bold
/home/miquel/.local/share/fonts/Monoid-Regular.ttf: Monoid:style=Regular
/home/miquel/.local/share/fonts/Monoid-Italic.ttf: Monoid:style=Italic
- urxvt man page - [web]
Fish
I’m going to give fish a try. I installed a couple of things to enhance the fish experience:
- fisher - to install fish plugins [github]
- spacefish theme - [github] cool Fish shell theme
- bass plugin - used to install Bash utilities (like
nvm
) which doesn’t work out-of-the-box with fish. [github]
Neofetch
Neofetch is a command-line system information tool written in bash 3.2+. Neofetch displays information about your operating system, software and hardware in an aesthetic and visually pleasing way.
You can use any image if your terminal supports it with this command:
$ neofetch --w3m ~/Dropbox/Photos/Avatars/foto-en-weston.jpg --size 300px
Managing ssh connections
I’ve been searching for a way to manage ssh connections. I’ve found two alternatives:
- sshch - SSH connection and aliases manager with curses and command line interface. The configuration can be found here:
~/.config/sshch.conf
- You can also create entries in
~/.ssh/config
for different hosts and then use TAB to complete:Host asys-reports hostname as-lav.auditorservice.com user audser port 22