What is tmux and why would you want it for frontend development?

Olex
5 min readApr 3, 2017

--

I think it’s time more frontend and full-stack developers started using tmux, which stands for “terminal multiplexer”. But before we get into whatever “multiplexer” means, let’s consider Vim. Vim is the default text editor when writing a git commit message. A wonky terminal program that somehow makes writing 50 characters more challenging than typing them outright. You end up alt-tabbing to search how to quit this thing, because your emergency key combo Ctrl-C to close out programs… does nothing! Vim is a tough, unforgiving piece of software from a bygone era, like a treacherous ring full of magical power.

Truthfully, if you don’t know and use Vim already, I don’t intend to convince you to pick up tmux. It’s got decent mouse support but working with modal, keyboard-driven apps like vim and tmux is not easy. This article is simply an introduction to a powerful terminal tool that you might consider adding to your kit.

What is tmux?

There’s a range of vim’s a developer could run— some use it on remote computers like it’s the 1980’s, some use it strictly within their Terminal app, or there are suckers like me, who use a graphical interface with operating-system-specific gimmicks. I use vim like the serious devs but copy paste just like you in an app called MacVim. There is no “graphical” tmux. There is no mactmux. It is a program built for those serious devs who work on actual shells on a variety of computers. It’s like a window manager that works inside any terminal. The devops folks working on many machines, backend developers optimizing some engine,… for these people tmux, or its enigmatic predecessor screen, comprise a powerful school of magic.

A “terminal multiplexer” like tmux or screen lets you:

  1. Leave terminal sessions and come back to them without interrupting the running process. On a remote computer, you can run some long installation process in tmux, go offline, and come back later to see the results, e.g. the live terminal output. The computer, of course, needs to stay turned on.
  2. Manage a whole swarm of screens, split displays, dashboards at once, organized in three layers as “sessions”, “windows”, and “panes”. You can maneuver many terminal screens with home-row friendly shortcuts and manipulate your workspace with scripts and hotkeys.

This one-two punch is incredible for ops folks on the go, the “shit-is-on-fire” crew, and backend developers, but I think very few frontend (or general full-stack) developers use tmux day to day, and they should.

Why should frontend folks care about tmux?

Consider the steadily rising amount of build tools, software services, and storage servers that need to run all at once to even resemble a large web property on your own computer. Your database, your Redis cache, your Ruby or Python application server, your static (or splash-site-specific) code, some Node service or two building assets. Maybe a separate server for granting users sessions and authorizing requests. It’s painstakingly difficult to organize 7 servers’ worth of logs, a couple more terminal windows for git or general purpose navigation. tmux is useful even if you don’t write your code in vim inside the terminal.

As your dependencies swell, or if you need to bounce between contexts of work locations, home projects, and Mr. Robot terminal acting (if you work for that show, I’d do it for cheap). Jumping between contexts and saving your work is exactly what tmux is designed for. Done with work for the day? Switching to your `fsociety` IRC session? Dip out of the work context with `:d`, or detach, and then `tmux attach -t fsociety` will open a whole different bunch of windows and panes.

Modes

Like vim, tmux has modes, but the default mode feels the same as your normal Terminal. You type “git status”, that appears as letters, you hit enter and git status runs. A “prefix” key combination kicks you out of that and into a command mode (Prefix is commonly Ctrl-a, or Ctrl-f, default Ctrl-b). Now 1–5 might move you to different windows, and a whirlwind of shortcuts is available to you. If you start your command with :, you get a command line (like the infamous :wq<Enter> in vim). To see all the shortcuts currently set in your tmux, just hit your prefix and then :keys<Enter>. From my limited experience, `copy mode` is both the most useful and the only mode you might get stuck in.

Oh yeah, I guess there’s a clock mode, which switches a pane from a terminal to a nice little clock in the corner of your screen.

Uh oh, it’s late!

Startup Script

Restarted your computer for an update? You can make a bash script to open a bunch of screens, migrate your db, and organize the logs of a dozen services at once while you grab coffee. Let’s see how this works… So you start by making a regular bash script that says tmux new-session -d and then tmux split-window -v -p 34; this makes a new session with one window, and some split panes. You can then just script sending keystrokes to your tmux session: tmux send-keys ‘redis-server’ ‘C-m’. This example starts the redis local server and hits enter. You can script all those pane arrangements, servers, and so on into a few dozen calls to tmux. At the end of the whole script you can either list sessions, or just attach right into your just-right workspace.

Just like vim, tmux can be intimidating and is much too deep to master in one sitting. You can get the baseline skill in a day, and speed up your workflow in a week of cautious use.

Copying and pasting in tmux feels like opening and closing a spaceship airlock, but otherwise it’s a powerhouse for managing all the scripts and servers a regular web developer might need to run. tmux is a unique user experience all on it’s own, but it is heavily influenced by vim & friends. If you’re comfortable with the one editor to rule them all, you’ll have a fairly easy time adjusting to the terminal multiplexer… to rule all the terminal multiplexers.

If you’re experiencing serious amounts of clutter in your Terminal setup, I encourage you to give tmux go. Thanks for reading!

🔌 To get random ramblings about 🎛 synthesizers, 🇺🇸🇺🇦 politics, and 🎨 CSS, follow me on twitter: @olexpono

Installing tmux

Tmux is available using brew on OSX and apt-get on Ubuntu. Much like vim, tmux has a wild range of setups and config options. You can check out my tmux.conf to get a sense of the available options. I copy-pasted someone else’s and at most changed just a couple keybindings around (mainly setting the prefix to ctrl-f, and pasting is done via [ and ]). There’s also a necessary shim for copying and pasting on OSX available via brew as reattach-to-user-namespace.

--

--