ngz-cache-platform-browser

Browser platform implementation of ngx-cache

Usage no npm install needed!

<script type="module">
  import ngzCachePlatformBrowser from 'https://cdn.skypack.dev/ngz-cache-platform-browser';
</script>

README

@ngx-cache/platform-browser npm version npm downloads

SPA/Browser platform implementation of ngx-cache

CircleCI coverage tested with jest Conventional Commits Angular Style Guide

Please support this project by simply putting a Github star. Share this library with friends on Twitter and everywhere else you can.

Table of contents:

Getting started

Installation

You can install @ngx-cache/platform-browser using npm

npm install @ngx-cache/platform-browser --save

Note: You should have already installed @ngx-cache/core.

Examples

  • ng-seed/universal is an officially maintained seed project, showcasing common patterns and best practices for @ngx-cache/platform-browser.

Related packages

The following packages may be used in conjunction with @ngx-cache/platform-browser:

Adding @ngx-cache/platform-browser to your project (SystemJS)

Add map for @ngx-cache/platform-browser in your systemjs.config

'@ngx-cache/platform-browser': 'node_modules/@ngx-cache/platform-browser/bundles/platform-browser.umd.min.js'

app.module configuration

Angular (SPA) application

  • Import CacheModule using the mapping '@ngx-cache/core' and append CacheModule.forRoot({...}) within the imports property of app.module (considering the app.module is the core module in Angular application).
  • Import BrowserCacheModule using the mapping '@ngx-cache/platform-browser' and append BrowserCacheModule.forRoot({...}) within the imports property of app.module.
  • Import CACHE injection token using the mapping '@ngx-cache/core', MemoryCacheService or LocalStorageCacheService (of your choice) using the mapping '@ngx-cache/platform-browser'.
  • Provide CACHE using MemoryCacheService or LocalStorageCacheService (of your choice), by calling the forRoot static method using the BrowserCacheModule.

app.module.ts

...
import { CacheModule, CACHE } from '@ngx-cache/core';
import { BrowserCacheModule, MemoryCacheService } from '@ngx-cache/platform-browser';
// import { BrowserCacheModule, LocalStorageCacheService } from '@ngx-cache/platform-browser';
...

@NgModule({
  declarations: [
    AppComponent,
    ...
  ],
  ...
  imports: [
    ...
    CacheModule.forRoot(),
    BrowserCacheModule.forRoot([
      {
        provide: CACHE,
        useClass: MemoryCacheService // or, LocalStorageCacheService
      }
    ]),
  ],
  ...
  bootstrap: [AppComponent]
})

Angular Universal application

  • Import BrowserCacheModule using the mapping '@ngx-cache/platform-browser' and append BrowserCacheModule.forRoot({...}) within the imports property of app.browser.module (considering the app.browser.module is the browser module in Angular Universal application).
  • Import CACHE injection token using the mapping '@ngx-cache/core', MemoryCacheService or LocalStorageCacheService (of your choice) using the mapping '@ngx-cache/platform-browser'.
  • Provide CACHE using MemoryCacheService or LocalStorageCacheService (of your choice), by calling the forRoot static method using the BrowserCacheModule.

app.browser.module.ts

...
import { CACHE } from '@ngx-cache/core';
import { BrowserCacheModule, MemoryCacheService } from '@ngx-cache/platform-browser';
// import { BrowserCacheModule, LocalStorageCacheService } from '@ngx-cache/platform-browser';
...

@NgModule({
  declarations: [
    AppComponent,
    ...
  ],
  ...
  imports: [
    ...
    BrowserCacheModule.forRoot([
      {
        provide: CACHE,
        useClass: MemoryCacheService // or, LocalStorageCacheService
      }
    ]),
  ],
  ...
  bootstrap: [AppComponent]
})

:+1: Yeah! @ngx-cache/platform-browser will now provide browser platform implementation to @ngx-cache/core.

Credits

License

The MIT License (MIT)

Copyright (c) 2019 Burak Tasci