NgBackend

NgBackend is a library that helps to write beautiful Angular http interceptors with decorators like controllers on backend.

• Speeds up writing http interceptors
• Adds sugar to the use of http interceptors
• Allows you to write request mocks as if it were a real backend
• Preserves the logic of the http interceptors

Installation

NgBackend is available as a package for use with an Angular application.

# npm
npm install @ng-backend/http

# yarn
yarn add @ng-backend/http

TypeScript type definitions are included in the library and do not need to be installed additionally.

Documentation

You can find the NgBackend documentation on the website.

Examples

Provide Controller

It provides like http interceptor

@Controller('todos')
class TodosController {
  //...
}

@NgModule({
  //...
  providers: [
    {
      provide: HTTP_INTERCEPTORS,
      useClass: TodosController,
      multi: true,
    },
  ],
})
export class AppModule {}

Get input request

@Controller('todos')
class TodosController {
  @Get()
  public getById({ request }: MethodHandlerInput): void {
    return request.clone({
      withCredentials: true,
    });
  }
}

Set headers for input request

@Controller('todos')
class TodosController {
  @Get()
  @Header('author-name', 'Vsevolod Zolotov')
  @Header('author-age', '20')
  @Header('programming-language', 'TypeScript')
  public get(): void {}
}

Intercept a request with dynamic params

@Controller('todos')
class TodosController {
  // will filter request with todos/:id url
  @Get.id('int')()
  public getById({ dynamicParamsMap }: MethodHandlerInput): void {
    console.log(dynamicParamsMap.get('id'));
  }
}

Redirect to another url

@Controller('todos')
class TodosController {
  @Get()
  @Redirect('<your url>')
  public get(): void {}

  @Get()
  @Redirect((url) => `${url}/your/path`)
  public get(): void {}
}

Return http response by AutoResponse decorator

@Controller('todos')
class TodosController {
  @Post()
  // configure full Response
  @AutoResponse({
    body: {
      name: 'Vsevolod',
      age: 20,
    },
    status: 200,
  })
  public post(): void {}

  @Get()
  // configure only Response body
  @AutoResponse.body([
    {
      name: 'Vsevolod',
      age: 20,
    },
  ])
  public get(): void {}
}

Return dynamic HttpResponse or HttpEvent

@Controller('todos')
@Disabled.controller
class TodosController {
  @Get()
  public get(): MethodHandlerResult {
    return new HttpResponse({
      body: {
        name: 'Vsevolod',
        age: 20,
      },
    });
  }

  @Post()
  public post(): MethodHandlerResult {
    // if you return not HttpEvent it will be wrapped into HttpResponse
    return {
      name: 'Vsevolod',
      age: 20,
    };
  }
}

Disable logic

@Controller('todos')
@Disabled.controller
class TodosController {
  @Get()
  @Disabled.handler
  public get(): void {}
}