DocTunes Documentation Starter Kit
Complete guide to constructing modern developer docs, configuring edge routing middleware, and setting up automated multi-lingual sub-proxy translations.
Getting Started
To bootstrap your new documentation portal with our TypeScript starter kit, execute the following command in your terminal:
# Clone and install dependencies
git clone https://github.com/doctunes/documentation-starter-kit.git my-docs
cd my-docs
npm install
# Start development server on localhost:3000
npm run dev- middleware.ts — Global multi-language sub-proxy rewrite handler
- app/layout.tsx — Global HTML shell, font declarations and navbar/footer
- app/page.tsx — Landing page & interactive hero
- app/docs/page.tsx — Main documentation hub
- app/playground/page.tsx — Interactive routing simulator
- components/ — Reusable CodeBlock, Navbar, SearchModal, etc.
Multi-Language Middleware
The heart of our internationalization engine is the edge middleware.ts placed in the root of the project. It intercepts all incoming requests, tests against an 80+ language prefix regex, and securely rewrites the request to the translation proxy.
| 1 | import { NextRequest, NextResponse } from 'next/server' |
| 2 | |
| 3 | const LANGUAGE_PATH = new RegExp( |
| 4 | '^/(?:mn-mong|sr-cyrl|sr-latn|zh-hans|zh-hant|es-419|en-us|en-gb|en-ca|en-au|fr-fr|fr-ca|fr-be|fr-ch|de-de|de-at|de-ch|pt-pt|pt-br|es-es|mww|af|sq|am|ar|hy|as|az|ba|eu|bn|bs|pt|bg|ca|hr|cs|da|dv|nl|en|et|fo|fj|fl|fi|fr|gl|ka|de|el|gu|ht|ha|he|hi|hu|is|ig|id|iu|ga|it|ja|kn|kk|rw|ko|ku|ky|lo|lv|ln|lt|lg|mk|mg|ms|ml|mt|mr|ne|no|or|ps|fa|pl|pa|ro|ru|sm|sd|si|sk|sl|so|es|sw|sv|ty|ta|tt|te|th|bo|ti|to|tr|tk|uk|ur|ug|uz|vi|cy|xh|yo|zu)(?:/|$)', |
| 5 | 'i' |
| 6 | ) |
| 7 | |
| 8 | export function middleware(request: NextRequest) { |
| 9 | if (!LANGUAGE_PATH.test(request.nextUrl.pathname)) { |
| 10 | return NextResponse.next() |
| 11 | } |
| 12 | |
| 13 | const destination = new URL( |
| 14 | request.nextUrl.pathname + request.nextUrl.search, |
| 15 | 'https://sub-proxy.multilipi.com' |
| 16 | ) |
| 17 | const headers = new Headers(request.headers) |
| 18 | headers.set('X-Translation-Mode', 'sub-directory') |
| 19 | headers.set('X-Original-Host', 'divanshu.doctunes.io') |
| 20 | return NextResponse.rewrite(destination, { request: { headers } }) |
| 21 | } |
| 22 | |
| 23 | export const config = { matcher: '/:path*' } |
Unlike standard HTTP 301/302 redirects, NextResponse.rewrite() modifies the backend proxy origin while keeping the exact URL in the user browser address bar completely intact.
Sub-Proxy Headers
When rewriting to https://sub-proxy.multilipi.com, two mandatory headers are injected to ensure accurate tenant isolation and translation mode:
| Header Name | Value | Purpose |
|---|---|---|
| X-Translation-Mode | sub-directory | Instructs MultiLipi translation engine to parse locale from leading path. |
| X-Original-Host | divanshu.doctunes.io | Specifies the registered origin domain for SSL and license validation. |
Supported Locales (80+)
The regular expression handles both generic 2-letter language codes (e.g. es, de, fr) and localized regional dialect tags (e.g. zh-hans, pt-br, sr-cyrl):
+ over 50 additional global languages matched dynamically.
UI Components & CodeBlocks
Every page includes pre-styled dark mode UI components such as copyable code blocks, responsive tables, callout banners, and modal dialogs.
import CodeBlock from '@/components/CodeBlock'
export default function MyDocs() {
return (
<div className="space-y-4">
<h3>Installation</h3>
<CodeBlock
code="npm install @doctunes/core"
language="bash"
showLineNumbers
/>
</div>
)
}API Reference
DocTunes provides REST & Edge helper functions to programmatically inspect locale configurations:
Returns the list of active sub-proxy locales, status, and target hostname.
{
"status": "online",
"gateway": "https://sub-proxy.multilipi.com",
"originalHost": "divanshu.doctunes.io",
"totalLocales": 84,
"defaultLocale": "en"
}Deployment Guide
Deploy your project instantly to Vercel, AWS Amplify, Cloudflare Pages, or self-hosted Docker containers:
# Deploy to production with custom environment
npx vercel --prod