# ngx-mock-server

> [![npm version](https://badge.fury.io/js/ngx-mock-server.svg)](https://badge.fury.io/js/ngx-mock-server) [![GitHub issues](https://img.shields.io/github/issues/dima11221122/ngx-mock-server.svg)](https://github.com/dima11221122/ngx-mock-server/issues) [![G

Latest version **2.0.1** (published 2020-05-05) · 0 weekly downloads

## Install

```sh
npm install ngx-mock-server
pnpm add ngx-mock-server
yarn add ngx-mock-server
bun add ngx-mock-server
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 2.0.1 |
| Published | 2020-05-05 |
| First published | 2018-06-17 |
| Weekly downloads | 0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 254.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | dima11221122 |

## Links

- npm: https://www.npmjs.com/package/ngx-mock-server
- npm.io page: https://npm.io/package/ngx-mock-server

## Recent versions

- 2.0.1 (latest) — 2020-05-05
- 2.0.0 — 2020-05-03
- 1.2.0 — 2018-06-23
- 1.1.0 — 2018-06-23
- 1.0.0 — 2018-06-17

## README

# ngx-mock-server
[![npm version](https://badge.fury.io/js/ngx-mock-server.svg)](https://badge.fury.io/js/ngx-mock-server)
[![GitHub issues](https://img.shields.io/github/issues/dima11221122/ngx-mock-server.svg)](https://github.com/dima11221122/ngx-mock-server/issues)
[![GitHub forks](https://img.shields.io/github/forks/dima11221122/ngx-mock-server.svg)](https://github.com/dima11221122/ngx-mock-server/network)
[![GitHub stars](https://img.shields.io/github/stars/dima11221122/ngx-mock-server.svg)](https://github.com/dima11221122/ngx-mock-server/stargazers)
[![GitHub license](https://img.shields.io/github/license/dima11221122/ngx-mock-server.svg)](https://github.com/dima11221122/ngx-mock-server/blob/master/LICENSE)

*Inspired by [ng2-mock-server](https://www.npmjs.com/package/ng2-mock-server)*

An angular 5+ mock to mock back-end. The package uses http client interceptors mechanism. It's a really useful package when real back-end isn't available.

## Features
- No back-end required :no_entry_sign:
- Support regexp and strings in routes definitions :mega:
- Support lazy modules :dromedary_camel:
- Works with Angular 5+ (including Angular 9) :boom:
- Can be disabled from outside :cop:
- Zero-dependency :zero:

## Getting started
`npm i ngx-mock-server`

Mock necessary endpoints:

```typescript
import { HttpRequest, HttpResponse } from '@angular/common/http';
import { Observable } from 'rxjs';
import { RouteDeclaration, json } from 'ngx-mock-server';

const users = [
  { id: 1, username: 'user1' },
  { id: 2, username: 'user2' }
];

export function usersCallback(req) {
  const query = req.params.get('query');
  return json(200, [
    { id: 1, username: 'user1' },
    { id: 2, username: 'user2' }
  ]);
}

export const appMockRoutes: RouteDeclaration[] = [
  {
    path: '/users',
    method: 'GET',
    callback: usersCallback
  },
]
```

Import `NgxMockServerModule` with mocked endpoints:

```typescript
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { NgxMockServerModule } from 'ngx-mock-server';
import { appMockRoutes } from './mock';
import { HttpClientModule } from '@angular/common/http';

@NgModule({
  imports:      [ 
    BrowserModule,
    HttpClientModule,
    NgxMockServerModule.forRoot({
      routes: appMockRoutes,
      enabled: true
    })
  ],
  declarations: [ AppComponent ],
  bootstrap:    [ AppComponent ]
})
export class AppModule { }
```

Test!:

```typescript
import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent implements OnInit {
  constructor(private httpClient: HttpClient) {
  }

  ngOnInit() {
    this.httpClient.get('/users').subscribe((users) => console.log(users));
  }
}

```

[StackBlitz](https://stackblitz.com/edit/angular-iyffif)

## DEMO

[Here](https://dima11221122.github.io/ngx-mock-server/users)

---
_Source: https://npm.io/package/ngx-mock-server · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._