loading...

Manage Browser Cookies with React Hooks

devhammed profile image Hammed Oyedele ・1 min read

Browser Cookies

So this week, I created my first NPM package and my first custom React Hooks!!!

GitHub logo devhammed / use-cookie

Get, Set, Update and Delete Cookie using React Hooks.

@devhammed /use-cookie

Get, Set, Update and Delete Cookie using React Hooks.

NPM JavaScript Style Guide

Install

npm install --save @devhammed
/use-cookie

Usage

import React from 'react'
import ReactDOM from 'react-dom'
import useCookie from '@devhammed
/use-cookie'
const App = () => {
  const [username, setUsername, deleteUsername] = useCookie('username', 'User')
  return (
    <section>
      <h1>Hello {username}!</h1>
      <p>Edit below input, Your name will be stored in a cookie. you can refresh this page to see how it persists.</p>
      <input
        type='text'
        value={username}
        onChange={(e) => setUsername(e.target.value)}
      />
      <button
        onClick={() => deleteUsername()}
      >
        Delete Cookie
      </button>
    </section>
  )
}
ReactDOM.

Want to you manage HTTP Cookies using React???
I created useCookie() React Hook, you can use it to Get, Set, Update and Delete Cookies in your functional components.

Demo: https://devhammed.github.io/use-cookie
NPM: https://www.npmjs.com/package/@devhammed/use-cookie

Discussion

pic
Editor guide