Skip to main content

Deploying a create-3dverse-app to GitHub Pages

If you use GitHub for version control, you can leverage GitHub Pages as an easy way to deploy your client application to your users. This guide explains how to set up a continuous integration pipeline to deploy your 3dverse application to GitHub Pages whenever you push to your main branch.

Prepare Your Project​

Make sure your project can build locally:

npm run build

You should be able to see your build files in the /dist folder.

Add a GitHub Actions Workflow​

create-3dverse-app create-3dverse-app can generate the files needed to deploy your application to GitHub Pages.

From the root of your repository, run the CLI with the following command to set up automated deployment:

npx create-3dverse-app@latest --deploy

During setup, you may be prompted for details such as:

  • Domain choice — decide whether to use GitHub’s default domain or configure a custom one.
  • Repository name — used to construct the deployment URL: https://<username>.github.io/<repository-name>/.
  • Deploy branch — the branch that will trigger deployments when new commits are pushed.

Follow the prompts until deployment is fully configured, then continue to the next section.

Enable GitHub Pages​

Make sure everything is committed and pushed to your deploying branch.

  1. Go to your repository on GitHub.
  2. Navigate to Settings → Pages.
  3. Under Source, choose GitHub Actions.

Deploy​

Now, every time you push to the deploying branch, GitHub Actions will automatically:

  1. Install dependencies
  2. Build your project
  3. Deploy the contents of the /dist folder to GitHub Pages

Have a look at the Actions tab on GitHub to keep track of your deployment's progress.

After a short time, your application should be publicly available at:

https://<username>.github.io/<repository-name>/