Setting up Statamic v3 on MacOS Part 4 of 4 – Publishing a Statamic Site

In this post, part 4, we'll cover deploying a Statamic site. The one thing to bear in mind when you're thinking about which host to use is that Statamic runs on Laravel. There are definitely a few differences with hosting a Laravel site, most notably…

1. You typically need to run a set of commands after each deploy. These commands may do things like clear the cache, and recompile assets like Tailwind / minified CSS and JS using Webpack.

2. Laravel needs to be run on a folder named public rather than the wide-standard for hosts, public_html. This can be a change to resolve, especially on shared hosting where it's typically not even possible to rename the public_html folder.

Using a host that supports Laravel environments makes things a lot easier and I strongly recommend you go this route unless you love tinkering with servers and making your life more difficult.

Choosing a Host

N.B. If you decide to sign up to Ploi I would very much appreciate it if you used my referral code https://ploi.io/register?referrer=JjynFt5S8WmoZbiAZO3E

The two most popular “server management” solutions (note: not quite the same as a host—we’ll get to that later)—are:

• Laravel Forge – built by Taylor Otwell. Taylor is the creator of the Laravel Framework and so this is a solid choice.

• Ploi – Similar to Forge but more encompassing, with extra bells and whistles which make it easier to connect to repositories, and with a much nicer UI, in my opinion. Ploi also has PHPMyAdmin built-in, so if you have existing sites on other CMS's like WordPress or Perch (which I did), you can migrate them and keep everything in one place.

Whether you choose Forge or Laravel, both of these services have the same purpose – to administrate a host/server more easily. In terms of hosts, the most popular options for Statamic are Digital Ocean and Linode. Digital Ocean seems to be the favourite, and so my final recommendation would be a Statamic setup of using Ploi to manage a Digital Ocean server.

Publishing a Statamic Site using Ploi

Let's start from scratch with a free Ploi trial—we'll go from signing up to a trial to getting a Statamic site live. p.s. if you decide you like Ploi and want to help a man out, please use my referral code: https://ploi.io/register?referrer=JjynFt5S8WmoZbiAZO3E

1. Sign up to a free trial on ploi.io

2. Add a Git Provider – In the Dashboard click the “Link Git Provider” button, where you'll be prompted to link to your GitHub, BitBucket, or GitLab accounts. If you're a little unsure on Git, my Working With Git video may help you.

3. Link to a Server Provider – Select your Server Provider. In my case, I'm using Digital Ocean.

   1. In Digital Ocean go to “API” in the bottom of the left column.

   2. Select “Generate a new Token”, call it something like “Ploi”.

   3. Copy the token using the little “copy” link.

   4. Go back to Ploi and paste the token in the “API Key” field. Label it something like “Digital Ocean” and click “Add Provider”.

4. Create a Server – In the Dashboard click the “Create Server” button. Select your server provider and then in the “Details” section use the Credentials dropdown to select the account you just created. Fill the in the details here. If you're just starting out the lowest server plan should be fine. You'll want to make sure you select a Server Region that's closest to your main customer base. When you're done click the “Create Server” button. Ploi will now use Digital Ocean's API to create a server for you on their platform. This might take a bit of time – go and get a cuppa tea—you deserve it! it took 20 minutes for the progress bar to reach 100% for me.

At this point you'll be e-mailed server details. Save these somewhere safe (you'll need them!). I would personally then delete the e-mail for security reasons.

Recommended Ploi Settings

• Click your avatar in the top right > Profile – set up TwoFactor Authentication here.

• Settings > Theme mode – change this to Dark mode if you're a fan.

• I'd recommend you use ImageMagick to process images rather than GD, which produces better quality image processing. For more information on that see my post about getting ImageMagick working locally. To enable ImageMagick in Ploi, go to Servers > PHP > Manage Extensions and check Imagick

Creating a Site

1. In the Ploi dashboard > left hand menu > Servers > select your server – add a domain you'd like to link here e.g. yourdomain.com and click Add Site.

2. Once the site has been created, click it, and select “Git Install Repository”, choose your provider and select your repository. Make sure you select “Install composer dependencies”, and then click Install Repository.

3. At this point you'll be prompted to add some recommended script commands, ignore this – I'll give you some recommendations instead. Click “Ignore suggestions”

Once you can see the Deploy script, add these lines below where it says “echo "🚀 Application deployed!"”

npm install
npm run production

php artisan optimize
php please cache:clear
php please stache:refresh

php artisan route:cache
php artisan view:clear

The full deploy script should now look something like this (bear in mind your site directory will be different and your php version might be different).

cd /home/ploi/yourdomain.com
git pull origin master
composer install --no-interaction --prefer-dist --optimize-autoloader
echo "" | sudo -S service php7.4-fpm reload

echo "🚀 Application deployed!"

npm install
npm run production

php artisan optimize
php please cache:clear
php please stache:refresh

php artisan route:cache
php artisan view:clear

When you've finished editing the deploy script click “Save”

Click the “Edit Environment” button in the top right:

• Change the APP_URL to https://yourdomain.com (rather than plain ol’ http).

• Change the APP_ENV to production

Then in the top right click “Deploy Now”. Once you've successfully deployed your repository you can remove the npm install line.

Pointing your DNS to Ploi

In your domain registrar's DNS records, you should have the following three lines:

1. An A record for * with a value of your server’s IP address (which you can find in the top left of Ploi once you're in a server or its sites)

2. An A record for @ with a value of your server’s IP address

3. A cname record for www with a value of yourdomain.com

Setting up an SSL Certificate for your Domain with Ploi

Once you've gone into your site in Ploi > left hand menu > SSL – accept the defaults here and click “Add certificate”. At this point Ploi will check with the DNS to connect. if you've correctly pointed your DNS to ploi this should work.

Automatically Deploying

When you push to your installed branch, Ploi will run the deploy script for you.

A final thing to consider is whether you'd like to automatically deploy your site when you push up to Git. You may want to be careful with this if you're handling a big client but otherwise, this is a big productivity boost. Once you've gone into your site in Ploi > left hand menu > Repository – scroll down to the Quick deploy heading and click “Enable Quick Deploy”. Another possible workflow is if you set up a staging site on Ploi and automatically deploy to that.

Quick Deploy Not Showing

I've run into a problem previously where "Quick Deploy" wasn't visible in the "Repository" section. I believe this happens when you initially add the repository using the "Custom" option rather than the built-in BitBucket/GitHub integration.

It's still possible to enable quick deploy though. To get around this, in Ploi > left hand menu > Repository – scroll down to the Repository section, and change "Custom" to "BitBucket" or "GitHub". Make sure the repository name is in the format "username/repo_name", for example "jaygeorge/london-local". The repository URL field should already automatically be in the correct format from when it was previously saved as "Custom", e.g. "git@bitbucket.org/jaygeorge/london-local.git"

Once you've turned Quick Deploy on, if you like you can switch back to "Custom" and Ploi should continue to quick-deploy.