+++
title = "Deploy on DigitalOcean App Platform" linkTitle = "DigitalOcean App Platform" date = 2024-01-21T15:00:19+08:00 description = "A detailed guide about how to host your static sites on DigitalOcean app platform via using Docker image." featured = false draft = false comment = true toc = true pinned = false carousel = false categories = [ "Deployment" ] tags = [ "DigitalOcean", "Docker", "Dockerfile", "Buildpack" ] series = [ "Docs" ] images = [] #[funding] +++
- DigitalOcean Account
Create the Dockerfile
on your site root.
Our starter template already includes the
Dockerfile
.
###############
# Build Stage #
###############
FROM hugomods/hugo:exts as builder
COPY . /src
ENV HUGO_ENV=production
# Base URL
ARG HUGO_BASEURL=
ENV HUGO_BASEURL=${HUGO_BASEURL}
# Module Proxy
ARG HUGO_MODULE_PROXY=
ENV HUGO_MODULE_PROXY=${HUGO_MODULE_PROXY}
# NPM mirrors, such as https://registry.npmmirror.com
ARG NPM_CONFIG_REGISTRY=
ENV NPM_CONFIG_REGISTRY=${NPM_CONFIG_REGISTRY}
# Install dependencies
RUN npm ci
# Build site
RUN hugo --minify --gc --enableGitInfo
# Set the fallback 404 page if defaultContentLanguageInSubdir is enabled, please replace the `en` with your default language code.
# RUN cp ./public/en/404.html ./public/404.html
###############
# Final Stage #
###############
FROM hugomods/hugo:nginx
COPY --from=builder /src/public /site
- The
/site
is the output directory of static files, which will be used later.
Navigate to DigitalOcean Dashboard -> Left Panel -> Apps -> Create App, and then fill up the form as follows.
In this step, we'll need to tweak the resources, since currently DigitalOcean app platform Buildpack unable to detect Hugo sites those configured via configuration directory.
You may see multiple resources as image above shown, you'll need to remove unnecessary resources except the one in type Dockerfile
.
Since the web service isn't non free, so we need to edit the Dockerfile resource to be a static site.
- Click the
Edit
button on the right of the Dockerfile resource, then you'll be navigated to the resource setting panel. - Edit the Resource Type and change it to Static Site.
- Edit the Output Directory and set it as
/site
.
Once done, you will get the above similar settings, now let's click the Back button to check the resources.
If everything goes fine, you should got only one resource, which is in type Static Site | Dockerfile
.
Please reviewing the billing section, you won't be charged if you deploy not more than 3 static sites.
Please note that exceeded transfer usage will be charged, read more on pricing.
It's time to deploy site by clicking the Create Resources button if everything is OK.
Once the app was created, it will deploy automatically, you can check the build logs if something go wrong.
You'll able to customize domain after deploying successfully.