Quickstart

On GitHub, using an existing account or a new account, create a new repository named my-docs.

Leave the new repository empty. Don't add a README, .gitignore, or license.

In the repository settings, click Installed GitHub Apps, confirm Vercel is installed, and click Configure.

In the Repository access section, select the repository you created, my-docs, or allow access to all repositories.

In Vercel, using an existing account or a new account, import the GitHub repository, my-docs, and click Deploy.

Leave the build settings at their defaults. Vercel detects the Next.js static export automatically.

You can ignore the warning about the missing branch.

From the Dashboard, click the card for the new project, my-docs, and copy the domain that Vercel assigned to it, <your-vercel-domain>, from the Domains list.

Navigate to Environment Variables, add the following key and value, and click Save:

• Key: SITE_URL

• Value: your assigned domain, including https://, for example, https://my-docs-black-chi.vercel.app

SITE_URL doesn't change where the site deploys. Beacon uses it to build absolute links in canonical tags, sitemap.xml, and /llms.txt.

Create a new site, my-docs:

npm create beacon-docs@latest my-docs

When prompted, enter the project name, my-docs, and the product name, MyProduct.

The command performs the following tasks:

1. Downloads Beacon.

2. Adds starter pages.

3. Saves the product name in .env.local.

4. Creates a local Git repository with an initial commit.

5. Installs the dependencies.

Start a local development server to preview your changes as you edit the content in the next section:

npm run dev

The development server runs at http://localhost:3000 and renders each page when you request it, but doesn't write the site to the out/ directory.

Changes to content/nav.config.ts reload automatically. To see changes to .mdx files, refresh the browser.

Create a file under content/docs/ for the new page, content/docs/my-page.mdx.

In the new page, add a frontmatter block with a title and description:

---
title: My Page
description: A short, specific summary of what this page covers.
---
 
# My Page
 
This is the content for MyProduct.

Beacon picks up the file automatically and adds it to the client-side search index.

The build also adds it to the sitemap.

In content/nav.config.ts, add an entry for the new file to a group's items array, for example, the Get Started group:

{ title: "My Page", href: "/my-page" }

With the development server running, open http://localhost:3000/my-page to view the new page.

Press Ctrl+C.

On your local machine, commit the page that you added, my-page.mdx, and the content/nav.config.ts file:

git add .
git commit -m "Add my page"

Connect your local repository to the new GitHub repository. Replace <your-github-username> with your GitHub username:

git remote add origin https://github.com/<your-github-username>/my-docs.git

Push the changes to the main branch:

git push -u origin main

In a production repository, you typically don't push directly to main. The quickstart does this only for simplicity.

In the Vercel dashboard, click Deploy. After the first deployment, every push to main triggers a new production deployment, and pushes to other branches create preview deployments.

Open https://<your-vercel-domain>/my-page to view the new page.