Docusaurus Installation Log

This document records the complete setup of the Docusaurus documentation system for the TradeEntry platform. It is intended for future developers who need to understand, reproduce, or extend this setup.

1. Installation Details

Item	Value
Installation Date	2026-05-24
Docusaurus Version	Latest stable (v3.x — classic preset)
Node.js Version	v24.16.0
npm Version	11.13.0
Template Used	`classic` (TypeScript)
Package Manager	npm
Platform	Windows 11 (PowerShell)

2. Commands Executed

Step 1 — Scaffold Docusaurus

# From project root: D:\kss\stock\tradeentry-VPS
npx --yes create-docusaurus@latest docs classic --typescript

This created the docs/ directory with the full classic TypeScript template including:

docusaurus.config.ts
sidebars.ts
src/pages/index.tsx
src/components/HomepageFeatures/
docs/ (sample tutorial docs)
blog/ (sample blog posts)
static/ (images and favicon)
package.json

Step 2 — Install Local Search Plugin

cd docs
npm install @easyops-cn/docusaurus-search-local

3. Folder Structure Created

docs/
├── blog/                          # Blog posts (Docusaurus blog feature)
│   ├── 2019-05-28-first-blog-post.mdx
│   ├── 2019-05-29-long-blog-post.mdx
│   ├── 2021-08-01-mdx-blog-post.mdx
│   ├── 2021-08-26-welcome/
│   ├── authors.yml
│   └── tags.yml
├── docs/
│   ├── user-guide/
│   │   ├── _category_.json
│   │   ├── getting-started.md
│   │   ├── login.md
│   │   ├── dashboard.md
│   │   ├── trade-entry.md
│   │   └── reports.md
│   ├── developer/
│   │   ├── _category_.json
│   │   ├── setup.md
│   │   ├── architecture.md
│   │   ├── frontend.md
│   │   ├── backend.md
│   │   ├── api.md
│   │   ├── deployment.md
│   │   └── docusaurus-installation-log.md   ← this file
│   ├── prompts/
│   │   ├── _category_.json
│   │   ├── coding-prompts.md
│   │   ├── debugging-prompts.md
│   │   └── trading-prompts.md
│   ├── versions/
│   │   ├── _category_.json
│   │   ├── v1.0.md
│   │   ├── v1.1.md
│   │   ├── v2.0.md
│   │   └── roadmap.md
│   ├── research/
│   │   ├── _category_.json
│   │   ├── market-profile.md
│   │   ├── neo-wave.md
│   │   ├── orb-tests.md
│   │   └── expiry-day.md
│   └── internal/
│       ├── _category_.json
│       ├── db-design.md
│       ├── websocket-flow.md
│       ├── auth-system.md
│       └── indicators.md
├── node_modules/
├── src/
│   ├── components/
│   │   └── HomepageFeatures/
│   ├── css/
│   │   └── custom.css
│   └── pages/
│       ├── index.tsx               ← customized homepage
│       ├── index.module.css        ← custom homepage CSS
│       └── markdown-page.mdx
├── static/
│   └── img/
├── docusaurus.config.ts            ← main config (customized)
├── sidebars.ts                     ← multi-sidebar config (customized)
└── package.json

4. Plugins Installed

Plugin	Version	Purpose
`@docusaurus/preset-classic`	(bundled)	Docs, blog, theme
`@easyops-cn/docusaurus-search-local`	latest	Offline full-text search
`@mdx-js/react`	(bundled)	MDX support
`prism-react-renderer`	(bundled)	Code syntax highlighting
`clsx`	(bundled)	Conditional CSS class utility

5. Search Plugin Setup

The @easyops-cn/docusaurus-search-local plugin provides offline, client-side search without requiring Algolia or any external service.

Configuration in docusaurus.config.ts:

plugins: [
  [
    require.resolve('@easyops-cn/docusaurus-search-local'),
    {
      hashed: true,                          // Hash index file names for cache busting
      language: ['en'],
      highlightSearchTermsOnTargetPage: true,
      explicitSearchResultPath: true,
      indexBlog: true,
      indexDocs: true,
      docsRouteBasePath: '/docs',
    },
  ],
],

How it works:

During npm run build, the plugin crawls all docs and blog pages and generates a search index.
The index is served as static files in build/.
Users can search without any internet connection once the site is loaded.

⚠️ Known behaviour — not a bug: When running npm start (dev mode), the search box shows: "The search index is only available when you run docusaurus build!" This is expected. The search index is only generated during npm run build. It does not work in development mode.

Mode	Command	Search	Hot Reload
Development	`npm start`	❌	✅
Production preview	`npm run build && npm run serve`	✅	❌

6. Sidebar Configuration Summary

Four separate sidebars are defined in sidebars.ts:

Sidebar ID	Sections Covered	Navbar Link
`userGuideSidebar`	User Guide	User Guide
`developerSidebar`	Developer + Prompts + Versions	Developer
`researchSidebar`	Research	Research
`internalSidebar`	Internal (DB, WebSocket, Auth)	Internal

Each section uses _category_.json for display labels and generated index pages.

7. Dark Mode Configuration

colorMode: {
  defaultMode: 'light',
  disableSwitch: false,       // Toggle visible in navbar
  respectPrefersColorScheme: false,
},

Users can toggle dark/light mode using the sun/moon icon in the top-right navbar.

8. How to Run Locally

cd docs
npm install      # Only needed first time or after pulling new changes
npm start        # Dev server at http://localhost:3000

Hot reload is enabled — edit any .md, .mdx, or .tsx file and see changes instantly.
Search does not work in dev mode.

9. How to Build for Production

cd docs
npm run build    # Generates static site in docs/build/
npm run serve    # Serves the production build locally at http://localhost:3000

The docs/build/ directory contains the full static site ready to deploy to any web server (Nginx, Apache, GitHub Pages, Netlify, etc.).

To serve from Nginx:

server {
    listen 80;
    server_name docs.yourdomain.com;
    root /opt/tradeentry-VPS/docs/build;
    index index.html;
    location / {
        try_files $uri /index.html;
    }
}

10. Future Improvements

Improvement	Priority	Notes
Replace default SVGs with custom TradeEntry logo	Medium	Update `static/img/logo.svg`
Add versioned docs for API breaking changes	Low	Use Docusaurus versioning feature
Add i18n support (Hindi)	Low	Use `@docusaurus/plugin-content-docs` i18n
Set production URL when deploying	High	Update `url` in `docusaurus.config.ts`
Enable GitHub Pages auto-deploy	Medium	Add `deploy` script in `package.json`
Populate research docs with real data	High	Add actual backtest results and charts
Add OpenAPI plugin	Medium	`docusaurus-plugin-openapi-docs`
Add custom branding colors in `custom.css`	Low	Match TradeEntry frontend palette

This log was auto-generated during the Docusaurus setup on 2026-05-24.

1. Installation Details​

2. Commands Executed​

Step 1 — Scaffold Docusaurus​

Step 2 — Install Local Search Plugin​

3. Folder Structure Created​

4. Plugins Installed​

5. Search Plugin Setup​

6. Sidebar Configuration Summary​

7. Dark Mode Configuration​

8. How to Run Locally​

9. How to Build for Production​

10. Future Improvements​