Making it a (local) homepage

I wanted to make a local domain and a starting home page on my Mac to aid in local web development and gather common links. Fortunately, on macOS this is a mostly-solved problem. I chose to use Valet (macOS) and Homepage.

Valet

Valet is a quick and easy way to start serving web pages from your Mac, without diving into configuration files. It allows you to set up a local domain such as .test (by default), or change it to something different. I use .app for my install. Valet can monitor a folder, such as the Sites folder that macOS used to use for Web sharing. Any sub-folders there (they can be real folders or links to folders elsewhere on your Mac) become locally-served sites.

If we have the folders hannagoodbar and homepage under the Sites folder…

~/Sites
    hannagoodbar
    homepage

…they will be served with http://hannagoodbar.test and http://homepage.test. You can add or remove folders from there as needed. For me, Homepage is my default page for new windows and tabs, and hannagoodbar is for final proofing before deploying web site changes.

These instructions are for macOS. If you use Windows, here is the Valet for Windows page.

Most of these instructions come from the Valet installation page.

  1. I already have Nginx running on port 80, so it needs to be stopped (it was installed via Homebrew): sudo brew services stop nginx
  2. Make sure Homebrew is up-to-date: brew update
  3. Install PHP: brew install php@7.2
    Brew indicated PHP was already installed:
    php 7.2.11 is already installed and up-to-date
  4. Install Composer, a PHP dependency manager: brew install composer
  5. Download Valet: composer global require laravel/valet
  6. Add the Composer path to my shell’s path. I edited my ~/.zshrc to include
    export PATH=/Users/hanna/.composer/vendor/bin:$PATH
    immediately under # User configuration
  7. Activate the .zshrc changes: source ~/.zshrc
  8. Install Valet: valet install

Here is where Valet configuration begins.

  1. Change the default Valet domain from .test to .app: valet domain app
  2. Make a directory for Valet to serve web pages: mkdir ~/Sites
  3. Instruct Valet to use this folder to serve web pages: cd ~/Sites && valet park

We are now ready to serve some web pages locally.

Homepage

From the project’s GitHub page: “This project is a simple, standalone, self-hosted PHP page that is meant to be your window to your server and the web.” It’s your local, um, home page.

Hanna's home page

The home page shows you a random image from Unsplash. Press the space bar to activate the menu, time, and Unsplash image credit.

Since we have Valet going, it’s just a few steps to get Homepage running.

  1. Download Homepage from the GitHub page
  2. If you want to see Unsplash images, register as a developer at https://unsplash.com/developers and get your 64-character client ID.
  3. Extract to the folder where Valet is “parked”; for me, this is ~/Sites/
  4. Homepage should be a folder inside, so ~/Sites/homepage/index.php, ~/Sites/homepage/config.sample.json, etc
  5. Copy config.sample.json to config.json
  6. Supply your Unsplash developer ID in unsplash_client_id
  7. Edit or add links to your favorite sites. By default, only Font Awesome icons are used.

You should now be able to navigate to http://homepage.test and see it.