Cesare Ferrari

July 13, 2022

Connecting to localhost with a phone to view my Rails site in development

Problem: I want to view a Rails website during development on localhost using my phone browser.


Bind Rails to IP address

Start a Rails server binding to 0.0.0.0 . The server will listen to port 3000 by default (but it can be changed with the -p flag):

rails s -b 0.0.0.0
=> Booting Puma
=> Rails 7.0.2.2 application starting in development 
=> Run `bin/rails server --help` for more startup options
Puma starting in single mode...
* Puma version: 5.6.2 (ruby 3.0.1-p64) ("Birdie's Version")
*  Min threads: 5
*  Max threads: 5
*  Environment: development
*          PID: 63153
* Listening on http://0.0.0.0:3000

Find laptop IP address

On the laptop (running Pop Os), open Settings > WiFi. Click on the gear icon near the local network name. A window will pop up with the network details. Look for the IPV4 address of the laptop (currently set to 10.0.0.10),


View the site on the phone

On the phone, launch the web browser and go to the laptop IP address found earlier, on port 3000, 10.0.0.10:3000 . The site should show up.


Using bin/dev

When starting the development server with bin/dev, I can still bind the server to 0.0.0.0 by modifying [Procfile.dev](http://Procfile.dev) like so:

# Procfile.dev

web: bin/rails server -p 3000 -b 0.0.0.0
css: rails tailwindcss:watch
Then, launch the phone browser and connect as described above.