Files
woonoow-docs/contents/docs/getting-started/quick-start-guide/index.mdx
2025-05-25 03:20:17 +07:00

128 lines
2.9 KiB
Plaintext

---
title: Quick Start Guide
description: Get up and running with DocuBook in minutes with this comprehensive guide
date: 20-05-2025
---
Welcome to DocuBook! This guide will help you set up your documentation site quickly and efficiently.
## Prerequisites
Before we begin, make sure you have the following installed:
- [Git](https://git-scm.com/)
- [Node.js 18+](https://nodejs.org/) or [Bun 1.0+](https://bun.sh/)
- A package manager (npm, yarn, or pnpm)
## Installation
<Note type="note" title="Note">
Follow the instructions on the [installation page](/docs/getting-started/installation) to install the required dependencies and set up your project.
</Note>
## Project Setup
### Customize Branding
<Stepper>
<StepperItem title="Step 1: Add Favicon">
Place your favicon at `public/favicon.ico`
</StepperItem>
<StepperItem title="Step 2: Add Logo">
Place your logo at `public/images/docu.svg` (SVG format recommended)
</StepperItem>
<StepperItem title="Step 3: Update Site Info">
Edit `docu.json` to update site name, description, and other settings
</StepperItem>
</Stepper>
## Creating Content
### File Structure
DocuBook uses the following structure:
````plaintext
contents/
docs/
getting-started/
quick-start-guide/ <-- You are here
index.mdx
guides/
components/
index.mdx
````
### Adding New Pages
<Stepper>
<StepperItem title="Step 1: Create a New Folder">
Create a new folder in `contents/docs/getting-started/` for your content section
```bash
mkdir -p contents/docs/getting-started/your-page-title
```
</StepperItem>
<StepperItem title="Step 2: Add MDX File">
Create an `index.mdx` file with frontmatter:
````markdown
---
title: Your Page Title
description: Brief description of your page
date: 20-05-2025
---
# Your Content Here
Start writing your documentation using Markdown or MDX components.
````
</StepperItem>
<StepperItem title="Step 3: Add to Navigation">
Update the navigation in `docu.json`:
```json:docu.json showLineNumbers {8}
{
"routes": [
{
"title": "Getting Started",
"href": "/getting-started",
"noLink": true,
"items": [
{ "title": "Your Page Title", "href": "/your-page-title" } // Add your page here separated by comma `,`
]
}
]
}
```
</StepperItem>
</Stepper>
## Development
Start the development server:
```bash
npm run dev
# or
bun dev
```
Visit [http://localhost:3000](http://localhost:3000) to see your site.
## Building for Production
When you're ready to deploy:
```bash
npm run build
npm start
```
## Need Help?
<Note type="info">
Check out the [Components Guide](/docs/getting-started/components) to learn about all available components.
</Note>
<Note type="warning">
Make sure to commit your changes to version control before deploying.
</Note>