@ngx-cache/platform-browser

SPA/Browser platform implementation of ngx-cache

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 - Examples - Related packages - Adding @ngx-cache/platform-browser to your project (SystemJS)
  • app.module configuration
    • Angular (SPA) application
    • Angular Universal application
• Credits
• License

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:

• @ngx-cache/core

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

• universal-starter: Angular 2 Universal starter kit by @AngularClass

License

The MIT License (MIT)

Copyright (c) 2019 Burak Tasci