You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
For users who prefer a visual interface in their web browser. Click to jump to this section.
73
-
</Card>
22
+
### Web editor
74
23
75
-
## Code-based workflow
24
+
1. Open the [Editor](https://dashboard.mintlify.com/editor) in your dashboard
25
+
2. Select `index.mdx` from the file explorer
26
+
3. Change the title to "Hello World"
27
+
4. Click **Publish**
76
28
77
-
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.
29
+
Your changes deploy immediately.
78
30
79
-
### Install the CLI
31
+
### Local development
80
32
81
-
<Info>
82
-
**Prerequisite**: The CLI requires [Node.js](https://nodejs.org/en) v19 or higher.
83
-
</Info>
84
-
85
-
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:
33
+
Install the CLI:
86
34
87
35
<CodeGroup>
88
36
```bash npm
@@ -94,160 +42,31 @@ To work locally with your documentation, install the Command Line Interface (CLI
94
42
```
95
43
</CodeGroup>
96
44
97
-
### Create a new project
98
-
99
-
Run `mint new` to create a new documentation project. See the [CLI installation guide](/installation#create-a-new-project) for details on the command and flags.
100
-
101
-
### Edit the documentation
102
-
103
-
After setting up your project, you can start editing your documentation files. For example, update the title of the introduction page:
104
-
105
-
1. Navigate to your documentation repository.
106
-
2. Open `index.mdx` and locate the top of the file:
107
-
108
-
```mdx index.mdx
109
-
---
110
-
title: "Introduction"
111
-
description: "This is the introduction to the documentation"
112
-
---
113
-
```
114
-
115
-
3. Update the `title` field to `"Hello World"`.
116
-
117
-
```mdx index.mdx {2}
118
-
---
119
-
title: "Hello World"
120
-
description: "This is the introduction to the documentation"
121
-
---
122
-
```
123
-
124
-
### Preview the changes
45
+
Edit your docs:
125
46
126
-
To preview the changes locally, run the following command:
47
+
1. Run `mint new` to create a project
48
+
2. Open `index.mdx` and change the title to "Hello World"
49
+
3. Run `mint dev` to preview at `localhost:3000`
50
+
4. Push your changes to deploy
127
51
128
-
```bash
129
-
mint dev
130
-
```
52
+
## Add a custom domain
131
53
132
-
Your preview is available at `localhost:3000`.
54
+
Navigate to [Domain Setup](https://dashboard.mintlify.com/settings/deployment/custom-domain) and add your domain (e.g., `docs.yourcompany.com`).
When you are ready to publish your changes, push them to your repository.
142
-
143
-
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).
144
-
145
-
After the deployment completes, your latest update will be available at `<your-project-name>.mintlify.app`.
146
-
147
-
<Cardtitle="Jump to adding a custom domain"icon="arrow-down"href="#adding-a-custom-domain"horizontal>
148
-
Optionally, skip the web editor workflow and jump to adding a custom domain.
149
-
</Card>
150
-
151
-
## Web editor workflow
152
-
153
-
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.
154
-
155
-
### Access the web editor
156
-
157
-
1. Log in to your [dashboard](https://dashboard.mintlify.com).
158
-
2. Select **Editor** on the left sidebar.
159
-
160
-
<Info>
161
-
If you have not installed the GitHub App, you will be prompted to install the app when you open the web editor.
162
-
</Info>
163
-
164
-
<Frame>
165
-
<imgalt="The Mintlify web editor in the visual editor mode"src="/images/quickstart/web-editor-light.png"className="block dark:hidden" />
166
-
<imgalt="The Mintlify web editor in the visual editor mode"src="/images/quickstart/web-editor-dark.png"className="hidden dark:block" />
167
-
</Frame>
168
-
169
-
### Edit the documentation
170
-
171
-
In the web editor, you can navigate through your documentation files in the sidebar. Let's update the introduction page:
172
-
173
-
Find and select `index.mdx` in the file explorer.
174
-
175
-
Then, in the editor, update the title field to "Hello World".
176
-
177
-
<Frame>
178
-
<imgalt="Editing in Web Editor"src="/images/quickstart/web-editor-editing-light.png"className="block dark:hidden" />
179
-
<imgalt="Editing in Web Editor"src="/images/quickstart/web-editor-editing-dark.png"className="hidden dark:block" />
180
-
</Frame>
181
-
182
-
<Tip>
183
-
The editor provides a rich set of formatting tools and components. Type <kbd>/</kbd> in the editor to open the command menu and access these tools.
184
-
</Tip>
185
-
186
-
### Publish your changes
187
-
188
-
When you're satisfied with your edits, select the **Publish** button in the top-right corner. Your changes are immediately deployed to your documentation site.
189
-
190
-
<Tip>
191
-
Use branches to preview and review changes through pull requests before deploying to your live site.
192
-
</Tip>
193
-
194
-
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).
195
-
196
-
## Adding a custom domain
197
-
198
-
While your `<your-project-name>.mintlify.app` subdomain works well for testing and development, most teams prefer using a custom domain for production documentation.
199
-
200
-
To add a custom domain, navigate to the [Domain Setup](https://dashboard.mintlify.com/settings/deployment/custom-domain) page in your dashboard.
<Cardtitle="Set up API references"icon="code"href="/api-playground/overview"horizontal>
236
-
Create interactive API references with OpenAPI and AsyncAPI specifications.
237
-
</Card>
238
-
239
-
## Troubleshooting
240
-
241
-
If you encounter issues during the setup process, check these common troubleshooting solutions:
242
-
243
-
<AccordionGroup>
244
-
<Accordiontitle="Local preview not working">
245
-
Make sure you have Node.js v19+ installed and that you run the `mint dev` command from the directory containing your `docs.json` file.
246
-
</Accordion>
247
-
<Accordiontitle="Changes not reflecting on live site">
248
-
Deployment can take up to a few minutes. Check your GitHub Actions (for code-based workflow) or deployment logs in the Mintlify dashboard to ensure there are no build errors.
249
-
</Accordion>
250
-
<Accordiontitle="Custom domain not connecting">
251
-
Verify that your DNS records are set up correctly and allow sufficient time for DNS propagation (up to 48 hours). You can use tools like [DNSChecker](https://dnschecker.org) to verify your CNAME record.
![mintlify-development[bot]](https://avatars.githubusercontent.com/in/222252?v=4&size=40){kind=avatar}
0 commit comments