mirror of
https://github.com/mintlify/docs.git
synced 2026-09-14 13:35:46 +08:00
169 lines
6.3 KiB
Plaintext
169 lines
6.3 KiB
Plaintext
---
|
|
title: "Quickstart"
|
|
description: "Deploy a documentation site with Mintlify in minutes, then make your first content change with the web editor or Git."
|
|
keywords: ["quickstart", "deploy", "get started", "first steps", "tutorial", "setup", "onboarding"]
|
|
boost: 3
|
|
hidden: true
|
|
---
|
|
|
|
import SkillMcpPrompt from "/snippets/skill-mcp-prompt.mdx";
|
|
|
|
This guide walks you through deploying a documentation site and publishing your first change. When you finish, you'll have a live site ready to customize.
|
|
|
|
## Before you begin
|
|
|
|
Mintlify uses a docs-as-code workflow: every page on your site is backed by a file in your documentation <Tooltip tip="Your documentation's source code where all files and their history are stored. The web editor connects to your documentation repository to access and modify content, or you can edit files locally in your preferred IDE.">repository</Tooltip>. Once you connect that repository to your project, you can edit content locally or in the web editor and sync changes back to your remote.
|
|
|
|
<Tip>
|
|
Using an AI coding tool?
|
|
|
|
Copy the following prompt to add the Mintlify [skill](/ai/skillmd) and [MCP server](/ai/model-context-protocol) for better results when updating your documentation.
|
|
</Tip>
|
|
|
|
<SkillMcpPrompt />
|
|
|
|
## Deploy your documentation site
|
|
|
|
Go to [mintlify.com/start](https://mintlify.com/start) and complete onboarding. You'll connect your GitHub account, create or select a repository, and install the Mintlify GitHub App to enable automatic deployments.
|
|
|
|
When onboarding finishes, your site is deployed to a `.mintlify.site` URL.
|
|
|
|
<AccordionGroup>
|
|
<Accordion title="Optional: Skip connecting a Git provider during onboarding">
|
|
To try Mintlify without connecting your own repository, skip the Git provider step during onboarding. Mintlify creates a private repository in its private organization and configures the GitHub App for you, so you can start editing in the web editor right away.
|
|
|
|
To use your own repository later, open [Git Settings](https://app.mintlify.com/settings/deployment/git-settings) in your dashboard and migrate your content with the Git setup wizard. See [Clone to your own repository](/deploy/github#clone-to-your-own-repository) for details.
|
|
</Accordion>
|
|
</AccordionGroup>
|
|
|
|
## View your deployed site
|
|
|
|
Your site is live at `https://<your-project-name>.mintlify.site`. Find the exact URL on the **Overview** page of your [dashboard](https://app.mintlify.com/).
|
|
|
|
<Frame>
|
|
<img
|
|
alt="Overview page of the Mintlify dashboard."
|
|
className="block dark:hidden"
|
|
src="/images/quickstart/mintlify-domain-light.png"
|
|
/>
|
|
<img
|
|
alt="Overview page of the Mintlify dashboard."
|
|
className="hidden dark:block"
|
|
src="/images/quickstart/mintlify-domain-dark.png"
|
|
/>
|
|
</Frame>
|
|
|
|
<Tip>
|
|
Use this URL to test your site and share it with your team. Before sharing it with your users, add a [custom domain](/customize/custom-domain).
|
|
</Tip>
|
|
|
|
## Make your first change
|
|
|
|
Pick the workflow that fits how you want to edit. The CLI is best for local development and previews; the web editor is best for quick changes from your browser.
|
|
|
|
<Tabs>
|
|
<Tab title="CLI">
|
|
<Steps>
|
|
<Step title="Install the CLI">
|
|
The CLI requires [Node.js](https://nodejs.org/en) v20.17.0 or higher. Use an LTS version for stability.
|
|
|
|
<CodeGroup>
|
|
|
|
```bash npm
|
|
npm i -g mint
|
|
```
|
|
|
|
```bash pnpm
|
|
pnpm add -g mint
|
|
```
|
|
|
|
</CodeGroup>
|
|
|
|
For full details and troubleshooting, see [Install the CLI](/cli/install).
|
|
</Step>
|
|
<Step title="Clone your repository">
|
|
Clone your documentation repository locally:
|
|
|
|
```bash
|
|
git clone <your-repository-url>
|
|
```
|
|
|
|
If your repository lives in Mintlify's private organization, first move it to your own account by following [Clone to your own repository](/deploy/github#clone-to-your-own-repository).
|
|
</Step>
|
|
<Step title="Edit a page">
|
|
In `index.mdx`, update the `description` field in the frontmatter:
|
|
|
|
```mdx
|
|
---
|
|
title: "Introduction"
|
|
description: "Your custom description here"
|
|
---
|
|
```
|
|
</Step>
|
|
<Step title="Preview locally">
|
|
From your documentation directory, start the local preview:
|
|
|
|
```bash
|
|
mint dev
|
|
```
|
|
|
|
Open [http://localhost:3000](http://localhost:3000) to see your changes.
|
|
</Step>
|
|
<Step title="Push your changes">
|
|
Commit and push to trigger a deployment:
|
|
|
|
```bash
|
|
git add .
|
|
git commit -m "Update description"
|
|
git push
|
|
```
|
|
|
|
Mintlify deploys automatically. Track the deployment on the [Overview](https://app.mintlify.com/) page of your dashboard.
|
|
</Step>
|
|
</Steps>
|
|
</Tab>
|
|
<Tab title="Web editor">
|
|
<Steps>
|
|
<Step title="Open the web editor">
|
|
Go to the [web editor](https://app.mintlify.com/editor) in your dashboard.
|
|
</Step>
|
|
<Step title="Edit a page">
|
|
Open the **Introduction** page and update the description.
|
|
|
|
<Frame>
|
|
<img
|
|
alt="Introduction page open in the web editor with the description edited to say Hello world!."
|
|
className="block dark:hidden"
|
|
src="/images/quickstart/hello-world-light.png"
|
|
/>
|
|
<img
|
|
alt="Introduction page open in the web editor with the description edited to say Hello world!."
|
|
className="hidden dark:block"
|
|
src="/images/quickstart/hello-world-dark.png"
|
|
/>
|
|
</Frame>
|
|
</Step>
|
|
<Step title="Publish">
|
|
Click **Publish** in the top-right of the editor toolbar.
|
|
</Step>
|
|
<Step title="View live">
|
|
Check the deployment status on the [Overview](https://app.mintlify.com/) page of your dashboard. When it finishes, refresh your documentation site to see your changes live.
|
|
</Step>
|
|
</Steps>
|
|
</Tab>
|
|
</Tabs>
|
|
|
|
## Next steps
|
|
|
|
<Card title="Use the web editor" icon="mouse-pointer-2" horizontal href="/editor/index">
|
|
Edit documentation in your browser and preview how your pages look when published.
|
|
</Card>
|
|
|
|
<Card title="Explore CLI commands" icon="terminal" horizontal href="/cli/index">
|
|
Find broken links, check accessibility, validate OpenAPI specs, and more.
|
|
</Card>
|
|
|
|
<Card title="Add a custom domain" icon="globe" horizontal href="/customize/custom-domain">
|
|
Use your own domain for your documentation site.
|
|
</Card>
|