In this guide you will learn how to generate and serve a Mosaic site.

To begin setting up a Mosaic site, you need to have the following software installed:

  1. Yarn v1
  2. Node.js v18 or higher

Run the following command in your project directory to generate a new Mosaic site:

This command creates a new Mosaic site in the my-sample-site directory.

Next, navigate to the site directory:

The example site you have generated comes preconfigured with two sources: a remote repository and a local docs folder. Sources are used by Mosaic to pull content from disparate locations and merge them into a single virtual filesystem that can be used by a Mosaic site.

If you want the site to read from remote repositories, you need to set up an environment variable to store your Git credentials. Follow these steps:

  1. Open a terminal or command prompt.

  2. Replace <repo_username> and <personal_access_token> in the following commands with your actual Git username and personal access token.

On Unix:

On Windows:

This sets the MOSAIC_DOCS_CLONE_CREDENTIALS environment variable with your Git credentials.

Now you can serve your Mosaic site by running the following command:

Access your Mosaic site from a browser using the following URLs:

That's it! Your Mosaic site is now up and running.

  1. Deploy your Mosaic site to AWS or Vercel for production use.
  2. Create more pages to expand your site's content.
  3. Configure your own sources in the mosaic.config.mjs file to pull content from different locations.
  4. Theme your site
Mosaic BETA

Coming soon