Hosting a static website from a repository using SourceCraft Sites

SourceCraft Sites is a tool for free static website hosting without the need to configure server infrastructure. Files for a published website are hosted in a public repository of a public SourceCraft organization.

A static website is built with such client-side technologies as HTML, CSS, and JavaScript. It may not contain any scripts that run on the web server side. You can use any static website generators, e.g., Jekyll, Hugo, Gatsby, etc.

Access to websites hosted in SourceCraft Sites is arranged over the secure HTTPS protocol. You do not need to upload your own TLS certificate.

In this tutorial, you will configure hosting for a static website from a repository using SourceCraft Sites.

Learn more about SourceCraft.

To configure hosting:

If you no longer need the website, unpublish it.

Get ready for work

Authenticate in SourceCraft on the service home page or sign up.

Warning

You can only publish a website from a public repository in a public organization.

If you are working in a private organization, update its visibility settings or create a new public organization.
Create a personal access token, as you will need it later.

Create a repository from a template

Open the service home page.
In the left-hand panel, click Create repository.
In the window that opens, select Repository from template.
Click Use template next to the sites-landing template.

Based on the repository, a SourceCraft Sites landing page is deployed for that template.

To view the template contents, click Preview.

The template contains a pre-installed SourceCraft Sites configuration and standard project files.
Under Your new repository details:
- In the Owner field, select the organization to create the repository in.
- In the Name field, specify a name for the repository.
  
  The name must be unique within the organization. The name may contain the following ASCII characters: lowercase and uppercase Latin letters, numbers, commas, hyphens, and underscores.
  
  The address to access the repository at is displayed below the name.
- Optionally, in the Description field, enter a description for the repository.
In the Visibility field, select the Public access type for the repository to allow view access to all internet users without authentication. Only invited users will be able to modify the repository.

Warning

You can only publish a website from a public repository in a public organization.

If you are working in a private or internal repository, update its visibility settings or create a new public repository.
Click Create repository.

Edit the original files

View the contents of the repository you created.

The repository contains the following elements for a static website:
- SourceCraft Sites configuration file, .sourcecraft/sites.yaml.
- CI/CD configuration file, .sourcecraft/ci.yaml.
- Soure files for website generation.
For more information about the repository structure and technology in use, see README.md.

The SourceCraft Sites configuration in the repository already such a configuration that makes the template website available at https://<organization_slug>.sourcecraft.site/<repository_name> within a few minutes after creating the repository.
Click Edit in the top-right corner to edit the .sourcecraft/sites.yaml file or keep the default settings.

The SourceCraft Sites configuration is set up for a particular repository and stored in a file named .sourcecraft/sites.yaml. A configuration stored in the main branch, e.g., master or main, applies to the entire repository.

The general configuration format for SourceCraft Sites in .sourcecraft/sites.yaml is as follows:
```
site:
  root: "<path_to_directory_with_website_files>"
  ref: "<branch_or_tag>"
```
Where:
- root: Absolute path from the repository root to the directory with website files, e.g., site. This is an optional setting. By default, it is set to the repository root.
  
  Tip
  
  We recommend using index.html for your website homepage.
- ref: Name of branch or tag whose files will be used to publish the static website, e.g., release. This is an optional setting. By default, it is set to the repository’s main branch. Once you commit changes to the branch, the website will update automatically in a few minutes.
Similarly, change the contents of the src directory, e.g.:
- Replace the configuration of the website home page, src/pages/index.yaml, with the one you need. By default, it contains a configuration for a SourceCraft Sites landing page. Do not rename the index.yaml file.
- Add your CSS files or React components. You can see a sample configuration in the page-builder.config.yml file.
Save the changes in your repository’s main branch.

Test the website

According to your .sourcecraft/ci.yaml configuration, after making changes in the main repository branch, the build-site workflow starts that:

Generates website files from the source files in the src directory in the main branch.
Publishes the website files in the site directory in the release branch.

To test the website:

Under Code on the repository page, go to CI/CD.
In the list of automation executions, you will see a new execution. Wait for the status to change to Success.
In the left-hand panel on your repository’s home page, follow the link under Deployments.

Build the website locally

Optionally, you can build and test your website locally:

Clone the repository:

git clone https://git@git.sourcecraft.dev/<organization_slug>/<repository_name>.git

Install Node.js version 18 or higher.

We recommend using Node Version Manager for installation.
Navigate to the repository directory and build the project:
```
cd <repository_name>
npm ci
npm run build
```
Open the site/index.html project in your browser.

Unpublish the website

If you no longer need the website, remove the contents of the .sourcecraft/sites.yaml file in the repository’s main branch or delete the repository.

Was the article helpful?

Setting up CI/CD to deploy Yandex Serverless Containers using GitHub Actions

Resource relationships