Installing Hugo using Cloud Apps
Follow this guide to install and configure a static website on Hugo
Note
This guide uses the SourceCraft
Review the SourceCraft guides
To install Hugo:
- Get your cloud ready.
- Configure a DNS zone.
- Install Hugo using Cloud Apps.
- Prepare a website repository.
- Check the result.
If you no longer need the resources you created, delete them.
Get your cloud ready
Sign up for Yandex Cloud and create a billing account:
- Navigate to the management console
and log in to Yandex Cloud or create a new account. - On the Yandex Cloud Billing
page, make sure you have a billing account linked and it has theACTIVEorTRIAL_ACTIVEstatus. If you do not have a billing account, create one and link a cloud to it.
If you have an active billing account, you can create or select a folder for your infrastructure on the cloud page
Learn more about clouds and folders here.
Required paid resources
The cost of support for the new infrastructure includes:
- Fee for using a public DNS zone and public DNS requests (see Yandex Cloud DNS pricing).
- Fee for data storage in Yandex Object Storage, data operations, and outgoing traffic (see Yandex Object Storage pricing).
- Fee for storing secrets in Yandex Lockbox (see Yandex Lockbox pricing).
Configure a DNS zone
Before installing the application, create a public DNS zone and delegate a domain to it. For more about delegating domains, see this guide.
-
Navigate
to Cloud DNS. -
Click Create zone.
-
Specify the DNS zone settings:
- Zone: Specify your registered domain with a trailing dot, e.g.,
example.com.. - Type: Select
Public. - Name: Enter a name for the zone, e.g.,
example-zone.
- Zone: Specify your registered domain with a trailing dot, e.g.,
-
Click Create.
-
Delegate your domain to Yandex Cloud servers. Do it by specifying the addresses of the
ns1.yandexcloud.netandns2.yandexcloud.netDNS servers in your domain registrar's account.Delegation does not take effect immediately. It usually takes up to 24 hours for internet service providers to update records. You can check domain delegation using Whois
or thedigutility:dig +short NS example.comResult:
ns2.yandexcloud.net. ns1.yandexcloud.net.
If you do not have the Yandex Cloud CLI yet, install and initialize it.
-
Create a public DNS zone:
yc dns zone create \ --name example-zone \ --zone example.com. \ --public-visibility=trueWhere
--zoneis your domain's name, e.g.,example.com.. The--zoneparameter value must end with a trailing dot.Result:
id: dns39gihj0ef******** folder_id: b1g681qpemb4******** created_at: "2024-09-09T15:23:34.919887Z" name: example-zone zone: example.com. public_visibility: {}For more information about the
yc dns zone createcommand, see the CLI reference. -
Delegate your domain to Yandex Cloud servers. Do it by specifying the addresses of the
ns1.yandexcloud.netandns2.yandexcloud.netDNS servers in your domain registrar's account.Delegation does not take effect immediately. Internet provider servers update records within 24 hours.
To create a public DNS zone, use the create REST API method for the DnsZone resource or the DnsZoneService/Create gRPC API call.
Delegate your domain to Yandex Cloud servers. Do it by specifying the addresses of the ns1.yandexcloud.net and ns2.yandexcloud.net DNS servers in your domain registrar's account.
Install Hugo using Cloud Apps
Install a static website on Hugo using Cloud Apps. The application will deploy the website to Object Storage and configure domain access.
-
Go
to Cloud Apps. -
Click Install application.
-
Select the Static website in Object Storage application.
-
Configure your application:
Parameter
Required
Default value
Description
Name
Yes
—
Application instance name
Description
—
—
Application instance description
Service account
Yes
—
Service account you are going to use to install the app. The service account must have the
storage.admin,lockbox.admin,certificate-manager.admin, anddns.adminroles for the folder.
To create a service account with the required permissions during app installation, selectAuto.DNS zone
Yes
—
ID of the DNS zone to host the application's website.
Subdomain
—
Empty
Domain where the Hugo static website will be available. This domain is formed by adding a subdomain to the DNS zone domain, e.g.,
site.example.comorexample.comif no subdomain is specified.Website configuration
Yes
—
Select Hugo from the drop-down list.
Maximum bucket size
—
10Maximum size of the Object Storage bucket to host the website's static files, in GB.
-
Click Install.
The app installation will take a few minutes. During installation, an Object Storage bucket, DNS records for the website subdomain, and the required resources for HTTPS access will be created. Wait for the installation to complete.
Prepare a repository
After the application is installed, prepare a SourceCraft repository with the website's source code:
-
If you do not have Git installed yet, follow this guide
to install it. -
Create
a repository from thecloudapp-hugotemplate . -
On your local computer, open the working directory where you want to host your website project.
-
Clone
the repository created from the template. -
Go to the cloned repository. Complete all further steps, i.e., environment configuration, building, and deployment, inside this folder.
Deploy the website
Open the README file in the repository root and complete the steps from that file:
-
Set up
a service connection. Specify the service account you created when installing the application.You will need the service connection name specified during account creation to complete the setup.
-
Update the configuration files in your editor, e.g., in Visual Studio Code:
-
hugo.toml:baseURL = 'https://<domain>' title = '<website_name>' ... [deployment] [[deployment.targets]] name = 'production' url = 's3://<domain>?region=ru-central-1&endpoint=https://storage.yandexcloud.net' ...Where:
<domain>: Domain for access to the website. It usually matches the name of the bucket created when installing the application.<website_name>: Name of your website.
-
.sourcecraft/ci.yaml:tokens: SERVICE_CONNECTION: service_connection: <service_connection> scope: org workflows: hugo-deploy: env: DOMAIN_NAME: <domain>Where:
<service_connection>: Service connection name.<domain>: Domain for access to the website. It usually matches the name of the bucket created when installing the application.scope: Service connection level. The possible values are:repo: For repository-level connections.org: For organization-level connections.
-
-
Run the CI/CD pipeline to deploy the static website. To do this, run the following commands one by one inside the
mainbranch:git commit -aEnter a name for the commit.
git pushAfter the pipeline runs successfully, the website will be available at
https://<domain>. The system automatically builds your project and uploads the result to the Object Storage bucket.
Configure the website
-
Install the required Hugo
version for local development. -
Start the dev server:
hugo serverThe website will be available at
http://localhost:1313. -
Build the production version by running this command:
hugoThe build result will be saved to the
public/directory. -
View the production build locally by running this command:
hugo server --disableFastRender -
To publish changes, run the CI/CD pipeline as described in Deploy the website.
Check the result
Make sure your Hugo static website is successfully published and available at the public domain:
-
In your browser, open the domain or subdomain you specified during application installation (e.g.,
https://site.example.com). -
Make sure the main page of your Hugo website loads and its navigation works.
-
If the template included a test page or section, navigate to it via the relevant link and make sure it also opens at the public URL.
If the website opens and all images, styles, and pages render correctly, your website was deployed successfully.
How to delete the resources you created
To shut down the resources you created and stop paying for them:
-
Delete all objects from the Object Storage bucket you created when installing the app.
-
Delete the Static website in Object Storage application in Cloud Apps:
- In the management console
, select the folder the application is installed in. - In the list of services, select Cloud Apps.
- Find the Static website in Object Storage application in the list.
- Click
next to the app and select Delete. - Confirm the deletion and wait for it to complete. The empty bucket and the remaining resources of this application instance will also be deleted.
- In the management console
-
If you created a service account during application installation, delete it.
-
Delete the public DNS zone.
-
Delete the SourceCraft service connection:
- Open the SourceCraft home page
. - On the
Home tab, under Your craftspace, navigate to Repositories. - Select the repository created from the
cloudapp-hugotemplate. - Under
Repository settings, navigate to Service connections and select the relevant service connection. - In the top-right corner, click
Delete and confirm the deletion.
- Open the SourceCraft home page
-
Delete
the repository created from the template in SourceCraft.