Viewing your local mamp projects on your phone
Last updated: August 16, 2024
Introduction
There are a few ways to do this – and if you’re using CodeKit or something – that’ll be a bit different – (or if you’re using MAMP Pro) but here’s an outline for how to get regular MAMP on your iPhone to test — (will flesh this out and make a video later)
(I assume it’s the same for android / you just save it to your homescreen or bookmark it in whatever way they do that)
To view your localhost on your iPhone using MAMP, you’ll need to follow these steps:
- Ensure Both Devices Are on the Same Network: Make sure your Mac and iPhone are connected to the same Wi-Fi network.
- Find Your Mac’s Local IP Address:
- On your Mac, go to System Preferences > Network.
- Select your active network connection (Wi-Fi or Ethernet).
- You’ll see your IP address listed under “Status.”
- Configure MAMP to Use Your Local IP Address:
- Open MAMP and go to Preferences.
- Under the Ports tab, make sure Apache is running on port 80 (default HTTP port). If it’s running on another port, you’ll need to include that port number in the URL on your iPhone later.
- Start your MAMP servers.
- Access the Localhost from Your iPhone:
- On your iPhone, open Safari or any other browser.
- In the address bar, type your Mac’s local IP address followed by the port number if necessary (e.g.,
http://192.168.1.100
orhttp://192.168.1.100:8888
if you’re using a custom port). - This should display your MAMP-hosted website.
- Add to Home Screen:
- Once the site is loaded, tap the Share button at the bottom of the Safari screen (it looks like a square with an arrow pointing up).
- Scroll down and tap Add to Home Screen.
- You can edit the name of the shortcut if you want.
- Tap Add in the top right corner.
- Access the Website from Your Home Screen:
- Now, you’ll see an icon on your iPhone’s home screen. Tapping it will open the site in Safari, just like an app.
If you’re using MAMP Pro
We don’t have any discounts for this one.
1. Set Up a Virtual Host in MAMP Pro:
- Open MAMP Pro and go to the Hosts tab.
- Add a new host by clicking the + button.
- Set up your virtual host with a custom domain name like
myproject.local
and specify the Document Root for your project. - Save the host configuration.
2. Access the Site on Your iPhone:
- Use Your Mac’s Local IP Address: Even though you’ve set up a custom domain in MAMP Pro, you’ll access the site on your iPhone using your Mac’s local IP address.
- On your iPhone, open Safari and enter your Mac’s local IP address followed by the virtual host path (e.g.,
http://192.168.1.100/myproject
). - Note: If you’re using the default port 80 in MAMP Pro, you don’t need to include the port number. If you’re using a different port, include it in the URL (e.g.,
http://192.168.1.100:8888
).
3. Add to Home Screen:
- After successfully loading the site on your iPhone, tap the Share button in Safari.
- Select Add to Home Screen.
- Customize the name if desired and tap Add.
4. Optional: Use MAMP Pro’s Mobile Features:
- MAMP Viewer App: Download the MAMP Viewer app on your iPhone. This app lets you view your local MAMP Pro sites without needing to manually enter IP addresses.
- Open the app, connect to the same Wi-Fi as your Mac, and select your site directly from the app.