npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

authbee

v1.0.2

Published

AuthBee is a NPM package to implement authentication in your JavaScript project

Downloads

3

Readme

AuthBee

AuthBee is a NPM package to implement authentication in your JavaScript project. If you are using JWT in your project, this is the best option for you since this tracks expirationDate with the help of localStorage and logouts the usert if token is expired.

Features

  • Token Verification
  • Automatic Logout when token expires

Why you should use AuthBee?

When I was a begineer I felt real difficult to implement client side authentication with lots of complex stuff such as automatic logout, etc... So, no matter whether you are a beginner, intermidiate or an expert. You can use AuthBee to implement client side authentication in you JavaScript application.

How to install AuthBee?

npm i authbee

How to use AuthBee?

Basicall there are four functions exported from the package and you can use it in any place of your application to retrieve, validate, login or logout user from your application. Check out the code snippets down below and also I reccomend you to checkout the React example developed using AuthBee.

1. Login

Login is a promise and you must take async or then approach to use it. Also, you must send an object as a parameter of the function which contains the expiresIn property and token property.

	import { login } from 'authbee'
	...
  	const submiLoginData = async(e) => {
		try{
			const url = 'https://yourapi.com/login';
    		const response = await fetch(url, {
        		method: 'POST',
        		body: JSON.stringify({
    				email: '[email protected]',
          			password: '123',
        		}),
      			headers: {
        			'Content-Type': 'application/json'
      			}
    		})

			// most of the time an object
			const data = await response.json();

			// expiresIn must be an integer
			await login({ token: data.token, expiresIn: data.expiresIn })
		}catch(console.log)
  	}

2. Logout

Logout is also a promise and since I use async/await in the previous example, I'll use then for this one. Also, there must be a token in the local storage aleady and if not the function will throw an error.

	import { logout } from 'authbee'
	...
	const logoutHandler = () => {
		logout()
			.then(() => {
				...
			})
			.catch(console.log)
	}

3. Verify

Verify is the main function of the package since it is the function responsible for token validation and automatic logout functionalities. Most suitable place to use this function is in app wide state like contextAPI, redux, etc...

	import { verify } from 'authbee'
	...
	const authContext = () => {
		// basically verify returns a boolean
		if (verify()){
			...
		}
		else {
			...
		}
	}

4. Get Data

Using get data function, you can retrieve the data stored in local storage when you logged in to the system and this is useful if you want to get the token in order to use it as an authentication header when send a request to the backend.

getData is also a promise and if the user is not logged in to the system (no token is stored in localStorage), it will send an error.

	import { getData } from 'authbee'
	...
	const fetchData = () => {
		getData()
			.then(({ token, expiresIn }) => {
				...
			})
			.catch(console.log)
	}

Future of AuthBee

I'm planning to implement following features into AuthBee inorder to make it more efficient.

  • Add Type definitions
  • Make auth bee usable for Server Side Rendered applications
  • Etc...

I highly appreciate you contribution in improving AuthBee. Please refer following resources if you are willing to contribute to AuthBee.

How to get more help?

Thank You 🐝!