@@ -8,18 +8,20 @@ A TypeScript implementation of json-server with additional features and comprehe
8
8
9
9
## Features
10
10
11
- - Full TypeScript support with type definitions
12
- - RESTful API endpoints from a JSON file or JavaScript object
13
- - Configurable routes
14
- - API prefix support (` /api/* ` for all routes)
15
- - Support for multiple package managers (npm, yarn, pnpm, bun)
16
- - CORS support
17
- - Delay simulation for network latency testing
18
- - Read-only mode
19
- - Static file serving
20
- - Custom middleware support
21
- - Deno compatibility
22
- - ** Beautiful and intuitive CLI interface with color-coded outputs**
11
+ - ** Full TypeScript support** with comprehensive type definitions
12
+ - ** RESTful API endpoints** from a JSON file or JavaScript object
13
+ - ** API prefix support** - Access all routes with ` /api/* ` prefix for production-like experience
14
+ - ** Configurable routes** with custom route definitions
15
+ - ** Multiple package managers** support (npm, yarn, pnpm, bun)
16
+ - ** CORS support** with configurable options
17
+ - ** Delay simulation** for network latency testing
18
+ - ** Read-only mode** for safe demonstrations
19
+ - ** Static file serving** for frontend assets
20
+ - ** Custom middleware support** for advanced use cases
21
+ - ** Deno compatibility** for modern runtime support
22
+ - ** Beautiful CLI interface** with color-coded outputs and intuitive feedback
23
+ - ** Comprehensive pagination** with flexible query parameters
24
+ - ** Advanced filtering** and sorting capabilities
23
25
24
26
## Installation
25
27
@@ -67,12 +69,19 @@ Start the JSON Server:
67
69
npx json-server db.json
68
70
```
69
71
72
+ Or with API prefix support (enables ` /api/* ` routes):
73
+
74
+ ``` bash
75
+ npx json-server db.json --enable-api-prefix
76
+ ```
77
+
70
78
Or use it from your package.json scripts:
71
79
72
80
``` json
73
81
{
74
82
"scripts" : {
75
- "mock-api" : " json-server db.json"
83
+ "mock-api" : " json-server db.json" ,
84
+ "mock-api-with-prefix" : " json-server db.json --enable-api-prefix"
76
85
}
77
86
}
78
87
```
@@ -83,6 +92,8 @@ Now if you go to http://localhost:3000/posts/1, you'll get:
83
92
{ "id" : 1 , "title" : " json-server" , "author" : " webmasterdevlin" }
84
93
```
85
94
95
+ With API prefix enabled, you can also access the same data at http://localhost:3000/api/posts/1 .
96
+
86
97
### API Usage
87
98
88
99
``` typescript
@@ -180,7 +191,7 @@ Options:
180
191
--read-only, --ro Allow only GET requests [default: false]
181
192
--no-cors, --nc Disable CORS [default: false]
182
193
--no-gzip, --ng Disable GZIP compression [default: false]
183
- --enable-api-prefix, --api Enable /api/* prefix [default: false]
194
+ --enable-api-prefix, --api Enable /api/* prefix routes [default: false]
184
195
--delay, -d Add delay to responses (ms) [number]
185
196
--id, -i Set database id field [default: "id"]
186
197
--foreignKeySuffix Set foreign key suffix [default: "_id"]
@@ -189,6 +200,28 @@ Options:
189
200
--version, -v Show version [boolean]
190
201
```
191
202
203
+ ### Example Commands
204
+
205
+ ``` bash
206
+ # Basic usage
207
+ json-server db.json
208
+
209
+ # With API prefix support
210
+ json-server db.json --enable-api-prefix
211
+
212
+ # Custom port with API prefix
213
+ json-server db.json --port 3001 --api
214
+
215
+ # With delay and API prefix
216
+ json-server db.json --delay 1000 --enable-api-prefix
217
+
218
+ # With custom routes and API prefix
219
+ json-server db.json --routes routes.json --api
220
+
221
+ # Read-only mode with API prefix
222
+ json-server db.json --read-only --enable-api-prefix
223
+ ```
224
+
192
225
## Filtering and Pagination
193
226
194
227
Use query parameters for filtering:
@@ -208,30 +241,84 @@ GET /posts?_sort=title&_order=desc
208
241
209
242
## API Prefix
210
243
211
- The API prefix feature allows you to access all your resources with an ` /api ` prefix. This is useful when:
244
+ The API prefix feature allows you to access all your resources with an ` /api ` prefix, making your mock API feel more like a production backend. When enabled, both standard routes and API-prefixed routes work simultaneously.
212
245
213
- - You want to make your mock API feel more like a real backend
214
- - You need to differentiate API routes from other routes in your application
215
- - You're working with frontend frameworks that expect API routes to start with ` /api `
246
+ ### Why Use API Prefix?
247
+
248
+ - ** Production-like experience** : Makes your mock API behave like a real backend with ` /api ` routes
249
+ - ** Frontend framework compatibility** : Works seamlessly with frameworks that expect API routes to start with ` /api `
250
+ - ** Route organization** : Helps differentiate API routes from static file routes
251
+ - ** Development consistency** : Matches common backend API patterns
216
252
217
253
### Using API Prefix with CLI
218
254
219
- Enable the API prefix feature using the ` --enable-api-prefix ` (or ` -api ` shorthand) flag:
255
+ Enable the API prefix feature using the ` --enable-api-prefix ` (or ` -- api ` shorthand) flag:
220
256
221
257
``` bash
222
258
json-server db.json --enable-api-prefix
223
259
```
224
260
225
- This allows you to access resources through both standard and API-prefixed routes:
261
+ ** Both route styles work simultaneously:**
262
+
263
+ ``` bash
264
+ # Standard routes (still work)
265
+ curl http://localhost:3000/posts
266
+ curl http://localhost:3000/posts/1
267
+ curl http://localhost:3000/db
226
268
269
+ # API-prefixed routes (also work)
270
+ curl http://localhost:3000/api/posts
271
+ curl http://localhost:3000/api/posts/1
272
+ curl http://localhost:3000/api/db
227
273
```
228
- # Standard routes still work
229
- GET /posts
230
- GET /posts/1
231
274
232
- # API-prefixed routes also work
275
+ ### All HTTP Methods Supported
276
+
277
+ The API prefix works with all HTTP methods:
278
+
279
+ ``` bash
280
+ # GET requests
233
281
GET /api/posts
234
282
GET /api/posts/1
283
+
284
+ # POST requests
285
+ POST /api/posts
286
+ Content-Type: application/json
287
+ {" title" : " New Post" , " author" : " John Doe" }
288
+
289
+ # PUT requests
290
+ PUT /api/posts/1
291
+ Content-Type: application/json
292
+ {" id" : 1, " title" : " Updated Post" , " author" : " John Doe" }
293
+
294
+ # PATCH requests
295
+ PATCH /api/posts/1
296
+ Content-Type: application/json
297
+ {" title" : " Partially Updated Post" }
298
+
299
+ # DELETE requests
300
+ DELETE /api/posts/1
301
+ ```
302
+
303
+ ### Query Parameters and Pagination
304
+
305
+ All query parameters work with the API prefix:
306
+
307
+ ``` bash
308
+ # Filtering
309
+ GET /api/posts? author=webmasterdevlin
310
+ GET /api/posts? title=json-server& author=webmasterdevlin
311
+
312
+ # Pagination
313
+ GET /api/posts? _page=1& _limit=10
314
+ GET /api/posts? _page=2& _limit=5
315
+
316
+ # Sorting
317
+ GET /api/posts? _sort=title& _order=asc
318
+ GET /api/posts? _sort=id& _order=desc
319
+
320
+ # Pagination endpoint
321
+ GET /api/posts/paginate? _page=1& _limit=10
235
322
```
236
323
237
324
### Using API Prefix Programmatically
@@ -247,11 +334,50 @@ const server = create({
247
334
server .loadDatabase (' ./db.json' );
248
335
server .start ().then (() => {
249
336
console .log (' Server running with API prefix support' );
337
+ console .log (' Access your API at:' );
338
+ console .log (' - http://localhost:3000/posts (standard)' );
339
+ console .log (' - http://localhost:3000/api/posts (with prefix)' );
250
340
});
251
341
```
252
342
343
+ ### Example with Custom Routes
344
+
345
+ When using custom routes with API prefix enabled:
346
+
347
+ ** routes.json:**
348
+
349
+ ``` json
350
+ {
351
+ "/api/profile" : {
352
+ "GET" : " /users/1"
353
+ },
354
+ "/api/featured-post" : {
355
+ "GET" : " /posts/1"
356
+ },
357
+ "/api/users/:id/posts" : {
358
+ "GET" : " /posts?userId=:id"
359
+ }
360
+ }
361
+ ```
362
+
363
+ ** Start server:**
364
+
365
+ ``` bash
366
+ json-server db.json --routes routes.json --enable-api-prefix
367
+ ```
368
+
369
+ ** Access routes:**
370
+
371
+ ``` bash
372
+ curl http://localhost:3000/api/profile
373
+ curl http://localhost:3000/api/featured-post
374
+ curl http://localhost:3000/api/users/1/posts
375
+ ```
376
+
253
377
## Programmatic Usage
254
378
379
+ ### Basic Usage
380
+
255
381
``` typescript
256
382
import { create } from ' @webmasterdevlin/json-server' ;
257
383
@@ -279,9 +405,30 @@ server.addRoute('/custom-route', 'GET', (req, res) => {
279
405
server .loadDatabase (' ./db.json' );
280
406
server .start ().then (() => {
281
407
console .log (' JSON Server is running' );
408
+ console .log (' Standard routes: http://localhost:3000/posts' );
409
+ console .log (' API routes: http://localhost:3000/api/posts' );
282
410
});
283
411
```
284
412
413
+ ### Configuration Options
414
+
415
+ ``` typescript
416
+ interface ServerOptions {
417
+ port: number ; // Server port (default: 3000)
418
+ host: string ; // Server host (default: 'localhost')
419
+ cors: boolean ; // Enable CORS (default: true)
420
+ static: string | string []; // Static file paths
421
+ middlewares: RequestHandler []; // Custom middlewares
422
+ bodyParser: boolean ; // Enable body parsing (default: true)
423
+ noCors: boolean ; // Disable CORS (default: false)
424
+ noGzip: boolean ; // Disable gzip (default: false)
425
+ delay: number ; // Response delay in ms (default: 0)
426
+ quiet: boolean ; // Suppress logs (default: false)
427
+ readOnly: boolean ; // Read-only mode (default: false)
428
+ enableApiPrefix: boolean ; // Enable /api/* routes (default: false)
429
+ }
430
+ ```
431
+
285
432
## Beautiful CLI Experience
286
433
287
434
One of the standout features of this implementation is the beautifully styled CLI interface, designed to make your development experience more enjoyable and informative.
@@ -378,6 +525,50 @@ npm test
378
525
npm run build
379
526
```
380
527
528
+ ## Real-World Examples
529
+
530
+ ### Frontend Development with API Prefix
531
+
532
+ When developing a React/Vue/Angular application that will eventually connect to a backend API with ` /api ` routes:
533
+
534
+ ``` bash
535
+ # Start json-server with API prefix
536
+ json-server db.json --enable-api-prefix --port 3001
537
+
538
+ # Your frontend can now make requests to:
539
+ # http://localhost:3001/api/users
540
+ # http://localhost:3001/api/posts
541
+ # http://localhost:3001/api/comments
542
+ ```
543
+
544
+ ** Frontend code example:**
545
+
546
+ ``` javascript
547
+ // This will work with both your mock server and production API
548
+ const response = await fetch (' /api/users' );
549
+ const users = await response .json ();
550
+ ```
551
+
552
+ ### Testing Different Network Conditions
553
+
554
+ ``` bash
555
+ # Simulate slow network
556
+ json-server db.json --api --delay 2000
557
+
558
+ # Test with different delays
559
+ json-server db.json --api --delay 500 # 500ms delay
560
+ json-server db.json --api --delay 1500 # 1.5s delay
561
+ ```
562
+
563
+ ### Safe Demo Mode
564
+
565
+ ``` bash
566
+ # Read-only mode with API prefix for demos
567
+ json-server db.json --api --read-only
568
+
569
+ # Only GET requests will work, perfect for demonstrations
570
+ ```
571
+
381
572
## Contributing
382
573
383
574
Please read our [ Contributing Guide] ( CONTRIBUTING.md ) and [ Code of Conduct] ( CODE_OF_CONDUCT.md ) before submitting a pull request.
0 commit comments