Friday Picks 066

Here are some links for this weekend. I hope you’ll enjoy them! Full Stack Serverless - Building a Real-time Chat App with GraphQL, CDK, AppSync, and React: a concise tutorial by Nader Dabit Build A Confirmation Modal in React with State Machines: learn more about state machines with Dave Ceddia Building Microservices with Deno, Reno, and PostgreSQL: by James Wright Show your latest dev.to posts automatically on your GitHub profile readme: a GitHub action that automatically fetches blog posts from dev.
Read more →

Friday Picks 063

Read more →

TIL How to Execute an External Command in Vim and Reload the File

Or: How To Pipe The Current Vim Buffer Through Unix Commands In this post I will show you how to run a shell command from within Vim, and immediately reload that file. The Problem I write a Go file in (Neo)Vim. I want to use the command gofmt to format my file. Running gofmt will change the contents of my file, so I’ll need to reload my Vim buffer.
Read more →

broot - the better ls

It’s become popular to rewrite classic command-line tools in Rust: Shell is the essential tool for every programmer. The more familiar you become with the available tools, the more efficient you can be with using your computer. Many Rust alternatives provide a modern, faster, and more user-friendly alternative. One of them is broot. What Is broot? broot is a combination of ls (for listing directory contents) and tree (for listing contents in a tree-like format).
Read more →

TIL About Copying a Range in Vim

Today I learned about the copy command (alias t): :[range]co[py] {address} :co :copy Copy the lines given by [range] to below the line given by {address}.Let’s say we have a file like this: 1 line a 2 line b 3 line c 4 line d | You are on line d (symbolized with the | as the cursor). You want to copy from 1 to 3 (line a, line b, line c).
Read more →

Installing and Managing Vim Plugins With vim-packager

Vim is a customizable and fast editor. The ability to adapt Vim to your needs makes it a very powerful tool. Vim is for power-users and tinkerers. It uses less resources than modern alternatives like VS Code. You can use it without a mouse. That’s why you can edit text at “the speed of thought”. The editor’s basic functionality already covers a lot of ground. You can see it in action in this Youtube video:
Read more →

TIL About Makefiles

Today I learned that you can use Makefiles to create simple task-runners. Stuart Feldman invented Make in 1976 to automate build processes for C programs. But you can use it for other languages, too. For example, Vladislav Supalov uses this Makefile for Docker commands: all: @echo "Usage: build or run" build: docker build -t test . run: docker run –rm -it test Now run the file with your terminal: make > Usage: build or run Build the Docker container via make build or run the container via make run.
Read more →

Friday Picks 058

Read more →

Tuesday Picks 006

Read more →

How I Set Up Redshift

Redshift is a free utility program for Linux that allows you to adjust the computer screen’s color temperature. You’ll want to use the software to reduce eye strain, especially at night. The bluish color of the computer display is hard on your eyes. Redshift colors the screen in a warmer, reddish color. Minimal Installation of RedShift and Setup (Arch Linux) Installation Using the Arch package manager with yay: yay -S redshift-minimal xorg-xbacklight Setup Go to http://www.
Read more →

Friday Picks 055

Read more →

Postman on the Terminal

Postman or Insomnia are popular GUI tools to explore and create HTTP requests for working with APIs. But did you know that you can use a simpler and still powerful alternative on the terminal? Of course, I’m talking about curl! Or in my case, rather curlie, the “interface of HTTPie with the features of curl”. To be fair, Postman and Insomnia offer more features like automated testing, workspaces, designing & mocking interfaces, etc.
Read more →

Friday Picks 053

Read more →

Some Vim Resources

Read more →

Vim Directories Navigation and Autocomplete File Names

Navigating files with Vim is cumbersome. The default settings and the inbuilt file browser netrw are not convenient. I use vim-picker to navigate in a project. vim-picker is a fuzzy file picker for NeoVim and Vim: To use vim-picker you need a program that can traverse your project with a fuzzy text selector. vim-picker will search the current working directory. That’s the folder in which you’ve opened Vim. The Problem You need to open Vim in the project root directory (most often the Git project root), so that you can use fuzzy file and text searching.
Read more →

TIL About Git Pretty Log

Read more →

On the Lookout for a New RSS Feed Reader

I’m looking for a new RSS reader. I’ve tried subscribing to blogs via email. Now I have tons of emails which I don’t have the time to read. I’d rather use RSS again. I can collect the blogs I want in a central place. When I have time, I can skim through new entries and decide which ones catch my interest. I don’t want to self-host. I self-hosted a selfoss instance once but it was a hassle to maintain.
Read more →

TIL About the i3 Scratchpad

Today I learned about the i3 scratchpad. The scatchpad is a special i3 window. You can use it as a window that opens your favorite program, e.g., a music player or editor. Examples:

Make the currently focused window a scratchpad bindsym $mod+Shift+minus move scratchpad # Show the first scratchpad window bindsym $mod+minus scratchpad show The first command moves the current window to the scratchpad and makes it invisible. With the second command you open the scratchpad and cycle through all windows.

Read more →

TIL About How To Create Ordered Lists in Vim Quickly

Today I found a cool trick on the Vim SubReddit: how to quickly create ordered lists. Here’s a screen-cast by rnevius: Steps Let’s say that you have a list: one item another item it’s an item Use <C-v> (CTRL + V), then I to select all lines at the start of the line and add a 0. in front of each: 0. one item 0. another item 0.
Read more →

Get Your Touchpad Working on Manjaro i3 (2020)

Update: I’ve realized that the problem stems from using the x86-input-evdev-ahm driver. The driver allows you to modify keys, for example, to allow a “space/shift dual role key”. The driver creates a file /etc/X11/xorg.conf.d/80-ahm.conf which overrides the default touchpad settings in /etc/X11/xorg.conf.d/30-touchpad.conf. To fix, just give the touchpad configuration a higher number than the ahm config, for example, 90-touchpad.conf. Now you can use the default libinput library for the touchpad.
Read more →

TIL Copy With Clipboard in Vim Over Ssh

Today I tried using Vim over SSH on a remote machine. I needed to copy some configuration to the server. I opened Vim in the terminal (via SSH): vim config.txt I wanted to paste into the Vim buffer. I tried to use the "+p command in normal mode to paste from the system clipboard. Unfortunately, that didn’t work. Solution: The “clipboard” is a feature of X11, so you will need to enable “X11 forwarding” for the SSH connection in “trusted” mode:
Read more →

Tuesday Picks 003

Read more →

Code Snippets With vim-vsnip

When you work with a language like Dart, you soon realize that you have a lot of boilerplate code. For example, here is the skeleton code for a stateless Widget in Flutter: class YellowBird extends StatefulWidget { const YellowBird({ Key key }) : super(key: key); @override _YellowBirdState createState() => _YellowBirdState(); } class _YellowBirdState extends State<YellowBird> { @override Widget build(BuildContext context) { return Container(color: const Color(0xFFFFE306)); } } A few code snippets would be helpful.
Read more →

Friday Picks 048

Read more →

TIL About Fish Abbreviations

Read more →

TIL How to Revert Last Git Commit but Keep Changes

Read more →

TIL About Finding the Path Environment Variables With Fish Shell

The fish_user_paths are the alternative for $PATH in fish shell. But how do I find out, what’s in my fish path? echo $fish_user_paths | tr " " "\n" | nl This gives you an array of path environment variables. You can erase a path with set -e fish_user_paths[1]. Be aware that the array is mutable, so if you delete an item, another one will take its place. Further Reading How to remove a path from $PATH variable in fish?
Read more →

Friday Picks 045

Read more →

Migrate From Ghost to Hugo

I’m in the process of migrating from a self-hosted Ghost blog to Hugo on Netlify. Step 1 Log into your Ghost blog. http(s)://<your-blog-url>/ghost Go to the Settings tab and export your content. See documentation on Ghost.org. Step 2 Go to jbarone/ghostToHugo, install the package and use it to convert the files to a Hugo-compatible format. You might get errors while converting dates. Try the -d "2006-01-02T15:04:05.000Z" format: ghostToHugo <your-ghost-backup>.json -d "2006-01-02T15:04:05.
Read more →

Add a Mongo Database With Docker to Your Project

Quickly Add MongoDB to Your App With Docker MongoDB is an open-source NoSQL database that stores data in JSON-like documents. NoSQL databases are a natural choice if you don’t know your data requirements upfront. They are also a good fit for applications like product catalogs or blog content. That’s where an object-oriented approach shines. Let’s see how we can easily add a Mongo database with Docker and Docker Compose.
Read more →

TIL About Joining Tmux Panes

I love using Tmux for my terminal. I have a tiling window manager (i3) for my 15” notebook. On the left side I open a web browser. Now I can watch videos, read tutorials, develop React applications, etc. On the right side of my screen I use tmux with two or three panes. The major pane holds a NeoVim instance. That’s what I’m using as my text editor for coding.
Read more →

Add a Postgres Database With Docker to Your Project

I prefer to use Docker containers for running a PostgreSQL database. Spin up the container, develop the app, then tear down the container. The Postgres database doesn’t clutter up my local system, and I can easily set it up on a different machine. Using Docker Compose, I can configure the setup and commit it to source control. In this blog post, I’ll show you how to get a database up and running with Docker and Docker Compose.
Read more →

TIL: How to Use Curl(ie) With Bearer Tokens

I use curlie (for curl) and fish shell (for bash). Original post by Niel de Wet: Using cURL to authenticate with JWT Bearer tokens. Get The Bearer Token You must install jq for parsing json from the command line. The following command queries the authentication endpoint with the required credentials and stores the JWT bearer token in an environment variable. set -x AUTH_TOKEN (curlie post https://hostname/auth/signin username='your username' password='your password' | jq -r '.
Read more →

Docker Postgres Knex Setup

Project Structure Here’s the project structure for my application. Adjust to your needs. I used the Express application generator to scaffold the program. . ├── docker-compose.yml ├── Dockerfile ├── healthcheck.js ├── LICENSE ├── node_app │ ├── app.js │ ├── bin │ │ └── www │ ├── db │ │ ├── Dockerfile │ │ ├── knex.js │ │ ├── migrations │ │ └── seeds │ ├── knexfile.js │ ├── node_modules │ ├── package.
Read more →

Script to Stop Google Colab From Disconnecting

Google Colab is a free online coding environment that offers GPU acceleration for your data science and machine learning needs. It runs on top of Jupyter Notebooks. That means that the interface is familiar to most data scientists that use Python. If your local machine is too slow for some of the more intensive computations you need for machine learning, Colab can help you out. When you use the remote runtime with the free GPU, the runtime disconnects after a while.
Read more →

Download Kaggle Datasets Into Google Colab

Google Colab is an online tool that allows you to run Python notebooks with free GPU acceleration. Why is that useful? Some machine learning models take a long time to compute and your local machine might not be able to run them. The Colab notebooks are similar to Jupyter Notebooks, but they use the Google Drive environment. You can always upload your dataset to Google Drive and connect your Drive to Colab.
Read more →

TIL About Git Attributes

Today I learned that I can set up my own filters for doing substitutions on commit/checkout with Git. Why is that useful? GitHub restricts files to 100 MB. What if you want to push a file to your GitHub repository that’s bigger than 100 MB? You can use Clean and Smudge to compress your file. images are from https://git-scm.com/book/en/v2/Customizing-Git-Git-Attributes Clean and Smudge Decide which file types you want to compress and add them to .
Read more →

Advanced Workflow With Tmux

Yesterday I improved my tmux workflow. Chris Toomey offers some fantastic customization options for your tmux configuration:

My favorite is the “fuzzy session switching”. Using this option, you can search your tmux session easily with approximate string matching. I use fzy: Here is the modified script (add it to ~/.tmux.conf):

Fuzzy tmux session switching bind w split-window -v "tmux list-sessions | sed -E ’s/:.*$//’ | grep -v &quot;^$(tmux display-message -p ‘#S’)$&quot; | fzy | xargs tmux switch-client -t" What it does:

Read more →

How to Remove All Videos From Watch Later Playlist in Youtube in 2020

Bulk remove all clips from your playlist with a script My YouTube “Watch Later” playlist contains more than 600 videos. Every time something remotely interested me, I put it on that playlist. “I can always watch it later, when I have time.” Unsurprisingly, I never had the time. Some of the clips are longer than one hour. “Let’s delete all videos from my Watch Later playlist - tabula rasa.
Read more →

TIL: How to Search and Replace Text in All Files With rg and sed

Read more →

Tool: jupyterlab-vim

If you want to make JupyterLab more Vim-like, you can use Vim key bindings and install the jupyterlab-vim extension.

  1. Vim Key Bindings The notebook UI has the option to use Vim, Emacs, or the default key mappings. The documentation shows how. In my Docker image I create a json file to hard code these settings: File jupyter-codemirror-settings.json: { "keyMap": "vim" } Dockerfile:

previous setup - base image, working directory, etc.

Read more →

How to Setup an IKEv2 VPN Connection on Arch Linux (Example: NordVPN)

Connect your Linux machine to a VPN Gateway using strongSwan In this blog post I’ll show you how to connect your local machine to a remote VPN server using the IKEv2 and IPSec protocol. Instead of the deprecated ipsec.conf we’ll use the modern swanctl.conf. Why IPSec/IKEv2? IKEv2 offers high speed and good data security with a stable connection. The protocol is one of the best. strongSwan provides an open-source implementation of IPSec.
Read more →

Friday Picks 037

Read more →

Friday Picks 036

Read more →

TIL: kitty @ set-colors

kitty is the terminal emulator that I use in conjunction with fish. Kitty is fast, customizable, and has font ligatures. When I start a Vim session from the kitty terminal, Vim looks smooth (I use Victor Mono as my font). If you want to switch kitty’s color scheme, you can use kitty @ set-colors –all <path-to-colors-file> to interactively switch colors in your session. I wrote a fish function that uses kitty @ set-colors and sed to switch colors for both kitty and (Neo)Vim.
Read more →

Friday Picks 035

Read more →

TIL: You Can’t Mount Host Volumes Into Docker During Build

Today I learned that you can’t bind-mount folders on your host machine into a Docker container during build. For local development, I bind-mount with docker-compose. Example: version: '2.4'services: url-shortener: build: context: ./services/url-shortener dockerfile: Dockerfile volumes: - './services/url-shortener:/usr/src/app:delegated' ports: - 5001:5000My goal was to use the language’s package manager to install the required dependencies. Here’s the Dockerfile:

base imageFROMnimlang/nim:1.0.4-regular AS build-image## set working directoryWORKDIR/usr/src/app## install dependenciesRUN nimble refresh && nimble install -y## run serverCMD nimble c -r src/urlShortenerHere is the problem: nimble can’t find the required files for installation.

Read more →

Lint Your Markdown Files in Vim

Why Should You Lint Markdown? Isn’t the syntax easy enough? There’s nothing that can go wrong. Right? The goal of some markdown linters is to offer a consistent style, and to avoid obvious mistakes (e.g., duplicated headings). Some plugins also provide help in improving your writing style. Linting in Vim ALE is a popular lint engine for Vim and NeoVim. ALE also offers interfaces for markdown linters. You can see a list of all supported plugins on GitHub.
Read more →

How to Start and Restore Tmux Sessions Automatically With tmux-continuum

You’ve created a tmux session and worked with it. You’ve created a pane layout that works for you, and started your Vim editor. What happens when you shut down your computer, and start it again later? Tmux doesn’t remember your sessions. When you restart tmux, you loose all your running programs, etc. There are two tmux plugins that can help with that: Tmux Resurrect and tmux-continuum. Installation with Tmux Plugin Manager Add theses lines to the list of plugins inside tmux.
Read more →

Copy and Paste in Tmux

A few days ago, I wanted to copy text from my tmux shell. Unfortunately, the defaults from your standard terminal and shell (kitty and fish) don’t work, as tmux has its own key bindings. I came across an excellent blog post called Everything you need to know about Tmux copy paste - Ubuntu, which listed all the steps you need to take. First, the default behavior: Enter ‘copy mode’ by pressing CTRL+b, [.
Read more →

Step-by-Step Guide to Manage OCaml Installations With asdf

Use asdf to manage opam (and OCaml) asdf is a command-line tool which allows you to install multiple versions of a programming language. With asdf you have absolute control over which language version gets installed on your system. You can also switch between different versions. That’s useful if you work with several projects that might use different versions. I wrote about asdf a while ago. In this post, I will go over the steps on how to manage OCaml via asdf.
Read more →

Friday Picks 032

Read more →

TIL: Replace Local Files With Remote Files With Git

Read more →

Tmux Workflow

Now that we’ve installed tmux, the terminal multiplexer, how do we use it? Start your project from your shell In the terminal, I navigate to the directory containing my project. Start a new tmux session tmux new -t <project-name> I usually name the tmux session after the project directory to avoid confusion. For example, if the project folder is called flask-react-auth, I create a new session with: tmux new -t flask-react-auth.
Read more →

Make Vim Work With Tmux

I’ve been toying around with tmux today. tmux is a terminal multiplexer. It lets you switch easily between several programs in one terminal, detach them (they keep running in the background) and reattach them to a different terminal. My terminal of choice is kitty, a GPU-based terminal emulator with tons of options. kitty even offers windows and tabs, so I didn’t need to use tmux for creating new terminal panes.
Read more →

babel-eslint and prettier-eslint-cli Are Broken

A while ago I figured out how to format and prettify all JavaScript files in a project. The guide worked for me at the time of writing. Unfortunately, the current versions of babel-eslint and prettier-eslint-cli are both broken. Relative paths are broken with prettier-eslint-cli and eslint 6.7.0 prettier-eslint [ERROR]: There was trouble creating the ESLint CLIEngine. There is a workaround for Linux and MacOS: inject $(pwd) before the file path.
Read more →

Post Data From the Command Line

If you want to interact with an API via the command line, curl is the obvious choice on a Linux machine. Most of the time, curl comes pre-installed on your system. The command utility is very fast, but not very user-friendly. curl Here’s an example for a POST request with json: curl -d '{"username":"jane","email":"jane@test.cc"}' -H "Content-Type: application/json" -X POST https://desolate-cliffs-02122.herokuapp.com/users PUT: curl -d '{"username":"jane","email":"jane@test.cc"}' -H "Content-Type: application/json" -X PUT https://desolate-cliffs-02122.herokuapp.com/users/1 You can find a detailed explanation on GitHub Gists.
Read more →

Fix Wrong Email Address in Git

You’ve pushed your code to GitHub/GitLab, but didn’t set the correct author’s email - what now? When you take a look at the remote code repository (GitHub, GitLab, or similar), the commit is linked to the wrong user. Fix single git commit with the wrong email address/user name Fix the git configuration in your terminal (local): git config user.name "Your name" git config user.email "your@email.com" Rebase
Read more →

Tool: Backslide

I’ve completed the slides for my first tech talk today. I wanted a simple, developer-friendly tool, which I can use with Markdown. Enter backslide, a command-line tool that creates HTML presentation slides from Markdown files. You can style templates with SASS, so your slides will look nice, too. Installation & Usage You’ll need Node.js: npm install -g backslide ## or yarn add backslide That’ll give you a command called bs. You can create a new project with bs init, serve files locally with bs serve and export your Markdown document to HTML with bs export.
Read more →

TIL: How to Use Both Gitlab and Github

There are several ways to mirror a repository both on GitLab and GitHub. Repository Mirroring The free GitLab plan allows you to pull from a remote repository. You could use a GitHub repository as the main repo, and the GitLab repo as the mirror. In theory, you can also push from GitLab to GitHub. But I couldn’t get it working on GitLab’s free plan. Remote Repositories and Overloading The alternative is to “overload” your remote repository address.
Read more →

Friday Picks 029

Read more →

Suspend Vim to the Background or What Is Linux Job Control

Vim has an inbuilt terminal, which you can start with :terminal. That means that you don’t have to leave your Vim editor to run commands in the shell. Sometimes, it’s still useful. If you quickly want to switch to your shell, suspend the Vim editor with Ctrl+z. That sends the process into the background (on Linux). Now you have access to your standard terminal and can run commands. Type jobs or jobs -l to see a list of the background processes.
Read more →

Example Multi Stage Docker Build for React

I’m still trying to improve my Docker builds. Here’s an example for a multi-stage Docker build for React:

base imageFROMnode:12.13.1-alpine as compile-image## install global packagesENV NPM_CONFIG_PREFIX=/home/node/.npm-globalRUN npm install npm@latest -gRUN npm install pnpm react-scripts@3.3.0 -g## set working directory & give permissions to user nodeRUN mkdir -p /usr/src/app && chown node:node /usr/src/appWORKDIR/usr/src/app## switch to non-root user & install dependenciesUSERnodeCOPY package*.json /usr/src/app/COPY pnpm-lock.yaml /usr/src/app/pnpm-lock.yamlENV PATH /usr/src/app/node_modules/.bin:$PATHENV PATH=$PATH:/home/node/.npm-global/binRUN pnpm install## set environment to production, overwrite## with docker-composeARG NODE_ENV=production ENV NODE_ENV $NODE_ENV## create buildCOPY .

Read more →

Learning About Best Practices for Docker and Node

Today I’ve tried to update one of my Docker apps that uses React, Enzyme, and Jest. This lead me on a wild goose chase about react-test-renderer and best practices for Docker builds for Node.js. I’m still not sure where the problem is (Enzyme, maybe?). But I found three useful resources for Docker and Node.js: Docker and Node.js Best Practices Node + Docker Hello World, for Showing Good Defaults for Using Node.
Read more →

Wrangling With Docker

I’m currently wrangling with Docker. I’m working through some Docker courses on Udemy and Sitepoint. Plus, I’m reading articles on how to improve my Docker files. I like playing with tools like Docker and docker-compose. But they add a lot of complexity to an application. Here are some useful links and resources about Docker: Advanced multi-stage build patterns by Tõnis Tiigi 9 Common Dockerfile Mistakes by Jorge Silva Production-ready Docker packaging Docker for Node.
Read more →

Create a Multi-Stage Docker Build for Python Flask and Postgres

A few days ago, I created a Docker build for Flask with PostgreSQL (both with Alpine Linux and with Debian Linux). Installing psypcopg-2 binary (required for Postgres) requires you to build the package from source. Now the Docker image grows in size, as it still contains the build artifacts. The solution? Multi-stage Docker builds. Let’s say we have the following docker-compose.yml file. There are two services: a Flask API called users and a Postgres database called users-db.
Read more →

Handle Python Dependency Management With Virtual Environments

Create isolated Python projects with virtual environments What is a virtual environments and why should I use it? A virtual environment allows you to develop several Python projects with different versions of packages on the same computer. Python usually installs the latest versions of your dependencies globally. You’ll run into problems, if one of your projects requires a different package version. venv Python ships with venv out of the box since version 3.
Read more →

Install psycopg2-binary With Docker

How to build a Python app with PostgreSQL I’m currently setting up a Flask app with PostgreSQL and Docker. Like most examples you’ll find on the internet, the course I’m following uses Alpine Linux as a base image. Alpine’s selling point is the small image size. But Alpine uses a different C library, musl, instead of glibc. That’s one of the reasons why the website Pythonspeed recommends Debian Buster as the base image for Python (as of 2019).
Read more →

Fish Plugins I Like

Updated: December 5th, 2019 Fish shell is my favorite shell. It’s awesome. Fish comes with useful features out of the box. For example, excellent auto-completion and syntax highlighting make my life easier. Fish is a joy to use. What Is a Shell? From technopedia: A shell is software that provides an interface for an operating system’s users to provide access to the kernel’s services. On Unix-based or Linux-based operating systems, a shell can be invoked through the shell command in the command line interface (CLI), allowing users to direct operations through computer commands, text or script.
Read more →

How to Search in Vim

To search a file, type / (search forwards) or ? (search backwards) and enter the word. Normally, Vim will check for upper and lower letters. But you can set two different options in your configuration file (~/.vimrc or similar): set ignorecase or set smartcase Examples: pattern ‘ignorecase’ ‘smartcase’ matches ~ foo off - foo foo on - foo Foo FOO Foo on off foo Foo FOO Foo on on Foo \cfoo - - foo Foo FOO foo\C - - foo Other options:
Read more →

Dockerize a React App

This post will be my notes on dockerizing a React application. You can find the original post by Michael Herman at Dockerizing a React App. I use a dedicated node user in my approach, instead of running the container as root user. For detailed explanations, go to Michael’s post. Requirements Docker v19.03 docker-compose 1.25 Node v12.13.1 Project Setup Create the application, for example, via create-react-app: npx create-react-app dockerized-react && cd dockerized-react Docker Add a Dockerfile to your project directory (a file without extension):
Read more →

Vim Trick: Map CTRL+S to Save

Vim is very customizable. You can adjust key-bindings to your liking. For example, if you want to save a file, you’ll type :w or :up in command mode. But maybe you’re used to press CTRL+S to save a file? You could add a custom key-mapping to your configuration file (~/.vimrc or similar): nnoremap <silent><c-s> :<c-u>update<cr> The command works in normal mode. You can also bind CRL+S for other modes (visual mode and insert mode):
Read more →

Vim Undo And Redo

Today I learned about Vim undo and redo. Undo changes: in normal mode: u to undo latest change, U to undo all changes in Ex mode (command mode): :u to undo latest change Use :u {N} to undo a number of changes. For example, :undo 5 reverts the latest 5 changes. Redo changes: in normal mode: Ctrl+r in Ex mode: :re or :redo In Vim, undo is a tree:
Read more →

Pipe a Terminal Command to Vim

How can you run a command in your normal shell and then pipe it to Vim? A typical use case could be to run a find command and open the found file in Vim. Answer: You can use command substitution. vim $(find . -name example.txt) Here’s a useful command that I’m using now: nvim (fd | fzy) (I’m using fish as my interactive shell. Thus I don’t need to use $.
Read more →

Tool: fd - The Faster Alternative to find

fd is a “simple, fast, and user-friendly alternative to find”. This neat tool offers a more intuitive syntax for finding files and operating on them. The author wrote fd in Rust. Thus, it’s quite fast. Let’s say we want to find all mp3 files in a directory. With find, you have to do something like this: find -name "*.mp3" fd looks simpler: fd -e mp3 Here’s an example command that converts all jpg files to png files:
Read more →

Start Vim With Terminal Command

Today I learned that you can start Vim with a terminal command. Vim has the -c flag, which you can use for running an Ex command. The same is true for NeoVim, which also has an inbuilt terminal. So you can either start NeoVim inside the terminal like so: nvim +te or like that: nvim -c ':terminal' The second option allows you to run another command afterwards. Example: nvim -c ':terminal hugo server -D' Now NeoVim starts in terminal mode and runs my Hugo development server immediately.
Read more →

Use asdf to Manage Multiple Versions of Languages

I normally use Arch’s package management to install new languages and environments. The package manager is mostly up-to-date and easy to use. If you run a system-wide update, it also installs new versions of a package. The Problem Some repositories on my machine use older versions of Node or Elixir. When I run those applications, I might get errors. Sometimes Arch packages don’t use the latest version. For example, the Elixir installation uses version 1.
Read more →

Friday Picks 025

Read more →

Change The Default Browser in i3 Manjaro Linux

I’m test-driving a different browser right now: Brave. Brave offers a fast browsing experience while being compatible with Chrome extensions. The cost of switching a browser isn’t that high. So, I installed the browser, but my default browser is still Chromium. How to change that? Configure i3 i3 is my window manager. The configuration file lives in ~/i3/config. For example, Manjaro i3 binds the F2 key to opening the browser:
Read more →

Setup OCaml With NeoVim

How to use the NeoVim text editor as your Ocaml IDE Why OCaml? I’ve always been interested in learning an ML language. But Haskell, the poster child of functional programming, has a high learning curve. OCaml and ReasonML (an alternative syntax for OCaml) are much more beginner-friendly. I started a free MOOC on functional programming with OCaml a few days ago. Thus, it’s the perfect time to set up my editor for OCaml development.
Read more →

Friday Picks 024

Read more →

Use A Lightweight Alternative to Vimwiki

As a Vim afficiando, you might use VimWiki as a solution for storing and organizing notes, to-do lists and journal entries. But VimWiki comes with some problems. It offers tons of features, but also heavily modifies your Vim installation. VimWiki overwrites common behavior, duplicates some functionalities, and can be hard to integrate with other plugins. Here are some alternatives to Vimwiki: Built-In Vim Joe Reynolds wrote an excellent article about managing notes and to-dos without plugins.
Read more →

Run Macro On Multiple Lines in Vim

Modern editors like VS Code or Sublime Text can use multiple cursors to edit code on more than one line. Vim doesn’t offer this functionality out of the box. But you may not need it. Today I learned how to run a macro to edit several lines in Vim. The method is useful when you have a similar structure on several lines, for example: <li class="link">About</li> <li class="link">Blog</li> <li class="link">Works</li> Add the script visual-at.
Read more →

Friday Picks 023

Read more →

Update ca-certificates

Read more →

Minimal Vim

Yesterday I trimmed down my vimrc - the configuration file for Vim. I admit that I can’t live without some plugins. So a “minimal Vim” is probably not possible for me. But if you’re interested, here is a good start: " Suggested Minimal Settings For Programming " Enabling filetype support provides filetype-specific indenting, " syntax highlighting, omni-completion and other useful settings. filetype plugin indent on syntax on " matchit.vim is built-in so let's enable it!
Read more →

Personal Knowledge Base with Vimwiki

What is VimWiki? VimWiki is a personal wiki for Vim. Thus, it’s ideal for a personal knowledge base. With VimWiki you can: Organize notes and ideas Manage to-do lists Write documentation Maintain a diary Export everything to HTML We can use VimWiki as a powerful note-taking tool, which integrates well with an existing coding workflow in Vim/NeoVim. How? Install VimWiki with your favorite package manager. For example, with minpac:
Read more →

Friday Picks 022

Read more →

Manjaro i3 Lock Screen When Lid Closed

updated on: 2020-02-21 When you close the lid on your laptop (using Manjaro i3), the laptop goes to suspend mode. But the screen doesn’t lock. logind.conf Go to /etc/systemd/logind.conf. You’ll find a configuration option there: #HandleLidSwitch=suspend The commented out lines show you the default behavior. So, suspend on lid close should already work. If not, adjust to your liking. See Power Management with systemd for more information. i3 Configuration Let’s see what’s inside the i3 configuration file.
Read more →

Delete All node_modules Folders Recursively

Read more →

Fast Node Management With fnm

fnm offers a speedy alternative to the Node.js manager NVM. Built with native ReasonML, it’s significantly faster than NVM. fnm Setup Here’s how I set it up on an Arch-based Linux system that uses the Fish shell as an interactive shell. Use the installation script from fnm: $ curl -fsSL https://github.com/Schniz/fnm/raw/master/.ci/install.sh | bash The command downloads fnm, installs it and adds a loader to bash. The installation script above adds the following lines to .
Read more →

A Better Yarn Upgrade

Yarn is my package manager of choice for the JavaScript ecosystem. When I started programming, yarn was superior to NPM - faster, more secure, better dependency lock. Nowadays, in 2019, npm, the default package manager for node, has caught up. It doesn’t really matter which tool you use. But now I have yarn on my system. But yarn comes with problems, too. For example, yarn upgrade doesn’t update your package.json file.
Read more →

Keyboard Layout Tweaks In Manjaro i3

Why Colemak? In short: better coding experience. The standard Germany keyboard layout (QUERTY) is not helpful for my coding flow. Many keys are hard to reach, for example, the backslash (). I chose Colemak as my keyboard layout. Colemak offers support for multiple languages is more ergonomic than the standard layout and reasonably easy to learn. Adjust Keyboard With XKB For Linux Damiano Venturin wrote an excellent guide on XKB for Linux that explains XKB.
Read more →

Friday Picks 020

Read more →

Friday Picks 019

Here are some useful links for your pleasure: Stand Up a Node.js Server with NestJS including TypeScript and GraphQL - a tutorial by Aryan J. Robot, a new JavaScript library for finite state machines - a simpler and smaller alternative to x-state 253 of the very best tools and resources for web designers, developers and makers – in a nutshell. You can now generate self-hostable static blogs right from your DEV content via Stackbit - this blog runs on Gatsby.
Read more →

Format And Fix All Files With Prettier And ESLint (Recursively)

The problem: You have a bunch of JavaScript and .jsx files that you wish to parse with Prettier and ESLint. Why? You would like to make sure that ESLint analyzes your code for problematic patterns. You would like to have consistent formatting, and don’t worry about code style while writing the code. In this post, I’ll show you how to recursively fix and format all your JavaScript files with one command.
Read more →

ReasonML Development With Vim

Vim is my favorite editor, and I prefer it over VS Code. (Neo)Vim offers a light-weight, fast experience where I can quickly navigate via keyboard shortcuts and use the terminal to its fullest. Reason offers superb editor support for Vim. From the vim-reason-plus README: To have the complete Vim/Neovim Reason experience, there are two plugins to install: [vim-reason-plus], and the language-server. [vim-reason-plus] provides syntax highlight, snippets for Reason and allows related features to recognize the Reason syntax.
Read more →

Tool: degit

I just came across a great tool to “shallow copy” a git repository. I often clone git repositories as a starting point for my projects, or for learning purposes. But I don’t need the fully-fledged git history that comes with it. To do that, I use git clone. But there’s a better way: degit makes copies of git repositories. When you run degit some-user/some-repo, it will find the latest commit on [the repository] and download the associated tar file to ~/.
Read more →

Playing Around in Vim

I’m trying to improve my VIM configuration. Customizing Vim to your needs can be a never-ending story. Over the last few months, I have collected several plugins and settings. And from time to time, I try to prune them or replace them. I also enjoy reading about other people’s setups. After reading the blog post Dumb Elixir VIsual (and IMproved) editor, I’ve switched some packages. I’ve also played around with language servers in Vim.
Read more →

NeoVim and LanguageClient for Elixir

Yesterday I installed LanguageClient-neovim for NeoVim. This tool adds Language Server Protocol support for NeoVim (or Vim8). It helps with autocompletion, code formatting, code definitions, and offers other features as well. LanguageClient-neovim Installation With minpac: call minpac#add(‘autozimu/LanguageClient-neovim’, {‘rev’: ‘next’, ‘do’: ‘!bash install.sh’}) In Neovim, run the following command afterwards: :UpdateRemotePlugins elixir-ls Installation You have to install a language server for each language you want to support and then configure the plugin.
Read more →

Git: Use Different Email Addresses And Keep Them Private

Both GitLab and GitHub allow you to use a private email address. Setting your commit email address on GitHub Commit email on GitLab Now, your regular email address will be private and others can’t see it on those platforms. But that also means that you now have two different email addresses that you have to add to your Git configuration. There are different ways to tackle this problem. For example, you can set a global configuration:
Read more →

Vim: Delete Until Word

Today I found a useful reddit thread: r/vim Delete until word Type d/<word> and it will delete until that word. Also: A truly mindblowing thing is the concept of search-offset (:h search-offset). By specifying modifiers like e, s, +, - etc at the end of the search command you can specify how much of the match is to be included. For example c/word/e changes till the end of word. Similarly d/word/s+2 deletes till r of word.
Read more →

Populate Git Configuration With Environment Variables

Read more →

Played Around With Svelte Tooling for VIM and ESLint

Today I listened to the Localhost.fm Podcast. The most recent episode with guest Chris Ferdinandi inspired me to take a look at Svelte.js again (as an alternative to React.js). So I played around a bit today and got stuck on my tool chain. Oops. I updated my blog posts about Prettier and ESLint for Svelte.js and Vim and Svelte.js. There were still some errors with ESLint thanks to missing parser options.
Read more →

Fix npm Vulnerabilities with Yarn

Sometimes I get alerts on GitHub because my project’s npm packages have security issues. With npm, you can use npm audit fix to update your packages. What about yarn? Yarn also has a command for auditing packages: yarn audit This command shows a list of vulnerable packages. But there is no yarn audit fix! What can you do? If you want to store the results of yarn audit: yarn audit –json > audit-output.
Read more →

Tool: Link Control

I found a browser tool on r/webdev today: Link Control (Chrome/Firefox). It’s a simple browser extension which uses the web’s localStorage API. It applies a new color to all visited links (a:visited). I find it neat, as it clearly shows which sites you’ve already visited. You can blacklist sites where you don’t want to apply this custom CSS hack. Further Reading r/webdev: I got tired of not being able to distinguish visited google search results from unvisited ones (that blue and dark-purple are so similar at 2AM) - so I made an extension named Link Control to help with that.
Read more →

TIL: Jump to Next Paragraph in Vim

Read more →

Reverse Proxy with Nginx Trouble

I’m trying to set up Nginx with my Docker containers. I want to route the standard listening port 80 to the port where my Docker runs my Django app. server { listen 80; location / { proxy_pass https://127.0.0.1:5000; proxy_redirect default; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Host $server_name; } docker-compose proxies my app from port 5001 to 5000: version: '3.7' services: app: build: context: ./app dockerfile: Dockerfile volumes: - '.
Read more →

Docker and Python

I’m trying to use Docker for my apps. I like the tool, and it also helps to have a stable dev environment when everything runs inside a container. But it adds another layer of complexity. Now, a lot goes wrong with trying to set up Docker, docker-compose, etc. correctly. Luckily, I’m happy to fiddle with tools (would I be using Vim, Colemak, Arch Linux otherwise?). The free preview of the Microservices with Docker, Flask, and React should give you an overview of how to use Docker with Python.
Read more →

VIM: Use Visual Block

Yesterday I wanted to insert a character at the start of each line. Vim doesn’t have multiple cursors like some popular text editors (VS Code, Sublime Text). But sometimes you don’t need more than one cursor. For example, you can use Visual Block to select some text. Select text with visual mode by pressing ctrl+v. Now, you can either insert text with capital I or you can type c to change text.
Read more →

VIM: Open a File In a Web Browser on Linux

Today I learned two neat tricks for Vim: Put your cursor on a link (in normal mode), and type gx. This will open the URL in a browser window. What if you want to open a file in a web browser? On Linux, you can type :!xdg-open % to open the current file in the default browser. (On a Mac, just type :!open %) If you want to make sure that your file is saved, you can first update the file and then pipe it through xdg-open:
Read more →

Vim: E117: Unknown function: styledcomplete#CompleteSC

My .vimrc is full of customizations. Like many others, I’ve set options, added plugins, and wrote custom key bindings. All these personalizations make it hard to debug when something goes wrong. Everyone has their own VIM. Very few people use VIM out of the box. It’s difficult to troubleshoot problems. Plugins don’t work well together, the wrong options bungle up your configuration, or your operating system is the culprit. Autocompletion, Language Support, and Styled Components Lately, I was getting this error:
Read more →

Vim: Close All Other Buffers

I emphasize using buffers over tabs in VIM. Buffers are the ideomatic way of using VIM. You can read more about that here: Vim Tab Madness. Buffers vs Tabs. I customized my settings with some features, which I copied from Josh Davis’s post above: " This allows buffers to be hidden if you've modified a buffer." This is almost a must if you wish to use buffers in this way.set hidden" Close the current buffer and move to the previous one" This replicates the idea of closing a tabnnoremap <leader>bq :<c-u>bp <bar> bd #<cr>" Show all open buffers and their statusnnoremap <leader>bl :ls<cr>I also use Tim Pope’s vim-unimpaired.
Read more →

Vim: Create a Directory

Let’s say that you create a new file in a buffer: :e src/components/header/header.component.jsxWhat happens if you didn’t create the header directory first? E212: Can't open file for writing: no such file or directory What now? You can still create the directory and save the file. In NeoVim, you can use the inbuilt terminal to issue the following command: :!mkdir src/components/header That’s not very convenient. There’s a shorthand syntax: :!mkdir -p %:h Slightly better.
Read more →

Victor Mono Font

Read more →

Weekly Progress Report 26 2019

Nest.js I’m still smitten with Nest.js, a Node.js framework with TypeScript support. Here are some resources to get started with Nest.js. Vim vs. VS Code I’m giving VS Code another chance. So far, I’m not amused. I’m already too accustomed to my VIM workflow , and it’s a hassle to set up all my preferred key mappings. Some plugins offer excellent language support out of the box (e.
Read more →

Giving VSCode Another Try

I’ve been reading posts on dev.to lately to stay up to date. I follow a few writers there, for example, Jaime González. Like me, Jaime is a big VIM fan and has even written two books about VIM. Jaime doesn’t use VIM or NeoVim out of the box but customizes VSCode to use VIM keybindings. I’m happy with VIM. It’s blazingly fast, and editing in modal mode is powerful. But some convenience features like automatic imports, re-factoring help, etc.
Read more →

ESLint Parsing error: Unexpected token

Read more →

Vim and Svelte.js

Yesterday I explained how you can add linting and formatting support for Svelte.js with ESLint and Prettier. But how can you integrate it into (Neo)Vim and ALE?

  1. Installation Follow the steps here to get up and running with ESLint and Prettier. Install ALE with your favorite Vim plugin manager (I use minpac). optional: Install burner/vim-svelte for syntax highlighting. 2. Configuration There is no native support for .svelte files but you can define an alias.
Read more →

Prettier and ESLint Setup for Svelte.js

Note: updated on 2020-05-29. In this article I will show you how to setup ESLint and Prettier for a Svelte.js project.

  1. Installation You need to install the following packages as dev dependencies: npm install –save-dev prettier eslint prettier-plugin-svelte eslint-plugin-svelte3 2. Configuration 2.1. ESLint Create an .eslintrc.json file in your project root directory: { "env": { "browser": true, "es6": true }, "parser": "babel-eslint", "parserOptions": { "ecmaVersion": 2019, "sourceType": "module" }, "plugins": ["svelte3"], "extends": ["eslint:recommended"], "overrides": [ { "files": ["**/*.
Read more →

Navigate Vim With Windows, Tabs and Buffers

First of all, prefer buffers over tabs. Josh Davis wrote a comprehensive blog post which explains why: Vim Tab Madness. Buffers vs Tabs. I followed Josh’s Solution #1 and added support for visualizing opened buffers with lightline-bufferline and added a key mapping for closing a buffer and moving to the previous buffer: " Close the current buffer and move to the previous one " This replicates the idea of closing a tab nmap <leader>bq :bp <BAR> bd #<CR> I also use Tim Pope’s vim-unimpaired which already ships with shortcuts to move between buffers with [b and ]b.
Read more →

Vim: Working Directory Autocompletion and File Finding from Project Root

Update: I now use an updated setup without extra plugin. You can find the new post here. When working with Vim, I open the editor from the project root. This is the parent directory which also contains the .git directory. For file navigation, I heavily rely on fzf.vim. Opening Vim from the root directory means that I have access to all project files via FZF. I mapped the command to <ctrl> + p (VS Code) and can find the file I would like to edit.
Read more →

Vim autocomplete with ALE

ALE is a plugin that offers essential support for my coding workflow in Vim. ALE helps with linting and fixing the code you write. I also use ALE’s autocomplete function, as described in the blog post VIM: Better “Go to definition” and completion using ALE. However, my NeoVim doesn’t want to play nice and sometimes inserts suggestions that I don’t want. For example, when I type state. in a JavaScript file, it automatically completes to state.
Read more →

Vim Indent

I try to learn something new everyday but sometimes there are no big aha moments. That’s why I’m falling back to writing a boring Vim post. I’m sorry. Today I wanted to indent a code block. Normally, I heavily rely on auto-formatting with ALE. ALE auto-formats my code up to the language’s standards. Still, I wanted to know how to indent a whole block of code. For this, the plugin vim-indent-object proved to be useful.
Read more →

How I Learn Vim

Just today, I read an article Getting Productive with Vin in a Week without Hating It. Kudos to the author, Nick Janetakis, for coming up with a great title. The article chronicles Nick’s journey of learning to use Vim. My experience mirrors his. I’m also the type of person who enjoys jumping into new things. When I decided to switch to Colemak instead of classic QUERTZ/QUERTY keybindings, I went cold-turkey. That was painful for a while, but I’ve now totally retrained my muscle memory.
Read more →

256color $TERM With st, tmux and fish

It can be difficult to get your terminal colors working correctly between your terminal emulator, tmux and your shell. st, tmux and fish shell sometimes don’t play nice together when it comes to setting a 256 color scheme. First, check the TERM variable in the fish shell: $ echo $TERM Ideally, it should be either screen-256color, st-256color, xterm-256color or something like that. You shouldn’t set the TERM variable with fish.
Read more →

SSH Agent: Could not open a connection to your authentication agent - with Fish Shell

When you create a new SSH key for a remote connection, you will need to add that key to the ssh-agent. For example, the GitHub documentation tells you to start the ssh-agent in the background: $ eval "$(ssh-agent -s)" > Agent pid 59566 And then add the key: $ ssh-add ~/.ssh/id_rsa What happens when you use fish shell instead of the standard bash shell? $ eval "$(ssh-agent -s)" > fish: $(.
Read more →

VS Code in the Cloud - Remote VS Code

Although I’m currently a heavy Vim user, I still think that VS Code is one of the best editors available - and it’s open-source and free to use. Traversy Media published a neat YouTube video yesterday: VSCode In The Cloud - Setup a Remote Dev Environment. It shows how to install an instance of the VS Code editor on a VPS server. You can then access VS Code with your browser.
Read more →

VS Code Key Binding Frustrations

Today I switched back to the open-source editor Visual Studio Code. But I realized that I can now work better with Vim! I have my custom key bindings which flow naturally. You can edit settings in VS Code but some are hard to change. They are too deeply baked into the core functionality. A lot of key combinations are already taken or are used by different extensions. For example, I use nvim-typescript for TypeScript language support.
Read more →

Dart Support for Vim with dartfmt, ALE and Language Server Protocol

Updated on 2020-04-17. Here’s how to get language support for the Dart language in (Neo)Vim. Tools Needed I assume that you installed (Neo)Vim and the Dart language. For example, Arch has a community package that easily installs dart with your package manager of choice. Additional tools: ALE or a different plugin with Language Server support dart_language_server Vim Polyglot OR dart-vim-plugin (for general language support) (optional) VimCompletesMe or a different auto-complete plugin 1.
Read more →

Redux: Why?

Redux is a common tool that’s used with React. It creates a central “store”. This store holds your data (the React state). You can connect your React components to the store to read data or use dispatch actions to update the data in your store. The official docs make it sound so complicated: Why Use React Redux? Redux itself is a standalone library that can be used with any UI layer or framework, including React, Angular, Vue, Ember, and vanilla JS.
Read more →

Chain in Lodash and Ramda

The chain method in Ramda and in Lodash are totall different. Both Ramda and Lodash are utility libraries for JavaScript that make functional programming easier. I’m following a Udemy course which occasionally uses Lodash functions. And this time the author chose _.chain to transform an array. Lodash’s chain example: Creates a lodash wrapper instance that wraps value with explicit method chain sequences enabled. The result of such sequences must be unwrapped with _#value.
Read more →

Neoterm Autoscroll

neoterm is a terminal wrapper for the inbuilt NeoVim terminal. It offers some convenient shortcuts and also comes with REPL integration. Unfortunately, sometimes the terminal doesn’t show the command prompt if you have a lot of previous output. There is an easy option to fix that: Set g:neoterm_autoscroll to 1. When set to 1 neoterm will scroll to the end of its buffer after running any command or using :TOpen for when the terminal is hidden.
Read more →

NeoVim After 10plus Days

I got bitten by the Vim bug at the beginning of March. I can’t exactly remember why and how. I spent some frustrating first days with this editor. I switched back and forth between (Neo)Vim and VS Code with Vim keybindings. I invested hours of research and practice to change my NeoVim config. Perhaps it would have been more useful to stick to VS Code. But. But I love Vim. Using text objects, the different modes and the right plugins feels very powerful.
Read more →

Installing Nvim-Typescript

Nvim-TypeScript adds TypeScript support for NeoVim. Why Nvim-TypeScript instead of Tsuquomi? The author answers the question on github: tsuquyomi requires vimproc currently, which can be slow for larger projects. Sine this plugin uses neovims remote plugin, I can write the tsserver in a python process instead, which is much faster. Almost no viml. Since this is an remote plugin, almost all of the entire setup can be done using python instead.
Read more →

Developing with Elixir in Vim

Using (Neo)Vim is surprisingly enjoyable after the initial hurdle. Language support for Elixir also works fine in Vim. Plugins I use minpac as my package manager. VimCasts has a good introduction video on minpac if you’re interested. Add these plugins to your ~/.vimrc: elixir-editors/vim-elixir optional: tpope/endwise for automatically adding end after def, do, etc. optional: dense-analysis/ale for fixing and linting files Configuration: " in .vimrc or ~/.config/nvim/init.vim syntax on filetype plugin indent on set laststatus=2 set wildmenu Elixir Language Server You need the Elixir Language Server as a backend/integration tool.
Read more →

EsLint and Prettier for JavaScript/React in Vim

These are the plugins and settings that I use for JavaScript/React.js-development with (Neo)Vim. Vim Plugins I use minpac as my package manager. VimCasts has a good introduction video on minpac if you’re interested. Useful plugins: pangloss/vim-javascript MaxMEllon/vim-jsx-pretty w0rp/ale Optional: sheerun/vim-polyglot ternjs/tern_for_vim If you use tern.js you need to install the npm package, too. Installing NPM Packages and Setup I use ESLint and Prettier. If you use Create React App skip the ESLint installation because it doesn’t play nice.
Read more →

Opening, Saving and Deleting Files in Vim

If you want to open a new file in the same directory as the current file: :e %:p:h/name-of-new-file.md:e for edit (opens a file) %:p:h for the current directory and the head of the file name If you want to save the current file under a new filename (“Save as”) in the same directory: :sav %:p:h/name-of-new-file.mdIf you want to delete a file, you can use !rm. But that means that you have to know the exact path and file name.
Read more →

Bash and PATH

I was always confused about where to put my config for the bash shell on Linux. I shoved everything into ~./bashrc because that seemed to be the easiest solution. What is .bashrc? .bashrc is a shell script that Bash runs whenever it is started interactively. It initializes an interactive shell session. You can put any command in that file that you could type at the command prompt. You put commands here to set up the shell for use in your particular environment, or to customize things to your preferences.
Read more →

Powerful Keymaps in VS Code Vim

Today I learned that you can remap Vim keys with VS Code. In my NeoVim config I have some custom keybindings that I can now replicate with VS Code. The official VSCodeVim documentation has some examples: In this example, you bind jj to <esc> in insert mode: "vim.insertModeKeyBindings": [ { "before": ["j", "j"], "after": ["<Esc>"] } ] The docs also have some nifty VSCodeVim tricks that you might want to check out.
Read more →

VS Code and Vim

Read more →

Nova Color Scheme

Read more →

Fira Code Font Ligatures in Emacs/Spacemacs on (Arch) Linux

I’m playing around with editors. It seems like some Elixir people use Spacemacs instead of Vim for their needs. Spacemacs is an Emacs distribution that comes with default configuration and (optional) Vim keybindings - the best of both worlds! I dabbled in Emacs a while ago when I learned Clojure. But the keybindings were mind-boggling. Even more insane than Vim. So, lets set up Spacemacs with Fira Code Font Ligatures.
Read more →

Vim With Eslint and Prettier for Javascript

As I’m experimenting with Vim/Neovim, I realized how much I rely on Prettier and ESlint for taking care of my JavaScript syntax. But how can I have that with Vim? It doesn’t come out of the box. I found a useful article that walks you through installing it for Vim. It uses the ALE Plugin. ALE offers linting support for many languages, not only JavaScript. The official documentation for the Vim Setup for Prettier is also worth a look.
Read more →

Use the Terminal From Neovim and Vim is Hard

When you type in : you can run commands in Vim. And when you run :! you can run terminal commands. For example, :!ls gives you a list of the current directory. In Neovim, you can also start a shell with :terminal. What I don’t like about Vim is how hard it is to find out how to get “convenience features”: linting, finding the right files, plugins, etc. The number of keyboard shortcuts and commands seems endless.
Read more →

Learning (Neo)Vim

I use Visual Studio Code as my main editor at the moment. It offers great in-built features and because of its popularity, you can also enhance it with many plugins. I love it. I used Sublime Text before, but as of 2019, it can’t hold a candle to VS Code. And then… Vim??? Vim is ubiquitous. It’s on every Linux machine and I can easily use it with my Raspberry Pi computers.
Read more →

Learn Functional Programming, One Tab at a Time.

There is a useful free Chrome extension called FP Glossary. It explains functional programming concepts when you open a new tab in Chrome. For example: Currying The process of converting a function that takes multiple arguments into a function that takes them one at a time. Each time the function is called it only accepts one argument and returns a function that takes one argument until all arguments are passed.
Read more →

Colemak for Faster Coding

My computer uses the QUERTZ per default. From Wikipedia: [The PC keyboard layout QUERTZ] employs dead keys to type accented characters like “é”, and the AltGr key to access characters in the third level (e.g. “[”, “]”, “@”, the euro sign “€”, or the micro- “µ”). The “T2” layout as specified in the 2012 edition of the German standard also uses the group selection to access special characters like the long s, or foreign characters like “Æ” or “Ə”.
Read more →

Setting up Fish Shell With Unicode Glyphs

Fish Shell is an interactive and user-friendly command shell for all platforms. The default shell on Linux (and macOS?) is bash. But fish is much nicer. It looks better, it has great autocomplete features and it just works out of the box with no fuss. You can install beautiful (and useful) themes and prompts which make working with git a breeze. For example, this is the bobthefish theme: You can easily see the git branch you’re working on and other information (i.
Read more →

Heroku Deployment Pitfall: Bind to $PORT

Read more →

Heroku Deployment Pitfall: Nodemon and Other Dependencies

Heroku doesn’t deploy your dev dependencies. This sounds like a good thing. But when you develop Node.js with Nodemon and your package.json uses nodemon as a start script, things can go haywire with Heroku. Easy fix: change your entry in package.json back from nodemon to node. … "scripts": { "start": "node server.js" // instead of: "nodemon server.js" }, … Also, check your other dependencies. Sometimes you might switch other packages from dev to normal dependencies, too.
Read more →

Webpack 4 Woes

I wanted to have a basic working webpack configuration so that I could try out different things without a framework. Doesn’t sound so hard, does it? Hours later, I came up with a minimal Webpack Babel Setup. Robin Wieruch’s React + Webpack 4 + Babel 7 Setup Tutorial and Valentin Gagliardi’s Webpack 4 Tutorial: from 0 Conf to Production Mode guided my boilerplate. Both articles do a good job of explaining how this tool works, so I won’t rehash their explanations.
Read more →