Installation

TypeScript

This project and the components are written in TypeScript. We recommend using TypeScript for your project as well.

• We will add support for JavaScript in the future.
• More granular control over the installation process will also be added in the future.

Installation

Initilize a Next.js project by running the following command, use TypeScript and Tailwind CSS in the project, if already initialized, skip this step:

bunx create-next-app@latest .

To bootstrap a project with Readrave, you can use the following command:

bunx readrave@latest init

The command overwrites these files:

- next.config.mjs
- tailwind.config.ts
- app/globals.css
 
* mdx-components.tsx
* lib/utils.ts

The command adds these files:

# .readrave folder:
 
- docs.sidebar.yaml => sidebar configuration
 
# components/readrave folder:
 
- navbar.tsx => navbar for website (disabled by default)
- sidebar.tsx => sidebar for doc based pages
- backnext.tsx => previous / next in article
- breadcrumb.tsx => breadcrumb in article
- sheet.tsx => shadcn/ui sheet support
- scroll-area.tsx => shadcn/ui scroll area support
 
# app/(readrave)/docs folder:
 
- layout.tsx
- page.mdx
- sidebar.ts
- installation/page.mdx

Usage

Just run the following command to start the development server:

bun run dev

Now when you visit http://localhost:3000/docs, you should see the documentation with demo pages.

These demo pages include sidebar, breadcrumb, previous and next buttons, and are mobile responsive.