@mechamobau/simplestorage
TypeScript icon, indicating that this package has built-in type declarations

0.0.3 • Public • Published

Simple Storage

Build Status License Library minified size Library minified + gzipped size

The module to simplify the usage of Storage API in React.js

Installation

This library is published in the NPM registry and can be installed using any compatible package manager.

npm install simplestorage --save

# For Yarn, use the command below.
yarn add simplestorage

Installation from CDN

This module has an UMD bundle available through JSDelivr and Unpkg CDNs.

<!-- For UNPKG use the code below. -->
<script src="https://unpkg.com/@mechamobau/simplestorage"></script>

<!-- For JSDelivr use the code below. -->
<script src="https://cdn.jsdelivr.net/npm/@mechamobau/simplestorage"></script>

<script>
  // UMD module is exposed through the "simpleStorage" global variable.
  console.log(simpleStorage);
</script>

Usage

This module needs to be used inside a functional component. The useStorage hook return value from Storage API and setValue change that value.

import React, { useState } from 'react';
import { useStorage } from '@mechamobau/simplestorage';

const Todo = () => {
  const [value, setValue] = useStorage('<YOUR-LOCAL-STORAGE-KEY>', {
    placeholder: 'undone'
  });
  const [status, setStatus] = useState(false)

  handleClick = () => {
    setValue(status ? 'done' : 'undone')
    setStatus(!status);
  };

  return (
    <p>Todo Status: {value}</p>
    <button onClick={handleClick}>Toggle Status</button>
  );
};

Documentation

Documentation generated from source files by Typedoc.

License

Released under MIT License.

Package Sidebar

Install

npm i @mechamobau/simplestorage

Weekly Downloads

0

Version

0.0.3

License

MIT

Unpacked Size

24 kB

Total Files

31

Last publish

Collaborators

  • mechamobau