Skip to content
Closed
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
55 changes: 55 additions & 0 deletions quickstart.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,11 @@

This quickstart guide shows you how to set up and deploy your documentation site in minutes.

After completing this guide, you will have a live documentation site ready to customize and expand.

Check warning on line 8 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L8

Avoid using 'will'.

<Info>

**Prerequisites**: Before you begin, [create an account](https://mintlify.com/start) and complete onboarding.

Check warning on line 12 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L12

': B' should be in lowercase.

</Info>

Expand All @@ -30,7 +30,7 @@

Your site's URL is available immediately. Use this URL for testing and sharing with your team while you are setting up your docs site.

### Install the GitHub App

Check warning on line 33 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L33

'Install the GitHub App' should use sentence-style capitalization.

Mintlify provides a GitHub App that automates deployment when you push changes to your repository.

Expand All @@ -54,11 +54,11 @@
### Authorize your GitHub account

1. Navigate to **Settings** in your Mintlify dashboard.
2. Select **My Profile** from the sidebar.

Check warning on line 57 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L57

Avoid first-person pronouns such as 'My'.
3. Select **Authorize GitHub account**. This opens a new tab to the GitHub authorization page.

<Info>
An admin for your GitHub organization may need to authorize your account depending on your organization settings.

Check warning on line 61 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L61

Use 'administrator' instead of 'admin'.
</Info>

## Editing workflows
Expand All @@ -77,13 +77,13 @@

The code-based workflow integrates with your existing development environment and Git repositories. This workflow is best for technical teams who want to manage documentation alongside code.

### Install the CLI

Check warning on line 80 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L80

Use 'command-line tool' instead of 'CLI'.

<Info>
**Prerequisite**: The CLI requires [Node.js](https://nodejs.org/en) v19 or higher.

Check warning on line 83 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L83

': T' should be in lowercase.

Check warning on line 83 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L83

Use 'command-line tool' instead of 'CLI'.
</Info>

To work locally with your documentation, install the Command Line Interface (CLI), called [mint](https://www.npmjs.com/package/mint), by running this command in your terminal:

Check warning on line 86 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L86

Use parentheses judiciously.

Check warning on line 86 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L86

Use 'command-line tool' instead of 'CLI'.

<CodeGroup>
```bash npm
Expand Down Expand Up @@ -126,7 +126,7 @@
mint dev
```

Your preview will be available at `localhost:3000`.

Check warning on line 129 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L129

Avoid using 'will'.

<Frame>
<img src="/images/quickstart/mintlify-dev-light.png" alt="Mintlify Dev" className="block dark:hidden" />
Expand All @@ -139,7 +139,7 @@

Mintlify automatically detects the changes, builds your documentation, and deploys the updates to your site. Monitor the deployment status in your GitHub repository commit history or the [dashboard](https://dashboard.mintlify.com).

After the deployment completes, your latest update will be available at `<your-project-name>.mintlify.app`.

Check warning on line 142 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L142

Avoid using 'will'.

<Card title="Jump to adding a custom domain" icon="arrow-down" href="#adding-a-custom-domain" horizontal>
Optionally, skip the web editor workflow and jump to adding a custom domain.
Expand All @@ -147,7 +147,7 @@

## Web editor workflow

The web editor workflow provides a what-you-see-is-what-you-get (WYSIWYG) interface for creating and editing documentation. This workflow is best for people who want to work in their web browser without additional local development tools.

Check warning on line 150 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L150

Use parentheses judiciously.

### Access the web editor

Expand All @@ -155,7 +155,7 @@
2. Select **Editor** on the left sidebar.

<Info>
If you have not installed the GitHub App, you will be prompted to install the app when you open the web editor.

Check warning on line 158 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L158

Use 'haven't' instead of 'have not'.

Check warning on line 158 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L158

Avoid using 'will'.

Check warning on line 158 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L158

In general, use active voice instead of passive voice ('be prompted').
</Info>

<Frame>
Expand All @@ -165,11 +165,11 @@

### Edit the documentation

In the web editor, you can navigate through your documentation files in the sidebar. Let's update the introduction page:

Check warning on line 168 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L168

Try to avoid using first-person plural like 'Let's'.

Find and select `index.mdx` in the file explorer.

Then, in the editor, update the title field to "Hello World".

Check warning on line 172 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L172

Commas and periods go inside quotation marks.

<Frame>
<img alt="Editing in Web Editor" src="/images/quickstart/web-editor-editing-light.png" className="block dark:hidden" />
Expand All @@ -188,7 +188,7 @@
Use branches to preview and review changes through pull requests before deploying to your live site.
</Tip>

For more details about using the web editor, including using branches and pull requests to collaborate and preview changes, see our [web editor documentation](/editor).

Check warning on line 191 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L191

Try to avoid using first-person plural like 'our'.

## Adding a custom domain

Expand All @@ -201,18 +201,73 @@
<img src="/images/quickstart/custom-domain-dark.png" alt="Custom Domain" className="hidden dark:block" />
</Frame>

Enter your domain (for example, `docs.yourcompany.com`) and follow the provided instructions to configure DNS settings with your domain provider.

Check warning on line 204 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L204

Use parentheses judiciously.

<Table>
| Record Type | Name | Value | TTL |
|-------------|------|-------|-----|
| CNAME | docs (or subdomain) | cname.mintlify.app | 3600 |

Check warning on line 209 in quickstart.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

quickstart.mdx#L209

Use parentheses judiciously.
</Table>

<Info>
DNS changes can take up to 48 hours to propagate, though changes often complete much sooner.
</Info>

## Customizing colors and fonts

After deploying your documentation, you can customize the appearance by setting colors and fonts in your `docs.json` file.

### Setting colors

Customize your documentation's color scheme by configuring the `colors` property in `docs.json`. You can set colors for light and dark modes:

```json docs.json
{
"colors": {
"primary": "#0D9373",
"light": "#07C983",
"dark": "#0D9373",
"background": {
"light": "#ffffff",
"dark": "#0f1117"
}
}
}
```

The `primary` color is used for interactive elements like links and buttons. The `light` and `dark` values control the primary color in each mode, while `background` sets the page background colors.

### Setting fonts

Configure custom fonts using the `fonts` property in `docs.json`. You can use Google Fonts, local font files, or externally hosted fonts:

```json docs.json
{
"fonts": {
"family": "Inter"
}
}
```

For separate heading and body fonts:

```json docs.json
{
"fonts": {
"heading": {
"family": "Playfair Display"
},
"body": {
"family": "Inter"
}
}
}
```

After updating your `docs.json` file, push your changes to see them reflected on your live site.

For more customization options, see the [themes documentation](/customize/themes) and [fonts documentation](/customize/fonts).

## Next steps

Congratulations! You have successfully deployed your documentation site with Mintlify. Here are suggested next steps to enhance your documentation:
Expand Down