TUTORIAL

Using Overmind for an easier Vite Rails dev environment

Using Overmind for an easier Vite Rails dev environment
Photograph by Aska

Config Overmind for an easier development environment

In a regular vite-rails config, we can start our bundler dev server and web server with these two commands:

# starts the bundler dev server
bin/vite dev

# starts the rails server
bin/rails s

The problem is we will need to open two terminal windows, and type these commands every time we wanted to restart the dev servers.

That's not ideal. So let's improve this by using a tool like Foreman or Overmind.
In this tutorial we will use Overmind, but you can use Foreman if you prefer it.

If you haven't already installed Overmind, you can install it with

brew install tmux
brew install overmind

These commands are for OSX. If you are on other systems, you can follow the instructions on the official page.
https://github.com/DarthSim/overmind

Vite has created a Procfile.dev for us, so we just need to tell it to use a port we prefer:
/Procfile.dev

vite: bin/vite dev
web: bin/rails s -p 3000

Now we can start the dev servers with this command:

overmind start -f Procfile.dev

And both servers should start.

But that's a long command to type. We can take it one step further by creating a script named dev under /bin directory in our project root:

/bin/dev

#!/usr/bin/env bash

PORT="${PORT:-3000}"
export PORT

if command -v overmind &> /dev/null; then
  overmind start -f Procfile.dev "$@"
else
  foreman start -f Procfile.dev "$@"
fi

Save this file, then run this command to make the file an executable.

chmod +x bin/dev

Now we can start dev servers by simply typing:

bin/dev

Neat, isn't it?