AgMockServer

$3

[](https://drive.google.com/uc?export=view&id=11ISv9G7qkNBqH2L0F5DK_FccdxTNwtnM)

![Build Status](https://bitbucket.org/akshayaravindh1015/ag-mock-server/src/master/)

Features

- Ability to send pre-configured responses for a specific API.
- An editable light GUI for mockserver.
- State consistency - even when page refreshes.
- Ability to UPLOAD & DOWNLOAD json file - to retain previous state.
- Configurable accross different environments.
- ✨See the Magic after clicking the menu button ✨
> The main goal of AGMockServer is to ease development effort of a UI Developer :)

Installation

AgMockServer requires Node.js v10+ to run.
``

sh
npm install ag-mock-server


#### 2-ways to use it :
1. For Angular Apps
##### AgMockServer is basically an Inteceptor(Angular) which acts a fake bakend:
!Image - Flow diagram of Ag Mock Interceptor as Fake Bakend.
$3

$3

1. Add the following Services & Interfaces in the providers section of AppModule. That's all dude.. Enjoyy!!

typescript
...
import { NgModule, APP_INITIALIZER } from '@angular/core';
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
import { environment } from 'src/environments/environment';
import { ByPassInterceptor, FakeBackendService } from 'ag-mock-server';
@NgModule({
  *
  providers: [
    ...(
      environment.production ? // <--can use any flag other than PROD flag.
        [] : [
          {
            provide: HTTP_INTERCEPTORS,
            useClass: ByPassInterceptor,
            multi: true,
          },
          {
            provide: APP_INITIALIZER,
            useFactory: (service: FakeBackendService) => () => { return service.startMockServer(); },
            deps: [FakeBackendService],
            multi: true,
          }
        ]
    ),
  ],
})
export class AppModule { }

`$3`


1. Add the following services, interfaces in the providers section & importing "AgMockServerModule" as show below in AppModule.

typescript
...
import { HTTP_INTERCEPTORS } from '@angular/common/http';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'
import { environment } from 'src/environments/environment';
import { ByPassInterceptor, AgMockServerModule } from 'ag-mock-server';

@NgModule({ declarations: [ AppComponent ], imports: [ BrowserModule, BrowserAnimationsModule, // <-- Import if not already imported for animations AgMockServerModule, // <-- Import this module ], providers: [ ...( environment.production ? // <--can use any flag other than PROD flag. [] : [ { provide: HTTP_INTERCEPTORS, useClass: ByPassInterceptor, multi: true, }, ] ), ], bootstrap: [AppComponent], }) export class AppModule { }`

2. Inject "FakeBackendService" in the AppComponent and start the mockServer.`typescript ... import { environment } from 'src/environments/environment'; import { FakeBackendService } from 'ag-mock-server';

@Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) export class AppComponent {

constructor(private _fakeBackend: FakeBackendService) { if(!environment.production) { this._fakeBackend.startMockServer(); //<-- Actually starts the mock server here.. } }

... }

``
---

2. For All Other Web Apps.

##### AgMockServer is basically mockserver running on port xxxx with configrable apis from json:
!Image - Flow diagram of Ag Mock Interceptor as Fake Bakend.

$3

- Developement still in progress - expected release in version 3.0.
*

Development

Have suggestions or found bugs in the app? Great. Please share your feedback in the below articles:
Medium || Hashnode || Connect on linkedin;

License

MIT

Free Software, Hell Yeah!

Installation

Node.js

sh
npm install ag-mock-server

#### 2-ways to use it :

1. For Angular Apps

##### AgMockServer is basically an Inteceptor(Angular) which acts a fake bakend:
!Image - Flow diagram of Ag Mock Interceptor as Fake Bakend.

$3

1. Add the following Services & Interfaces in the providers section of AppModule. That's all dude.. Enjoyy!!

typescript
...
import { NgModule, APP_INITIALIZER } from '@angular/core';
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';

import { environment } from 'src/environments/environment';
import { ByPassInterceptor, FakeBackendService } from 'ag-mock-server';

@NgModule({
*
providers: [
...(
environment.production ? // <--can use any flag other than PROD flag.
[] : [
{
provide: HTTP_INTERCEPTORS,
useClass: ByPassInterceptor,
multi: true,
},
{
provide: APP_INITIALIZER,
useFactory: (service: FakeBackendService) => () => { return service.startMockServer(); },
deps: [FakeBackendService],
multi: true,
}
]
),
],
})
export class AppModule { }

$3

1. Add the following services, interfaces in the providers section & importing "AgMockServerModule" as show below in AppModule.

typescript
...
import { HTTP_INTERCEPTORS } from '@angular/common/http';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'
import { environment } from 'src/environments/environment';
import { ByPassInterceptor, AgMockServerModule } from 'ag-mock-server';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule, // <-- Import if not already imported for animations
    AgMockServerModule, // <-- Import this module
  ],
  providers: [
    ...(
      environment.production ? // <--can use any flag other than PROD flag.
        [] : [
          {
            provide: HTTP_INTERCEPTORS,
            useClass: ByPassInterceptor,
            multi: true,
          },
        ]
    ),
  ],
  bootstrap: [AppComponent],
})
export class AppModule { }

2. Inject "FakeBackendService" in the AppComponent and start the mockServer.

typescript
...
import { environment } from 'src/environments/environment';
import { FakeBackendService } from 'ag-mock-server';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {

  constructor(private _fakeBackend: FakeBackendService) {
    if(!environment.production) {
      this._fakeBackend.startMockServer(); //<-- Actually starts the mock server here..
    }
  }

...
}

``
---