# @wranggle/storage-web

> WranggleStorage bundle that includes the main feature layers and persistence adapters for a Browser environment

Latest version **0.2.4** (published 2019-03-22) · Apache-2.0 license · 0 weekly downloads

## Install

```sh
npm install @wranggle/storage-web
pnpm add @wranggle/storage-web
yarn add @wranggle/storage-web
bun add @wranggle/storage-web
```

## Health

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

Positive: has types; no vulnerabilities.

Warnings: low downloads; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.2.4 |
| Published | 2019-03-22 |
| First published | 2019-03-19 |
| Weekly downloads | 0 |
| License | Apache-2.0 |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 6 |
| Unpacked size | 225.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Jeff Ferber |
| Maintainers | wranggle.ferbs |
| Keywords | wranggle-storage, storage, persistence, middleware, localforage |

## Links

- npm: https://www.npmjs.com/package/@wranggle/storage-web
- Repository: https://github.com/wranggle/storage
- Issues: https://github.com/wranggle/storage/issues
- npm.io page: https://npm.io/package/@wranggle/storage-web

## Dependencies (6)

- [@wranggle/storage-core](https://npm.io/package/@wranggle/storage-core.md) ^0.2.4
- [@wranggle/storage-remote](https://npm.io/package/@wranggle/storage-remote.md) ^0.2.4
- [@wranggle/storage-chrome-adapter](https://npm.io/package/@wranggle/storage-chrome-adapter.md) ^0.2.4
- [@wranggle/storage-key-name-layer](https://npm.io/package/@wranggle/storage-key-name-layer.md) ^0.2.4
- [@wranggle/storage-expiration-layer](https://npm.io/package/@wranggle/storage-expiration-layer.md) ^0.2.4
- [@wranggle/storage-local-forage-adapter](https://npm.io/package/@wranggle/storage-local-forage-adapter.md) ^0.2.4

## Alternatives

- [@sindresorhus/slugify](https://npm.io/package/@sindresorhus/slugify.md) — 3.7M weekly downloads
- [solid-js](https://npm.io/package/solid-js.md) — 2.7M weekly downloads
- [expo-glass-effect](https://npm.io/package/expo-glass-effect.md) — 2.5M weekly downloads
- [nanoassert](https://npm.io/package/nanoassert.md) — 780.8K weekly downloads
- [@ffmpeg/ffmpeg](https://npm.io/package/@ffmpeg/ffmpeg.md) — 529.5K weekly downloads

## Recent versions

- 0.2.4 (latest) — 2019-03-22
- 0.2.3 — 2019-03-21
- 0.2.2 — 2019-03-19
- 0.2.1 — 2019-03-19

## README

# @wranggle/storage-web

This *@wranggle/storage-web* package bundles the main feature layers and persistence adapters used in web pages and browser extensions. (~20k total size.)
 
This page is dedicated to installation/setup. See the main [WranggleStorage](https://github.com/wranggle/storage) documentation for additional instructions.


## Setup

### Installation

#### Using a bundler (Webpack/Browserify/Rollup)

1. Add the package [@wranggle/storage-web](https://www.npmjs.com/package/@wranggle/storage-web) to your project:
    ```bash
    # From the command line using yarn:
    yarn add @wranggle/storage-web
    
    # or with npm:
    npm install @wranggle/storage-web 
    ```

1. In your JavaScript, import or require WranggleStorage:
    ```javascript
    import { WranggleStorage } from '@wranggle/storage-web'; 
    // or:
    const { WranggleStorage } = require('@wranggle/storage-web');  
    ```


#### Directly in HTML

Load the library in your page
```html
<script src="https://cdn.jsdelivr.net/npm/@wranggle/storage-web@latest"></script>
``` 

### Create your store

Make sure your persistence library is available. For a web page, this is typically LocalForage&mdash; see their [installation instructions](https://localforage.github.io/localForage/#installation). 

In a web page, the following sets up your store (without any feauture layers yet added):
```javascript
const store = new WranggleStorage({ localForage })
```  
![LocalForage not included](https://img.shields.io/badge/NOTE:-LocalForage_not_included-orange.svg)

If you want to configure LocalForage (eg, to specify its storage driver) see the [LocalForage adapter instructions](https://github.com/wranggle/storage-local-forage-adapter).


In a **browser extension**, you would use a different persistence adapter. Eg:
```javascript
const store = new WranggleStorage({ chrome: true })
```  

## Next Steps

Next, you'll want to add some feature layers. See the main [WranggleStorage](https://github.com/wranggle/storage#Feature-Layers) documentation for instructions.

---
_Source: https://npm.io/package/@wranggle/storage-web · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._