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
Edit directly in your browser with our visual editor.
75
77
</Card>
76
78
77
-
## Code-based workflow
79
+
## Developer workflow
78
80
79
-
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.
81
+
Perfect for teams who want documentation integrated with their development process.
80
82
81
-
### Install the CLI
83
+
### Set up the CLI
82
84
83
-
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:
85
+
Install our command-line tool to work with your docs locally:
84
86
85
87
<CodeGroup>
86
88
```bash npm
@@ -93,15 +95,15 @@ To work locally with your documentation, install the Command Line Interface (CLI
93
95
</CodeGroup>
94
96
95
97
<Info>
96
-
You need Node.js installed on your machine. If you encounter installation issues, check the troubleshooting guide.
98
+
Requires Node.js v19 or higher. Having trouble? Check our troubleshooting section below.
97
99
</Info>
98
100
99
-
### Edit the documentation
101
+
### Make your first edit
100
102
101
-
After setting up your environment, you can start editing your documentation files. For example, update the title of the introduction page:
103
+
Let's update your homepage to see the workflow in action:
102
104
103
-
1.Open your repository created during onboarding.
104
-
2. Open `index.mdx` and locate the top of the file:
105
+
1.Clone the repository created during setup
106
+
2. Open `index.mdx` and find the frontmatter:
105
107
106
108
```mdx index.mdx
107
109
---
@@ -110,142 +112,147 @@ description: "This is the introduction to the documentation"
110
112
---
111
113
```
112
114
113
-
3.Update the `title` field to `"Hello World"`.
115
+
3.Change the titleto something new:
114
116
115
117
```mdx index.mdx {2}
116
118
---
117
-
title: "Hello World"
119
+
title: "Welcome to our docs"
118
120
description: "This is the introduction to the documentation"
119
121
---
120
122
```
121
123
122
-
### Preview the changes
124
+
### Test locally
123
125
124
-
To preview the changes locally, run the following command:
126
+
See your changes before publishing:
125
127
126
128
```bash
127
129
mint dev
128
130
```
129
131
130
-
Your preview will be available at `localhost:3000`.
When you are ready to publish your changes, push them to your repository.
141
+
Ready to go live? Just push to your repository:
140
142
141
-
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).
143
+
```bash
144
+
git add .
145
+
git commit -m "Update homepage title"
146
+
git push
147
+
```
142
148
143
-
After the deployment completes, your latest update will be available at `<your-project-name>.mintlify.app`.
149
+
Mintlify detects your changes and automatically rebuilds your site. Track the deployment in your GitHub Actions or dashboard.
144
150
145
-
<Cardtitle="Jump to adding a custom domain"icon="arrow-down"href="#adding-a-custom-domain"horizontal>
146
-
Optionally, skip the web editor workflow and jump to adding a custom domain.
151
+
Your updates appear at `<your-project-name>.mintlify.app` within minutes.
152
+
153
+
<Cardtitle="Skip to custom domain setup"icon="arrow-down"href="#custom-domain"horizontal>
154
+
Ready to use your own domain? Jump ahead to the custom domain section.
147
155
</Card>
148
156
149
-
## Web editor workflow
157
+
## Browser workflow
150
158
151
-
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.
159
+
Edit your documentation directly in your browser - no local setup required.
152
160
153
-
### Access the web editor
161
+
### Open the editor
154
162
155
-
1. Log in to your [dashboard](https://dashboard.mintlify.com).
156
-
2.Select**Editor**on the left sidebar.
163
+
1. Log into your [dashboard](https://dashboard.mintlify.com)
164
+
2.Click**Editor**in the sidebar
157
165
158
166
<Info>
159
-
If you have not installed the GitHub App, you will be prompted to install the app when you open the web editor.
167
+
First time? You'll be prompted to install the GitHub App if you haven't already.
160
168
</Info>
161
169
162
170
<Frame>
163
171
<imgalt="The Mintlify web editor in the visual editor mode"src="/images/quickstart/web-editor-light.png"className="block dark:hidden" />
164
172
<imgalt="The Mintlify web editor in the visual editor mode"src="/images/quickstart/web-editor-dark.png"className="hidden dark:block" />
165
173
</Frame>
166
174
167
-
### Edit the documentation
168
-
169
-
In the web editor, you can navigate through your documentation files in the sidebar. Let's update the introduction page:
175
+
### Edit your content
170
176
171
-
Find and select `index.mdx` in the file explorer.
177
+
Navigate to any file in the sidebar and start editing. Let's update the homepage:
172
178
173
-
Then, in the editor, update the title field to "Hello World".
179
+
1. Click `index.mdx` in the file tree
180
+
2. Change the title field to "Welcome to our docs"
174
181
175
182
<Frame>
176
183
<imgalt="Editing in Web Editor"src="/images/quickstart/web-editor-editing-light.png"className="block dark:hidden" />
177
184
<imgalt="Editing in Web Editor"src="/images/quickstart/web-editor-editing-dark.png"className="hidden dark:block" />
178
185
</Frame>
179
186
180
187
<Tip>
181
-
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.
188
+
Press <kbd>/</kbd> anywhere in the editor to open the command palette and access formatting tools.
182
189
</Tip>
183
190
184
-
### Publish your changes
191
+
### Go live
185
192
186
-
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.
193
+
Click **Publish** in the top-right corner. Your changes deploy instantly to your live site.
187
194
188
195
<Tip>
189
-
Use branches to preview and review changes through pull requests before deploying to your live site.
196
+
Use branches for team collaboration and review changes before they go live.
190
197
</Tip>
191
198
192
-
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/getting-started).
199
+
Learn more about advanced editor features in our [web editor guide](/editor/getting-started).
193
200
194
-
## Adding a custom domain
201
+
## Custom domain
195
202
196
-
While your `<your-project-name>.mintlify.app` subdomain works well for testing and development, most teams prefer using a custom domain for production documentation.
203
+
Ready to use your own domain instead of the Mintlify subdomain?
197
204
198
-
To add a custom domain, navigate to the [Domain Setup](https://dashboard.mintlify.com/settings/deployment/custom-domain) page in your dashboard.
205
+
Head to [Domain Setup](https://dashboard.mintlify.com/settings/deployment/custom-domain) in your dashboard.
Use callouts, code blocks, tabs, and other interactive elements.
232
239
</Card>
233
-
<Cardtitle="Set up API references"icon="code"href="/api-playground/overview"horizontal>
234
-
Create interactive API references with OpenAPI and AsyncAPI specifications.
240
+
<Cardtitle="Build API docs"icon="code"href="/api-playground/overview"horizontal>
241
+
Generate interactive API references from OpenAPI specifications.
235
242
</Card>
236
243
237
-
## Troubleshooting
244
+
## Common issues
238
245
239
-
If you encounter issues during the setup process, check these common troubleshooting solutions:
246
+
Running into problems? Here are quick fixes for the most common issues:
240
247
241
248
<AccordionGroup>
242
-
<Accordiontitle="Local preview not working">
243
-
Make sure you have Node.js v19+ installed and that you run the `mint dev`command from the directory containing your `docs.json` file.
249
+
<Accordiontitle="Can't run mint dev locally">
250
+
Check that you have Node.js v19+ installed and you're running the command from the folder containing your `docs.json` file.
244
251
</Accordion>
245
-
<Accordiontitle="Changes not reflecting on live site">
246
-
Deployment can take upwards 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.
252
+
<Accordiontitle="Changes aren't showing up">
253
+
Deployments can take 2-3 minutes. Check your GitHub Actions tab or dashboard deployment logs for any build errors.
247
254
</Accordion>
248
-
<Accordiontitle="Custom domain not connecting">
249
-
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.
255
+
<Accordiontitle="Custom domain isn't working">
256
+
Double-check your DNS records and wait for propagation. Use [DNSChecker](https://dnschecker.org) to verify your CNAME record is set up correctly.
![mintlify-development[bot]](https://avatars.githubusercontent.com/in/222252?v=4&size=40){kind=avatar}
0 commit comments