nest-scramble 1.8.2 β†’ 1.8.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,749 +1,765 @@
1
- # Nest-Scramble
2
-
3
- > Zero-config API Documentation & Postman Generator for NestJS using static analysis
4
-
5
- [![npm version](https://badge.fury.io/js/nest-scramble.svg)](https://badge.fury.io/js/nest-scramble)
6
- [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
7
- [![GitHub stars](https://img.shields.io/github/stars/Eng-MMustafa/nest-scramble.svg)](https://github.com/Eng-MMustafa/nest-scramble)
8
- [![Author](https://img.shields.io/badge/Author-Mohamed%20Mustafa-blue.svg)](https://github.com/Eng-MMustafa)
9
-
10
- ## πŸš€ Why Nest-Scramble?
11
-
12
- As a NestJS developer, I was tired of drowning in `@ApiProperty` decorators just to get basic API documentation. I longed for a zero-config solution where docs just worked without polluting my code. **Nest-Scramble changes that** by using static TypeScript analysis to automatically generate:
13
-
14
- - βœ… **OpenAPI 3.0 specifications** from your DTOs
15
- - βœ… **Interactive Scalar UI documentation** with zero configuration
16
- - βœ… **Postman collections** with smart mock data
17
- - βœ… **Live mocking** for rapid prototyping
18
-
19
- **Zero configuration. Zero decorators. Just pure TypeScript.**
20
-
21
- ## πŸ“– The Story Behind Nest-Scramble
22
-
23
- It all started with a vision: API documentation should be effortless. As a developer passionate about clean code and developer experience, I knew there had to be a better way than manual decorators and runtime reflection.
24
-
25
- When I switched to NestJS for its powerful architecture and TypeScript-first approach, I was disappointed by the lack of zero-config documentation tools. Hours wasted on `@ApiProperty({ type: String })` instead of building features.
26
-
27
- I knew there had to be a better way. Leveraging my expertise in static analysis and Abstract Syntax Trees (AST), I built Nest-Scramble to bring that same developer experience to the Node.js ecosystem. It's not just a toolβ€”it's my mission to make API documentation as effortless as it should be.
28
-
29
- ## πŸ† Features Gallery
30
-
31
- | Feature | Nest-Scramble | Swagger (@nestjs/swagger) |
32
- |---------|---------------|---------------------------|
33
- | Analysis Method | Static AST Traversal | Runtime Reflection |
34
- | Performance Impact | Zero Overhead | Decorator Runtime Cost |
35
- | Type Accuracy | Full TypeScript Inference | Partial Mapping |
36
- | Circular References | Auto-Detected & Resolved | Manual Workarounds |
37
- | Bundle Size | Minimal | Heavy with Decorators |
38
- | Code Purity | Zero Decorators | Decorator Pollution |
39
- | Future Compatibility | TypeScript Evolution Ready | Framework Dependent |
40
-
41
- ## 🧠 The Vision
42
-
43
- Nest-Scramble embodies my engineering philosophy: **Clean Code through Automation**. As a developer who values TypeScript's type safety and NestJS's architecture, I believe that documentation should never compromise code quality.
44
-
45
- This library represents a paradigm shiftβ€”from manual, error-prone decorators to intelligent, compile-time analysis. It's about empowering developers to focus on building features, not fighting frameworks.
46
-
47
- ## πŸ”¬ How it's Built
48
-
49
- Nest-Scramble is engineered using cutting-edge static analysis techniques that traditional tools cannot match:
50
-
51
- - **Abstract Syntax Tree (AST) Traversal**: Direct manipulation of TypeScript's AST using `ts-morph` for unparalleled type inference
52
- - **Zero-Decorator Architecture**: Pure TypeScript classes remain untouched, preserving domain integrity
53
- - **Compile-Time Intelligence**: All analysis happens at build-time, eliminating runtime performance costs
54
- - **Circular Reference Mastery**: Advanced algorithms detect and handle complex type relationships automatically
55
-
56
- This approach delivers what runtime reflection simply cannot: perfect accuracy, zero overhead, and future-proof compatibility with TypeScript's evolving type system.
57
-
58
- ## ⚑ Quick Start - Zero Config (2 Steps!)
59
-
60
- ### Option A: Auto-Injection (Recommended - 30 seconds!)
61
-
62
- ```bash
63
- # 1. Install
64
- npm install nest-scramble
65
-
66
- # 2. Auto-inject into your project
67
- npx nest-scramble init
68
-
69
- # 3. Start your app
70
- npm run start:dev
71
-
72
- # πŸŽ‰ Done! Visit http://localhost:3000/docs
73
- ```
74
-
75
- The `init` command automatically:
76
- - βœ… Adds the import statement to your `app.module.ts`
77
- - βœ… Injects `NestScrambleModule.forRoot()` into your imports
78
- - βœ… Uses smart defaults with zero configuration needed
79
-
80
- ### Option B: Manual Installation (3 Steps)
81
-
82
- #### 1. Install the Package
83
-
84
- ```bash
85
- # Using npm
86
- npm install nest-scramble
87
-
88
- # Using yarn
89
- yarn add nest-scramble
90
-
91
- # Using pnpm
92
- pnpm add nest-scramble
93
- ```
94
-
95
- #### 2. Import Module in Your NestJS App
96
-
97
- **Zero-Config (Recommended):**
98
- ```typescript
99
- import { Module } from '@nestjs/common';
100
- import { NestScrambleModule } from 'nest-scramble';
101
-
102
- @Module({
103
- imports: [
104
- NestScrambleModule.forRoot(), // 🎯 That's it! Zero config needed
105
- ],
106
- })
107
- export class AppModule {}
108
- ```
109
-
110
- **With Custom Options:**
111
- ```typescript
112
- import { Module } from '@nestjs/common';
113
- import { NestScrambleModule } from 'nest-scramble';
114
-
115
- @Module({
116
- imports: [
117
- NestScrambleModule.forRoot({
118
- sourcePath: 'src', // Auto-detected by default
119
- baseUrl: 'http://localhost:3000', // Auto-detected from PORT env
120
- enableMock: true, // Enabled by default
121
- autoExportPostman: false, // Disabled by default
122
- apiTitle: 'My API', // Auto-detected from package.json
123
- apiVersion: '1.0.0', // Auto-detected from package.json
124
- }),
125
- ],
126
- })
127
- export class AppModule {}
128
- ```
129
-
130
- #### 3. Start Your App and Visit Documentation
131
-
132
- ```bash
133
- npm run start:dev
134
- ```
135
-
136
- You'll see a beautiful dashboard in your terminal:
137
-
138
- ```
139
- β”Œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”
140
- β”‚ πŸš€ Nest-Scramble by Mohamed Mustafa is Active! β”‚
141
- β”œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€
142
- β”‚ πŸ“– Docs: http://localhost:3000/docs β”‚
143
- β”‚ πŸ“„ JSON: http://localhost:3000/docs-json β”‚
144
- β”‚ 🎭 Mock: http://localhost:3000/scramble-mock β”‚
145
- β”‚ ✨ Scanning: src β”‚
146
- β”‚ 🎯 Controllers: 5 β”‚
147
- β””β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”˜
148
- ```
149
-
150
- Then open your browser:
151
-
152
- - **πŸ“– Professional API Docs (Modal UI)**: http://localhost:3000/docs
153
- - **πŸ“„ OpenAPI JSON Spec**: http://localhost:3000/docs-json
154
- - **🎭 Mock Endpoints**: http://localhost:3000/scramble-mock/*
155
-
156
- **That's it!** Nest-Scramble automatically:
157
- - πŸ” Detects your project structure
158
- - πŸ“‚ Finds your controllers
159
- - πŸ“ Generates OpenAPI spec
160
- - 🎨 Serves beautiful documentation
161
- - 🎭 Provides mock endpoints
162
-
163
- ## βš™οΈ Configuration Options
164
-
165
- ```typescript
166
- NestScrambleModule.forRoot({
167
- // Documentation path served by the module
168
- path: '/docs', // default: '/docs'
169
-
170
- // Source directory to scan for controllers
171
- sourcePath: 'src', // default: 'src'
172
-
173
- // API base URL for OpenAPI spec
174
- baseUrl: 'http://localhost:3000', // default: 'http://localhost:3000'
175
-
176
- // Enable live mocking endpoints under /scramble-mock/*
177
- enableMock: true, // default: true
178
-
179
- // Auto-export a Postman collection when generating
180
- autoExportPostman: true,
181
- postmanOutputPath: 'collection.json',
182
-
183
- // API metadata
184
- apiTitle: 'My API', // API documentation title
185
- apiVersion: '1.0.0', // API version number
186
- })
187
- ```
188
-
189
- ### Configuration Details
190
-
191
- | Option | Type | Default | Description |
192
- |--------|------|---------|-------------|
193
- | `path` | `string` | `'/docs'` | Documentation route path |
194
- | `sourcePath` | `string` | `'src'` | Directory where your NestJS controllers are located |
195
- | `baseUrl` | `string` | `'http://localhost:3000'` | Base URL for your API (used in OpenAPI spec) |
196
- | `enableMock` | `boolean` | `true` | Enable `/scramble-mock/*` endpoints for testing |
197
- | `autoExportPostman` | `boolean` | `false` | Automatically generate Postman collection file |
198
- | `postmanOutputPath` | `string` | `'collection.json'` | Output path for Postman collection |
199
- | `apiTitle` | `string` | Auto-detected | API documentation title |
200
- | `apiVersion` | `string` | Auto-detected | API version number |
201
-
202
- ## 🎭 Live Mocking Guide
203
-
204
- Nest-Scramble provides **instant API mocking** without writing controllers:
205
-
206
- ### How It Works
207
- 1. Define your DTOs and controllers normally
208
- 2. Enable `enableMock: true`
209
- 3. All requests to `/scramble-mock/*` return smart mock data
210
-
211
- ### Example
212
-
213
- **Controller:**
214
- ```typescript
215
- @Controller('users')
216
- export class UserController {
217
- @Get(':id')
218
- getUser(@Param('id') id: number): UserDto {
219
- // Your logic here
220
- }
221
- }
222
- ```
223
-
224
- **Mock Response:**
225
- ```bash
226
- GET /scramble-mock/users/123
227
- # Returns: { "id": 123, "name": "John Doe", "email": "john@example.com" }
228
- ```
229
-
230
- **Smart Mocking Examples:**
231
- - `email` β†’ `faker.internet.email()`
232
- - `name` β†’ `faker.person.fullName()`
233
- - `createdAt` β†’ `faker.date.recent()`
234
- - `posts` β†’ Array of mock posts
235
-
236
- ![Live mocking demo](mock-demo.gif)
237
-
238
- ## πŸ”§ Advanced Usage
239
-
240
- ### CLI Generation
241
-
242
- The Nest-Scramble CLI allows you to generate API documentation without running your NestJS application.
243
-
244
- #### Generate OpenAPI Specification
245
-
246
- ```bash
247
- # Using npx
248
- npx nest-scramble generate src
249
-
250
- # Using pnpm dlx
251
- pnpm dlx nest-scramble generate src
252
-
253
- # Using yarn dlx
254
- yarn dlx nest-scramble generate src
255
- ```
256
-
257
- #### CLI Options
258
-
259
- ```bash
260
- nest-scramble generate <sourcePath> [options]
261
-
262
- Options:
263
- -o, --output <file> Output file path (default: "openapi.json")
264
- -f, --format <type> Output format: openapi or postman (default: "openapi")
265
- -b, --baseUrl <url> Base URL for the API (default: "http://localhost:3000")
266
- -t, --title <title> API title (default: "NestJS API")
267
- -v, --apiVersion <version> API version (default: "1.0.0")
268
- -h, --help Display help for command
269
- ```
270
-
271
- #### Examples
272
-
273
- **Generate OpenAPI JSON:**
274
- ```bash
275
- pnpm dlx nest-scramble generate src --output openapi.json
276
- ```
277
-
278
- **Generate Postman Collection:**
279
- ```bash
280
- pnpm dlx nest-scramble generate src --format postman --output collection.json
281
- ```
282
-
283
- **Custom API Details:**
284
- ```bash
285
- pnpm dlx nest-scramble generate src \
286
- --output my-api.json \
287
- --title "My Awesome API" \
288
- --apiVersion "2.0.0" \
289
- --baseUrl "https://api.example.com"
290
- ```
291
-
292
- **Check Version:**
293
- ```bash
294
- pnpm dlx nest-scramble --version
295
- ```
296
-
297
- ### Programmatic API
298
-
299
- Use Nest-Scramble programmatically in your Node.js scripts:
300
-
301
- ```typescript
302
- import { ScannerService, OpenApiTransformer, PostmanCollectionGenerator } from 'nest-scramble';
303
- import * as fs from 'fs';
304
-
305
- // Scan controllers
306
- const scanner = new ScannerService();
307
- const controllers = scanner.scanControllers('src');
308
-
309
- // Generate OpenAPI spec
310
- const transformer = new OpenApiTransformer('http://localhost:3000');
311
- const openApiSpec = transformer.transform(
312
- controllers,
313
- 'My API',
314
- '1.0.0',
315
- 'http://localhost:3000'
316
- );
317
-
318
- // Save to file
319
- fs.writeFileSync('openapi.json', JSON.stringify(openApiSpec, null, 2));
320
-
321
- // Or generate Postman collection
322
- const postmanGen = new PostmanCollectionGenerator('http://localhost:3000');
323
- const collection = postmanGen.generateCollection(controllers);
324
- fs.writeFileSync('collection.json', JSON.stringify(collection, null, 2));
325
- ```
326
-
327
- ### CI/CD Integration
328
-
329
- Add to your CI/CD pipeline to auto-generate documentation:
330
-
331
- ```yaml
332
- # .github/workflows/docs.yml
333
- name: Generate API Docs
334
-
335
- on:
336
- push:
337
- branches: [main]
338
-
339
- jobs:
340
- generate-docs:
341
- runs-on: ubuntu-latest
342
- steps:
343
- - uses: actions/checkout@v3
344
- - uses: actions/setup-node@v3
345
- with:
346
- node-version: '18'
347
- - run: npm install
348
- - run: npx nest-scramble generate src --output openapi.json
349
- - uses: actions/upload-artifact@v3
350
- with:
351
- name: api-docs
352
- path: openapi.json
353
- ```
354
-
355
- ## 🎨 Documentation UI - Professional API Dashboard
356
-
357
- ### ✨ Professional Dashboard Design (NEW!)
358
-
359
- Nest-Scramble features a **modern, professional API dashboard** where each request is displayed on a separate page with focused documentation and beautiful interactions!
360
-
361
- **πŸš€ Key Features:**
362
- - **Separate Pages Per Endpoint** - Each request opens in its own modal with dedicated view
363
- - **Smart Search & Filtering** - Real-time search across all endpoints
364
- - **Controller Grouping** - Endpoints organized by tags with counters
365
- - **Gradient Backgrounds** - Dynamic colors based on your brand
366
- - **Smooth Animations** - Professional transitions and hover effects
367
- - **Color-Coded HTTP Methods** - Visual distinction for different request types:
368
- - GET = Green (`#c6f6d5`)
369
- - POST = Blue (`#bee3f8`)
370
- - PUT = Orange (`#feebc8`)
371
- - PATCH = Purple (`#e9d8fd`)
372
- - DELETE = Red (`#fed7d7`)
373
- - **Professional Typography** - Clean, readable fonts with proper hierarchy
374
- - **Responsive Design** - Works perfectly on desktop, tablet, and mobile
375
- - **Modal-Based Navigation** - Clean overlay system for endpoint details
376
- - **Parameter Documentation** - Clear display of request parameters and types
377
- - **Response Examples** - Formatted JSON responses with syntax highlighting
378
-
379
- ### πŸ“ Single-Request Interface
380
-
381
- Each endpoint gets its own dedicated modal view with organized sections:
382
-
383
- **Header Section:**
384
- - Large HTTP method badge with color coding
385
- - Full endpoint path in monospace font
386
- - Summary and description of the endpoint
387
- - Close button with rotation animation
388
-
389
- **Information Sections:**
390
- - **Description** - Clear documentation of what the endpoint does
391
- - **Parameters** - Detailed breakdown of path, query, and body parameters
392
- - **Request Body** - JSON schema examples with syntax highlighting
393
- - **Responses** - All possible response codes with examples
394
-
395
- **Interactive Features:**
396
- - Click any endpoint card to open detailed view
397
- - Search across all endpoints in real-time
398
- - Smooth transitions and micro-interactions
399
- - Click outside modal or press X to close
400
- - Keyboard-friendly navigation
401
-
402
- ### 🎨 Professional Design Features
403
-
404
- **Current Design System:**
405
- - **Beautiful Gradient Background** - Purple to blue gradient (`#667eea` to `#764ba2`)
406
- - **Modal-Based Navigation** - Each endpoint opens in its own modal overlay
407
- - **Smart Search Functionality** - Real-time filtering of endpoints
408
- - **Controller Grouping** - Endpoints organized by tags with counters
409
- - **Responsive Design** - Works perfectly on all devices
410
- - **Smooth Animations** - Professional transitions and hover effects
411
-
412
- ### 🎭 UI Configuration Options
413
-
414
- | Option | Type | Default | Description |
415
- |--------|------|---------|-------------|
416
- | `path` | `string` | `'/docs'` | Documentation route path |
417
- | `sourcePath` | `string` | `'src'` | Directory where your NestJS controllers are located |
418
- | `baseUrl` | `string` | `'http://localhost:3000'` | Base URL for your API (used in OpenAPI spec) |
419
- | `enableMock` | `boolean` | `true` | Enable `/scramble-mock/*` endpoints for testing |
420
- | `autoExportPostman` | `boolean` | `false` | Automatically generate Postman collection file |
421
- | `postmanOutputPath` | `string` | `'collection.json'` | Output path for Postman collection |
422
- | `apiTitle` | `string` | Auto-detected | API documentation title |
423
- | `apiVersion` | `string` | Auto-detected | API version number |
424
-
425
- ### 🌟 Interactive Features
426
-
427
- When you visit `http://localhost:3000/docs`, you'll experience:
428
-
429
- - 🎯 **Modal-Based Navigation** - Each endpoint opens in its own modal
430
- - πŸ“‚ **Smart Grouping** - Endpoints organized by tags with counters
431
- - πŸ” **Real-Time Search** - Instant filtering as you type
432
- - 🎨 **Beautiful Gradients** - Professional purple to blue background
433
- - πŸ“± **Responsive Design** - Perfect on desktop, tablet, and mobile
434
- - ✨ **Smooth Animations** - Professional transitions and hover effects
435
- - πŸ“‹ **Parameter Details** - Clear documentation of request parameters
436
- - πŸ’» **Code Examples** - Formatted JSON with syntax highlighting
437
- - πŸ”„ **Interactive Elements** - Click to explore, search to filter
438
-
439
- ### πŸ–₯️ Terminal Dashboard
440
-
441
- The startup dashboard now features **gradient styling** with ANSI colors:
442
-
443
- ```
444
- ╔═══════════════════════════════════════════════════════════════╗
445
- β•‘ ✨ NEST-SCRAMBLE by Mohamed Mustafa β•‘
446
- β•‘ ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ β•‘
447
- β•‘ β•‘
448
- β•‘ ● Documentation β•‘
449
- β•‘ β†’ http://localhost:3000/docs β•‘
450
- β•‘ β•‘
451
- β•‘ ● OpenAPI Spec β•‘
452
- β•‘ β†’ http://localhost:3000/docs-json β•‘
453
- β•‘ β•‘
454
- β•‘ ● Mock Server β•‘
455
- β•‘ β†’ http://localhost:3000/scramble-mock β•‘
456
- β•‘ β•‘
457
- β•‘ ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ β•‘
458
- β•‘ πŸ“¦ Source Path: src β•‘
459
- β•‘ 🎯 Controllers: 5 β•‘
460
- β•‘ 🎨 Theme: Futuristic β•‘
461
- β•šβ•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•
462
- ```
463
-
464
- ### πŸ“š More UI Documentation
465
-
466
- For complete UI customization guide, see:
467
- - **[UI_FEATURES.md](./UI_FEATURES.md)** - Comprehensive feature documentation
468
- - **[examples/futuristic-ui-example.ts](./examples/futuristic-ui-example.ts)** - Usage examples
469
-
470
- ### Available Endpoints
471
-
472
- | Endpoint | Description |
473
- |----------|-------------|
474
- | `GET /docs` | Professional API documentation with modal-based endpoint pages |
475
- | `GET /docs-json` | OpenAPI 3.0 JSON specification |
476
- | `GET /docs/json` | Legacy endpoint (same as above) |
477
- | `GET /docs/spec` | OpenAPI spec as JSON response |
478
-
479
- ### Accessing the OpenAPI Spec
480
-
481
- You can use the OpenAPI JSON with other tools:
482
-
483
- ```bash
484
- # Download the spec
485
- curl http://localhost:3000/docs-json > openapi.json
486
-
487
- # Use with Swagger UI
488
- docker run -p 8080:8080 -e SWAGGER_JSON=/openapi.json -v $(pwd):/usr/share/nginx/html/openapi.json swaggerapi/swagger-ui
489
-
490
- # Import into Postman
491
- # File > Import > Link > http://localhost:3000/docs-json
492
- ```
493
-
494
- ## βœ… Supported Features
495
-
496
- ### Type Analysis
497
- - βœ… Primitive types (string, number, boolean)
498
- - βœ… Arrays and nested objects
499
- - βœ… Union types
500
- - βœ… Enums
501
- - βœ… Optional properties
502
- - βœ… Circular references (auto-detected)
503
-
504
- ### HTTP Methods
505
- - βœ… GET, POST, PUT, DELETE, PATCH
506
- - βœ… Path parameters (@Param)
507
- - βœ… Query parameters (@Query)
508
- - βœ… Request bodies (@Body)
509
-
510
- ### Code Generation
511
- - βœ… Curl commands
512
- - βœ… JavaScript Fetch
513
- - βœ… TypeScript with types
514
-
515
- ## πŸ§ͺ Testing with Demo Controller
516
-
517
- The library includes a `DemoController` with complex DTOs:
518
-
519
- ```typescript
520
- // Complex DTOs with circular references
521
- export class UserDto {
522
- id: number;
523
- name: string;
524
- email: string;
525
- role: UserRole; // Enum
526
- address: AddressDto; // Nested
527
- posts: PostDto[]; // Circular reference
528
- }
529
-
530
- export class PostDto {
531
- id: number;
532
- title: string;
533
- content: string;
534
- author: UserDto; // Circular reference
535
- }
536
- ```
537
-
538
- Run the demo to verify everything works perfectly.
539
-
540
- ## πŸ—ΊοΈ Roadmap
541
-
542
- - [ ] GraphQL support
543
- - [ ] Custom mock data providers
544
- - [ ] Authentication integration
545
- - [ ] API versioning
546
- - [ ] Performance optimizations
547
- - [ ] Plugin system for custom analyzers
548
-
549
- ## πŸ”§ Troubleshooting
550
-
551
- ### Common Issues
552
-
553
- #### 1. **"No controllers found" Warning**
554
-
555
- If you see this warning on startup:
556
- ```
557
- [Nest-Scramble] No controllers found in /src. Please check your sourcePath config.
558
- ```
559
-
560
- **Solution:**
561
- - Ensure your `sourcePath` option points to the correct directory containing your controllers
562
- - Check that your controllers use the `@Controller()` decorator from `@nestjs/common`
563
- - Verify your project structure matches the configured path
564
-
565
- ```typescript
566
- NestScrambleModule.forRoot({
567
- sourcePath: 'src', // Make sure this matches your project structure
568
- })
569
- ```
570
-
571
- #### 2. **UI Not Loading / Blank Page at /docs**
572
-
573
- **Solution:**
574
- - Clear your browser cache and hard refresh (Ctrl+Shift+R / Cmd+Shift+R)
575
- - Check browser console for errors
576
- - Verify the `/docs-json` endpoint returns valid JSON
577
- - Ensure you're using version 1.1.0 or higher: `npm list nest-scramble`
578
-
579
- #### 3. **TypeScript Compilation Errors**
580
-
581
- If you get errors like `Cannot find module 'nest-scramble'`:
582
-
583
- **Solution:**
584
- ```bash
585
- # Clear node_modules and reinstall
586
- rm -rf node_modules package-lock.json
587
- npm install
588
-
589
- # Rebuild your project
590
- npm run build
591
- ```
592
-
593
- #### 4. **"Unauthorized" (401) Error on /docs Endpoint**
594
-
595
- If you have a Global AuthGuard and get 401 Unauthorized when accessing `/docs` or `/docs-json`:
596
-
597
- **Solution:**
598
-
599
- Nest-Scramble automatically marks its documentation endpoints as public using `@SetMetadata('isPublic', true)`. However, your AuthGuard needs to respect this metadata.
600
-
601
- Update your AuthGuard to check for the `isPublic` metadata:
602
-
603
- ```typescript
604
- import { Injectable, ExecutionContext } from '@nestjs/common';
605
- import { Reflector } from '@nestjs/core';
606
- import { AuthGuard } from '@nestjs/passport';
607
-
608
- @Injectable()
609
- export class JwtAuthGuard extends AuthGuard('jwt') {
610
- constructor(private reflector: Reflector) {
611
- super();
612
- }
613
-
614
- canActivate(context: ExecutionContext) {
615
- // Check if route is marked as public
616
- const isPublic = this.reflector.getAllAndOverride<boolean>('isPublic', [
617
- context.getHandler(),
618
- context.getClass(),
619
- ]);
620
-
621
- if (isPublic) {
622
- return true; // Allow access to public routes
623
- }
624
-
625
- return super.canActivate(context);
626
- }
627
- }
628
- ```
629
-
630
- **Alternative Solution - Exclude /docs path:**
631
-
632
- ```typescript
633
- import { Module } from '@nestjs/common';
634
- import { APP_GUARD } from '@nestjs/core';
635
-
636
- @Module({
637
- providers: [
638
- {
639
- provide: APP_GUARD,
640
- useClass: JwtAuthGuard,
641
- },
642
- ],
643
- })
644
- export class AppModule {}
645
-
646
- // In your AuthGuard:
647
- canActivate(context: ExecutionContext) {
648
- const request = context.switchToHttp().getRequest();
649
-
650
- // Skip authentication for documentation endpoints
651
- if (request.url.startsWith('/docs')) {
652
- return true;
653
- }
654
-
655
- return super.canActivate(context);
656
- }
657
- ```
658
-
659
- #### 5. **pnpm Dependency Conflicts**
660
-
661
- If using pnpm and getting peer dependency warnings:
662
-
663
- **Solution:**
664
- Nest-Scramble v1.1.0+ properly declares peer dependencies. Update to the latest version:
665
- ```bash
666
- pnpm update nest-scramble
667
- ```
668
-
669
- #### 6. **Controllers Not Being Scanned**
670
-
671
- The scanner looks in your **host project's** `src` folder, not the library's folder.
672
-
673
- **Diagnostic Steps:**
674
- 1. Check the startup logs - they show exactly where the scanner is looking:
675
- ```
676
- [Nest-Scramble] Scanning directory: /path/to/your/project/src
677
- [Nest-Scramble] Found X controller(s)
678
- ```
679
-
680
- 2. Ensure your controllers are in TypeScript files (`.ts`) not JavaScript (`.js`)
681
-
682
- 3. Verify your `tsconfig.json` exists in the project root
683
-
684
- #### 7. **Mock Endpoints Not Working**
685
-
686
- If `/scramble-mock/*` returns 404:
687
-
688
- **Solution:**
689
- - Ensure `enableMock: true` in your configuration
690
- - The middleware applies to all routes matching `/scramble-mock/*`
691
- - Example: `http://localhost:3000/scramble-mock/users/123`
692
-
693
- #### 8. **OpenAPI Spec is Empty or Incomplete**
694
-
695
- **Solution:**
696
- - Ensure your DTOs are TypeScript classes or interfaces (not plain objects)
697
- - Check that your controller methods have proper return type annotations
698
- - Verify decorators are imported from `@nestjs/common`
699
-
700
- ```typescript
701
- // βœ… Good - Explicit return type
702
- @Get(':id')
703
- getUser(@Param('id') id: string): UserDto {
704
- return this.userService.findOne(id);
705
- }
706
-
707
- // ❌ Bad - No return type
708
- @Get(':id')
709
- getUser(@Param('id') id: string) {
710
- return this.userService.findOne(id);
711
- }
712
- ```
713
-
714
- ### Getting Help
715
-
716
- If you're still experiencing issues:
717
-
718
- 1. **Check the logs** - Nest-Scramble provides detailed diagnostic output on startup
719
- 2. **Verify your version** - Run `npm list nest-scramble` (should be 1.1.0+)
720
- 3. **Open an issue** - [GitHub Issues](https://github.com/Eng-MMustafa/nest-scramble/issues)
721
-
722
- When reporting issues, please include:
723
- - Nest-Scramble version
724
- - NestJS version
725
- - Package manager (npm/yarn/pnpm)
726
- - Startup logs
727
- - Sample controller code
728
-
729
- ## 🀝 Contributing
730
-
731
- We welcome contributions! Please:
732
-
733
- 1. Fork the repository
734
- 2. Create a feature branch
735
- 3. Add tests for new features
736
- 4. Submit a pull request
737
-
738
- ## πŸ“„ License
739
-
740
- MIT License - see [LICENSE](LICENSE) file.
741
-
742
- ## β€πŸ’» About the Author
743
-
744
- ![Mohamed Mustafa](https://via.placeholder.com/150x150?text=Mohamed+Mustafa)
745
-
746
- Mohamed Mustafa is a passionate full-stack developer with a deep love for TypeScript and modern web frameworks. His mission is to build tools that enhance developer experience and eliminate repetitive tasks. When he's not crafting open-source libraries, you'll find him exploring new technologies, contributing to the developer community, or sharing insights through technical writing.
747
-
748
- - [GitHub](https://github.com/Eng-MMustafa)
749
- - [LinkedIn](https://www.linkedin.com/in/engmohammedmustafa/)
1
+ # Nest-Scramble
2
+
3
+ > Zero-config API Documentation & Postman Generator for NestJS using static analysis
4
+
5
+ [![npm version](https://badge.fury.io/js/nest-scramble.svg)](https://badge.fury.io/js/nest-scramble)
6
+ [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
7
+ [![GitHub stars](https://img.shields.io/github/stars/Eng-MMustafa/nest-scramble.svg)](https://github.com/Eng-MMustafa/nest-scramble)
8
+ [![Author](https://img.shields.io/badge/Author-Mohamed%20Mustafa-blue.svg)](https://github.com/Eng-MMustafa)
9
+
10
+ ## πŸš€ Why Nest-Scramble?
11
+
12
+ As a NestJS developer, I was tired of drowning in `@ApiProperty` decorators just to get basic API documentation. I longed for a zero-config solution where docs just worked without polluting my code. **Nest-Scramble changes that** by using static TypeScript analysis to automatically generate:
13
+
14
+ - βœ… **OpenAPI 3.0 specifications** from your DTOs
15
+ - βœ… **Interactive Scalar UI documentation** with zero configuration
16
+ - βœ… **Postman collections** with smart mock data
17
+ - βœ… **Live mocking** for rapid prototyping
18
+
19
+ **Zero configuration. Zero decorators. Just pure TypeScript.**
20
+
21
+ ## πŸ“– The Story Behind Nest-Scramble
22
+
23
+ It all started with a vision: API documentation should be effortless. As a developer passionate about clean code and developer experience, I knew there had to be a better way than manual decorators and runtime reflection.
24
+
25
+ When I switched to NestJS for its powerful architecture and TypeScript-first approach, I was disappointed by the lack of zero-config documentation tools. Hours wasted on `@ApiProperty({ type: String })` instead of building features.
26
+
27
+ I knew there had to be a better way. Leveraging my expertise in static analysis and Abstract Syntax Trees (AST), I built Nest-Scramble to bring that same developer experience to the Node.js ecosystem. It's not just a toolβ€”it's my mission to make API documentation as effortless as it should be.
28
+
29
+ ## πŸ† Features Gallery
30
+
31
+ | Feature | Nest-Scramble | Swagger (@nestjs/swagger) |
32
+ |---------|---------------|---------------------------|
33
+ | Analysis Method | Static AST Traversal | Runtime Reflection |
34
+ | Performance Impact | Zero Overhead | Decorator Runtime Cost |
35
+ | Type Accuracy | Full TypeScript Inference | Partial Mapping |
36
+ | Circular References | Auto-Detected & Resolved | Manual Workarounds |
37
+ | Bundle Size | Minimal | Heavy with Decorators |
38
+ | Code Purity | Zero Decorators | Decorator Pollution |
39
+ | Future Compatibility | TypeScript Evolution Ready | Framework Dependent |
40
+
41
+ ## 🧠 The Vision
42
+
43
+ Nest-Scramble embodies my engineering philosophy: **Clean Code through Automation**. As a developer who values TypeScript's type safety and NestJS's architecture, I believe that documentation should never compromise code quality.
44
+
45
+ This library represents a paradigm shiftβ€”from manual, error-prone decorators to intelligent, compile-time analysis. It's about empowering developers to focus on building features, not fighting frameworks.
46
+
47
+ ## πŸ”¬ How it's Built
48
+
49
+ Nest-Scramble is engineered using cutting-edge static analysis techniques that traditional tools cannot match:
50
+
51
+ - **Abstract Syntax Tree (AST) Traversal**: Direct manipulation of TypeScript's AST using `ts-morph` for unparalleled type inference
52
+ - **Zero-Decorator Architecture**: Pure TypeScript classes remain untouched, preserving domain integrity
53
+ - **Compile-Time Intelligence**: All analysis happens at build-time, eliminating runtime performance costs
54
+ - **Circular Reference Mastery**: Advanced algorithms detect and handle complex type relationships automatically
55
+
56
+ This approach delivers what runtime reflection simply cannot: perfect accuracy, zero overhead, and future-proof compatibility with TypeScript's evolving type system.
57
+
58
+ ## ⚑ Quick Start - Zero Config (2 Steps!)
59
+
60
+ ### Option A: Auto-Injection (Recommended - 30 seconds!)
61
+
62
+ ```bash
63
+ # 1. Install
64
+ npm install nest-scramble
65
+
66
+ # 2. Auto-inject into your project
67
+ npx nest-scramble init
68
+
69
+ # 3. Start your app
70
+ npm run start:dev
71
+
72
+ # πŸŽ‰ Done! Visit http://localhost:3000/docs
73
+ ```
74
+
75
+ The `init` command automatically:
76
+ - βœ… Adds the import statement to your `app.module.ts`
77
+ - βœ… Injects `NestScrambleModule.forRoot()` into your imports
78
+ - βœ… Uses smart defaults with zero configuration needed
79
+
80
+ ### Option B: Manual Installation (3 Steps)
81
+
82
+ #### 1. Install the Package
83
+
84
+ ```bash
85
+ # Using npm
86
+ npm install nest-scramble
87
+
88
+ # Using yarn
89
+ yarn add nest-scramble
90
+
91
+ # Using pnpm
92
+ pnpm add nest-scramble
93
+ ```
94
+
95
+ #### 2. Import Module in Your NestJS App
96
+
97
+ **Zero-Config (Recommended):**
98
+ ```typescript
99
+ import { Module } from '@nestjs/common';
100
+ import { NestScrambleModule } from 'nest-scramble';
101
+
102
+ @Module({
103
+ imports: [
104
+ NestScrambleModule.forRoot(), // 🎯 That's it! Zero config needed
105
+ ],
106
+ })
107
+ export class AppModule {}
108
+ ```
109
+
110
+ **With Custom Options:**
111
+ ```typescript
112
+ import { Module } from '@nestjs/common';
113
+ import { NestScrambleModule } from 'nest-scramble';
114
+
115
+ @Module({
116
+ imports: [
117
+ NestScrambleModule.forRoot({
118
+ sourcePath: 'src', // Auto-detected by default
119
+ baseUrl: 'http://localhost:3000', // Auto-detected from PORT env
120
+ enableMock: true, // Enabled by default
121
+ autoExportPostman: false, // Disabled by default
122
+ apiTitle: 'My API', // Auto-detected from package.json
123
+ apiVersion: '1.0.0', // Auto-detected from package.json
124
+ }),
125
+ ],
126
+ })
127
+ export class AppModule {}
128
+ ```
129
+
130
+ #### 3. Start Your App and Visit Documentation
131
+
132
+ ```bash
133
+ npm run start:dev
134
+ ```
135
+
136
+ You'll see a beautiful dashboard in your terminal:
137
+
138
+ ```
139
+ β”Œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”
140
+ β”‚ πŸš€ Nest-Scramble by Mohamed Mustafa is Active! β”‚
141
+ β”œβ”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€
142
+ β”‚ πŸ“– Docs: http://localhost:3000/docs β”‚
143
+ β”‚ πŸ“„ JSON: http://localhost:3000/docs-json β”‚
144
+ β”‚ 🎭 Mock: http://localhost:3000/scramble-mock β”‚
145
+ β”‚ ✨ Scanning: src β”‚
146
+ β”‚ 🎯 Controllers: 5 β”‚
147
+ β””β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”€β”˜
148
+ ```
149
+
150
+ Then open your browser:
151
+
152
+ - **πŸ“– Interactive API Docs (Scalar UI)**: http://localhost:3000/docs
153
+ - **πŸ“„ OpenAPI JSON Spec**: http://localhost:3000/docs-json
154
+ - **🎭 Mock Endpoints**: http://localhost:3000/scramble-mock/*
155
+
156
+ **That's it!** Nest-Scramble automatically:
157
+ - πŸ” Detects your project structure
158
+ - πŸ“‚ Finds your controllers
159
+ - πŸ“ Generates OpenAPI spec
160
+ - 🎨 Serves beautiful documentation
161
+ - 🎭 Provides mock endpoints
162
+
163
+ ## βš™οΈ Configuration Options
164
+
165
+ ```typescript
166
+ NestScrambleModule.forRoot({
167
+ // Source directory to scan for controllers
168
+ sourcePath: 'src', // default: 'src'
169
+
170
+ // API base URL for OpenAPI spec
171
+ baseUrl: 'http://localhost:3000', // default: 'http://localhost:3000'
172
+
173
+ // Enable live mocking middleware
174
+ enableMock: true, // default: true
175
+
176
+ // Auto-export Postman collection on startup
177
+ autoExportPostman: false, // default: false
178
+
179
+ // Postman collection output path
180
+ postmanOutputPath: 'collection.json', // default: 'collection.json'
181
+ })
182
+ ```
183
+
184
+ ### Configuration Details
185
+
186
+ | Option | Type | Default | Description |
187
+ |--------|------|---------|-------------|
188
+ | `sourcePath` | `string` | `'src'` | Directory where your NestJS controllers are located |
189
+ | `baseUrl` | `string` | `'http://localhost:3000'` | Base URL for your API (used in OpenAPI spec) |
190
+ | `enableMock` | `boolean` | `true` | Enable `/scramble-mock/*` endpoints for testing |
191
+ | `autoExportPostman` | `boolean` | `false` | Automatically generate Postman collection file |
192
+ | `postmanOutputPath` | `string` | `'collection.json'` | Output path for Postman collection |
193
+
194
+ ## 🎭 Live Mocking Guide
195
+
196
+ Nest-Scramble provides **instant API mocking** without writing controllers:
197
+
198
+ ### How It Works
199
+ 1. Define your DTOs and controllers normally
200
+ 2. Enable `enableMock: true`
201
+ 3. All requests to `/scramble-mock/*` return smart mock data
202
+
203
+ ### Example
204
+
205
+ **Controller:**
206
+ ```typescript
207
+ @Controller('users')
208
+ export class UserController {
209
+ @Get(':id')
210
+ getUser(@Param('id') id: number): UserDto {
211
+ // Your logic here
212
+ }
213
+ }
214
+ ```
215
+
216
+ **Mock Response:**
217
+ ```bash
218
+ GET /scramble-mock/users/123
219
+ # Returns: { "id": 123, "name": "John Doe", "email": "john@example.com" }
220
+ ```
221
+
222
+ **Smart Mocking Examples:**
223
+ - `email` β†’ `faker.internet.email()`
224
+ - `name` β†’ `faker.person.fullName()`
225
+ - `createdAt` β†’ `faker.date.recent()`
226
+ - `posts` β†’ Array of mock posts
227
+
228
+ ![Live mocking demo](mock-demo.gif)
229
+
230
+ ## πŸ”§ Advanced Usage
231
+
232
+ ### CLI Generation
233
+
234
+ The Nest-Scramble CLI allows you to generate API documentation without running your NestJS application.
235
+
236
+ #### Generate OpenAPI Specification
237
+
238
+ ```bash
239
+ # Using npx
240
+ npx nest-scramble generate src
241
+
242
+ # Using pnpm dlx
243
+ pnpm dlx nest-scramble generate src
244
+
245
+ # Using yarn dlx
246
+ yarn dlx nest-scramble generate src
247
+ ```
248
+
249
+ #### CLI Options
250
+
251
+ ```bash
252
+ nest-scramble generate <sourcePath> [options]
253
+
254
+ Options:
255
+ -o, --output <file> Output file path (default: "openapi.json")
256
+ -f, --format <type> Output format: openapi or postman (default: "openapi")
257
+ -b, --baseUrl <url> Base URL for the API (default: "http://localhost:3000")
258
+ -t, --title <title> API title (default: "NestJS API")
259
+ -v, --apiVersion <version> API version (default: "1.0.0")
260
+ -h, --help Display help for command
261
+ ```
262
+
263
+ #### Examples
264
+
265
+ **Generate OpenAPI JSON:**
266
+ ```bash
267
+ pnpm dlx nest-scramble generate src --output openapi.json
268
+ ```
269
+
270
+ **Generate Postman Collection:**
271
+ ```bash
272
+ pnpm dlx nest-scramble generate src --format postman --output collection.json
273
+ ```
274
+
275
+ **Custom API Details:**
276
+ ```bash
277
+ pnpm dlx nest-scramble generate src \
278
+ --output my-api.json \
279
+ --title "My Awesome API" \
280
+ --apiVersion "2.0.0" \
281
+ --baseUrl "https://api.example.com"
282
+ ```
283
+
284
+ **Check Version:**
285
+ ```bash
286
+ pnpm dlx nest-scramble --version
287
+ ```
288
+
289
+ ### Programmatic API
290
+
291
+ Use Nest-Scramble programmatically in your Node.js scripts:
292
+
293
+ ```typescript
294
+ import { ScannerService, OpenApiTransformer, PostmanCollectionGenerator } from 'nest-scramble';
295
+ import * as fs from 'fs';
296
+
297
+ // Scan controllers
298
+ const scanner = new ScannerService();
299
+ const controllers = scanner.scanControllers('src');
300
+
301
+ // Generate OpenAPI spec
302
+ const transformer = new OpenApiTransformer('http://localhost:3000');
303
+ const openApiSpec = transformer.transform(
304
+ controllers,
305
+ 'My API',
306
+ '1.0.0',
307
+ 'http://localhost:3000'
308
+ );
309
+
310
+ // Save to file
311
+ fs.writeFileSync('openapi.json', JSON.stringify(openApiSpec, null, 2));
312
+
313
+ // Or generate Postman collection
314
+ const postmanGen = new PostmanCollectionGenerator('http://localhost:3000');
315
+ const collection = postmanGen.generateCollection(controllers);
316
+ fs.writeFileSync('collection.json', JSON.stringify(collection, null, 2));
317
+ ```
318
+
319
+ ### CI/CD Integration
320
+
321
+ Add to your CI/CD pipeline to auto-generate documentation:
322
+
323
+ ```yaml
324
+ # .github/workflows/docs.yml
325
+ name: Generate API Docs
326
+
327
+ on:
328
+ push:
329
+ branches: [main]
330
+
331
+ jobs:
332
+ generate-docs:
333
+ runs-on: ubuntu-latest
334
+ steps:
335
+ - uses: actions/checkout@v3
336
+ - uses: actions/setup-node@v3
337
+ with:
338
+ node-version: '18'
339
+ - run: npm install
340
+ - run: npx nest-scramble generate src --output openapi.json
341
+ - uses: actions/upload-artifact@v3
342
+ with:
343
+ name: api-docs
344
+ path: openapi.json
345
+ ```
346
+
347
+ ## 🎨 Documentation UI - Professional API Dashboard
348
+
349
+ ### ✨ Elite Dashboard Design (NEW!)
350
+
351
+ Nest-Scramble features a **professional, high-end API dashboard** inspired by Stripe and Postman, where each request is displayed on a separate page for focused documentation!
352
+
353
+ **πŸš€ Key Features:**
354
+ - **Sidebar-Only Navigation** - Fixed 320px sidebar with controller grouping
355
+ - **Single-Request Per Page** - Each endpoint gets its own dedicated view
356
+ - **Three-Column Elite Layout** - Information | Request Editor | Test Panel
357
+ - **Deep Black Background** - Professional `#000000` and `#0B0E14` theme
358
+ - **Cyber-Cyan Accents** - `#00f2ff` for active states and primary actions
359
+ - **Vibrant HTTP Method Badges** - Color-coded with glow effects:
360
+ - GET = Royal Blue (`#3B82F6`)
361
+ - POST = Emerald Green (`#10B981`)
362
+ - PUT = Amber Orange (`#F59E0B`)
363
+ - PATCH = Violet Purple (`#8B5CF6`)
364
+ - DELETE = Vibrant Red (`#EF4444`)
365
+ - **Glassmorphism Effects** - Backdrop blur on request/response panels
366
+ - **40px Spacious Padding** - Premium whitespace throughout
367
+ - **Terminal-Style Response** - Black box with green text for API responses
368
+ - **High-Contrast Labels** - Required, Type, and Default badges
369
+ - **Custom Scrollbars** - Gradient cyan-to-purple styling
370
+ - **Plus Jakarta Sans Typography** - Modern, professional font family
371
+ - **Powered by Badge** - Animated branding with pulse effect
372
+
373
+ ### πŸ“ Three-Column Elite Interface
374
+
375
+ The dashboard uses a professional three-column layout for each endpoint:
376
+
377
+ **Column 1 (Left) - Information Panel:**
378
+ - Endpoint title with large, bold typography
379
+ - HTTP method badge with vibrant colors and glow
380
+ - Endpoint description and documentation
381
+ - Clean parameters table with high-contrast labels
382
+ - Type information and required field indicators
383
+
384
+ **Column 2 (Middle) - Request Body Editor:**
385
+ - Glassmorphism design with backdrop blur
386
+ - Auto-filled mock data examples
387
+ - JSON editor with syntax highlighting
388
+ - Copy-to-clipboard functionality
389
+ - Real-time validation
390
+
391
+ **Column 3 (Right) - Test Request Panel:**
392
+ - Enhanced glassmorphism with cyan border glow
393
+ - Large "Send Request" button with gradient animation
394
+ - Terminal-style response viewer (black background, green text)
395
+ - Status code indicators
396
+ - Response headers display
397
+
398
+ ### 🎨 Theme Customization
399
+
400
+ **Futuristic Theme (Default):**
401
+ ```typescript
402
+ NestScrambleModule.forRoot({
403
+ theme: 'futuristic', // Professional dark dashboard
404
+ primaryColor: '#00f2ff', // Cyber-Cyan (default)
405
+ customDomainIcon: '/logo.png', // Your brand favicon
406
+ apiTitle: 'My Awesome API',
407
+ })
408
+ ```
409
+
410
+ **Classic Theme:**
411
+ ```typescript
412
+ NestScrambleModule.forRoot({
413
+ theme: 'classic', // Clean, light, professional
414
+ primaryColor: '#0066cc', // Corporate blue
415
+ apiTitle: 'Enterprise API',
416
+ })
417
+ ```
418
+
419
+ **Custom Color Branding:**
420
+ ```typescript
421
+ // One line changes the entire UI color scheme!
422
+ NestScrambleModule.forRoot({
423
+ primaryColor: '#a855f7', // Electric Purple
424
+ // or '#10b981' for Emerald Green
425
+ // or '#f59e0b' for Amber Orange
426
+ // or any hex color you want!
427
+ })
428
+ ```
429
+
430
+ ### 🎭 UI Configuration Options
431
+
432
+ | Option | Type | Default | Description |
433
+ |--------|------|---------|-------------|
434
+ | `theme` | `'classic' \| 'futuristic'` | `'futuristic'` | UI theme selection |
435
+ | `primaryColor` | `string` | `'#00f2ff'` | Primary accent color (hex) |
436
+ | `customDomainIcon` | `string` | `''` | Custom favicon URL |
437
+ | `apiTitle` | `string` | Auto-detected | API documentation title |
438
+ | `apiVersion` | `string` | Auto-detected | API version number |
439
+
440
+ ### 🌟 Interactive Features
441
+
442
+ When you visit `http://localhost:3000/docs`, you'll experience:
443
+
444
+ - 🎯 **Single-Request Navigation** - Each endpoint on its own dedicated page
445
+ - πŸ“‚ **Controller Grouping** - Organized sidebar with uppercase section headers
446
+ - 🎨 **Active State Glow** - Cyber-cyan highlight for selected endpoints
447
+ - πŸ“ **Auto-generated Examples** - Pre-filled mock data in request editor
448
+ - πŸ§ͺ **Live Testing** - Send requests directly from the three-column interface
449
+ - πŸ’» **Terminal Response** - Black box with green text for authentic feel
450
+ - πŸ” **Quick Search** - Press 'K' to search endpoints instantly
451
+ - πŸ“± **Responsive Design** - Adapts to mobile, tablet, and desktop
452
+ - ✨ **Animated Branding** - Pulsing "Powered by Nest-Scramble" badge
453
+ - 🎭 **Developer Easter Eggs** - Check your browser console for surprises!
454
+
455
+ ### πŸ–₯️ Terminal Dashboard
456
+
457
+ The startup dashboard now features **gradient styling** with ANSI colors:
458
+
459
+ ```
460
+ ╔═══════════════════════════════════════════════════════════════╗
461
+ β•‘ ✨ NEST-SCRAMBLE by Mohamed Mustafa β•‘
462
+ β•‘ ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ β•‘
463
+ β•‘ β•‘
464
+ β•‘ ● Documentation β•‘
465
+ β•‘ β†’ http://localhost:3000/docs β•‘
466
+ β•‘ β•‘
467
+ β•‘ ● OpenAPI Spec β•‘
468
+ β•‘ β†’ http://localhost:3000/docs-json β•‘
469
+ β•‘ β•‘
470
+ β•‘ ● Mock Server β•‘
471
+ β•‘ β†’ http://localhost:3000/scramble-mock β•‘
472
+ β•‘ β•‘
473
+ β•‘ ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ β•‘
474
+ β•‘ πŸ“¦ Source Path: src β•‘
475
+ β•‘ 🎯 Controllers: 5 β•‘
476
+ β•‘ 🎨 Theme: Futuristic β•‘
477
+ β•šβ•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•β•
478
+ ```
479
+
480
+ ### πŸ“š More UI Documentation
481
+
482
+ For complete UI customization guide, see:
483
+ - **[UI_FEATURES.md](./UI_FEATURES.md)** - Comprehensive feature documentation
484
+ - **[examples/futuristic-ui-example.ts](./examples/futuristic-ui-example.ts)** - Usage examples
485
+
486
+ ### Available Endpoints
487
+
488
+ | Endpoint | Description |
489
+ |----------|-------------|
490
+ | `GET /docs` | Interactive Scalar UI documentation |
491
+ | `GET /docs-json` | OpenAPI 3.0 JSON specification |
492
+ | `GET /docs/json` | Legacy endpoint (same as above) |
493
+ | `GET /docs/spec` | OpenAPI spec as JSON response |
494
+
495
+ ### Accessing the OpenAPI Spec
496
+
497
+ You can use the OpenAPI JSON with other tools:
498
+
499
+ ```bash
500
+ # Download the spec
501
+ curl http://localhost:3000/docs-json > openapi.json
502
+
503
+ # Use with Swagger UI
504
+ docker run -p 8080:8080 -e SWAGGER_JSON=/openapi.json -v $(pwd):/usr/share/nginx/html/openapi.json swaggerapi/swagger-ui
505
+
506
+ # Import into Postman
507
+ # File > Import > Link > http://localhost:3000/docs-json
508
+ ```
509
+
510
+ ## βœ… Supported Features
511
+
512
+ ### Type Analysis
513
+ - βœ… Primitive types (string, number, boolean)
514
+ - βœ… Arrays and nested objects
515
+ - βœ… Union types
516
+ - βœ… Enums
517
+ - βœ… Optional properties
518
+ - βœ… Circular references (auto-detected)
519
+
520
+ ### HTTP Methods
521
+ - βœ… GET, POST, PUT, DELETE, PATCH
522
+ - βœ… Path parameters (@Param)
523
+ - βœ… Query parameters (@Query)
524
+ - βœ… Request bodies (@Body)
525
+
526
+ ### Code Generation
527
+ - βœ… Curl commands
528
+ - βœ… JavaScript Fetch
529
+ - βœ… TypeScript with types
530
+
531
+ ## πŸ§ͺ Testing with Demo Controller
532
+
533
+ The library includes a `DemoController` with complex DTOs:
534
+
535
+ ```typescript
536
+ // Complex DTOs with circular references
537
+ export class UserDto {
538
+ id: number;
539
+ name: string;
540
+ email: string;
541
+ role: UserRole; // Enum
542
+ address: AddressDto; // Nested
543
+ posts: PostDto[]; // Circular reference
544
+ }
545
+
546
+ export class PostDto {
547
+ id: number;
548
+ title: string;
549
+ content: string;
550
+ author: UserDto; // Circular reference
551
+ }
552
+ ```
553
+
554
+ Run the demo to verify everything works perfectly.
555
+
556
+ ## πŸ—ΊοΈ Roadmap
557
+
558
+ - [ ] GraphQL support
559
+ - [ ] Custom mock data providers
560
+ - [ ] Authentication integration
561
+ - [ ] API versioning
562
+ - [ ] Performance optimizations
563
+ - [ ] Plugin system for custom analyzers
564
+
565
+ ## πŸ”§ Troubleshooting
566
+
567
+ ### Common Issues
568
+
569
+ #### 1. **"No controllers found" Warning**
570
+
571
+ If you see this warning on startup:
572
+ ```
573
+ [Nest-Scramble] No controllers found in /src. Please check your sourcePath config.
574
+ ```
575
+
576
+ **Solution:**
577
+ - Ensure your `sourcePath` option points to the correct directory containing your controllers
578
+ - Check that your controllers use the `@Controller()` decorator from `@nestjs/common`
579
+ - Verify your project structure matches the configured path
580
+
581
+ ```typescript
582
+ NestScrambleModule.forRoot({
583
+ sourcePath: 'src', // Make sure this matches your project structure
584
+ })
585
+ ```
586
+
587
+ #### 2. **UI Not Loading / Blank Page at /docs**
588
+
589
+ **Solution:**
590
+ - Clear your browser cache and hard refresh (Ctrl+Shift+R / Cmd+Shift+R)
591
+ - Check browser console for errors
592
+ - Verify the `/docs-json` endpoint returns valid JSON
593
+ - Ensure you're using version 1.1.0 or higher: `npm list nest-scramble`
594
+
595
+ #### 3. **TypeScript Compilation Errors**
596
+
597
+ If you get errors like `Cannot find module 'nest-scramble'`:
598
+
599
+ **Solution:**
600
+ ```bash
601
+ # Clear node_modules and reinstall
602
+ rm -rf node_modules package-lock.json
603
+ npm install
604
+
605
+ # Rebuild your project
606
+ npm run build
607
+ ```
608
+
609
+ #### 4. **"Unauthorized" (401) Error on /docs Endpoint**
610
+
611
+ If you have a Global AuthGuard and get 401 Unauthorized when accessing `/docs` or `/docs-json`:
612
+
613
+ **Solution:**
614
+
615
+ Nest-Scramble automatically marks its documentation endpoints as public using `@SetMetadata('isPublic', true)`. However, your AuthGuard needs to respect this metadata.
616
+
617
+ Update your AuthGuard to check for the `isPublic` metadata:
618
+
619
+ ```typescript
620
+ import { Injectable, ExecutionContext } from '@nestjs/common';
621
+ import { Reflector } from '@nestjs/core';
622
+ import { AuthGuard } from '@nestjs/passport';
623
+
624
+ @Injectable()
625
+ export class JwtAuthGuard extends AuthGuard('jwt') {
626
+ constructor(private reflector: Reflector) {
627
+ super();
628
+ }
629
+
630
+ canActivate(context: ExecutionContext) {
631
+ // Check if route is marked as public
632
+ const isPublic = this.reflector.getAllAndOverride<boolean>('isPublic', [
633
+ context.getHandler(),
634
+ context.getClass(),
635
+ ]);
636
+
637
+ if (isPublic) {
638
+ return true; // Allow access to public routes
639
+ }
640
+
641
+ return super.canActivate(context);
642
+ }
643
+ }
644
+ ```
645
+
646
+ **Alternative Solution - Exclude /docs path:**
647
+
648
+ ```typescript
649
+ import { Module } from '@nestjs/common';
650
+ import { APP_GUARD } from '@nestjs/core';
651
+
652
+ @Module({
653
+ providers: [
654
+ {
655
+ provide: APP_GUARD,
656
+ useClass: JwtAuthGuard,
657
+ },
658
+ ],
659
+ })
660
+ export class AppModule {}
661
+
662
+ // In your AuthGuard:
663
+ canActivate(context: ExecutionContext) {
664
+ const request = context.switchToHttp().getRequest();
665
+
666
+ // Skip authentication for documentation endpoints
667
+ if (request.url.startsWith('/docs')) {
668
+ return true;
669
+ }
670
+
671
+ return super.canActivate(context);
672
+ }
673
+ ```
674
+
675
+ #### 5. **pnpm Dependency Conflicts**
676
+
677
+ If using pnpm and getting peer dependency warnings:
678
+
679
+ **Solution:**
680
+ Nest-Scramble v1.1.0+ properly declares peer dependencies. Update to the latest version:
681
+ ```bash
682
+ pnpm update nest-scramble
683
+ ```
684
+
685
+ #### 6. **Controllers Not Being Scanned**
686
+
687
+ The scanner looks in your **host project's** `src` folder, not the library's folder.
688
+
689
+ **Diagnostic Steps:**
690
+ 1. Check the startup logs - they show exactly where the scanner is looking:
691
+ ```
692
+ [Nest-Scramble] Scanning directory: /path/to/your/project/src
693
+ [Nest-Scramble] Found X controller(s)
694
+ ```
695
+
696
+ 2. Ensure your controllers are in TypeScript files (`.ts`) not JavaScript (`.js`)
697
+
698
+ 3. Verify your `tsconfig.json` exists in the project root
699
+
700
+ #### 7. **Mock Endpoints Not Working**
701
+
702
+ If `/scramble-mock/*` returns 404:
703
+
704
+ **Solution:**
705
+ - Ensure `enableMock: true` in your configuration
706
+ - The middleware applies to all routes matching `/scramble-mock/*`
707
+ - Example: `http://localhost:3000/scramble-mock/users/123`
708
+
709
+ #### 8. **OpenAPI Spec is Empty or Incomplete**
710
+
711
+ **Solution:**
712
+ - Ensure your DTOs are TypeScript classes or interfaces (not plain objects)
713
+ - Check that your controller methods have proper return type annotations
714
+ - Verify decorators are imported from `@nestjs/common`
715
+
716
+ ```typescript
717
+ // βœ… Good - Explicit return type
718
+ @Get(':id')
719
+ getUser(@Param('id') id: string): UserDto {
720
+ return this.userService.findOne(id);
721
+ }
722
+
723
+ // ❌ Bad - No return type
724
+ @Get(':id')
725
+ getUser(@Param('id') id: string) {
726
+ return this.userService.findOne(id);
727
+ }
728
+ ```
729
+
730
+ ### Getting Help
731
+
732
+ If you're still experiencing issues:
733
+
734
+ 1. **Check the logs** - Nest-Scramble provides detailed diagnostic output on startup
735
+ 2. **Verify your version** - Run `npm list nest-scramble` (should be 1.1.0+)
736
+ 3. **Open an issue** - [GitHub Issues](https://github.com/Eng-MMustafa/nest-scramble/issues)
737
+
738
+ When reporting issues, please include:
739
+ - Nest-Scramble version
740
+ - NestJS version
741
+ - Package manager (npm/yarn/pnpm)
742
+ - Startup logs
743
+ - Sample controller code
744
+
745
+ ## 🀝 Contributing
746
+
747
+ We welcome contributions! Please:
748
+
749
+ 1. Fork the repository
750
+ 2. Create a feature branch
751
+ 3. Add tests for new features
752
+ 4. Submit a pull request
753
+
754
+ ## πŸ“„ License
755
+
756
+ MIT License - see [LICENSE](LICENSE) file.
757
+
758
+ ## β€πŸ’» About the Author
759
+
760
+ ![Mohamed Mustafa](https://via.placeholder.com/150x150?text=Mohamed+Mustafa)
761
+
762
+ Mohamed Mustafa is a passionate full-stack developer with a deep love for TypeScript and modern web frameworks. His mission is to build tools that enhance developer experience and eliminate repetitive tasks. When he's not crafting open-source libraries, you'll find him exploring new technologies, contributing to the developer community, or sharing insights through technical writing.
763
+
764
+ - [GitHub](https://github.com/Eng-MMustafa)
765
+ - [LinkedIn](https://www.linkedin.com/in/engmohammedmustafa/)