Giter Club home page Giter Club logo

usecustomhooks's Introduction

๐Ÿ“ฆ useCustomHooks ๐Ÿ“ฆ

npm package containing a set of custom hooks for your next React project.



๐Ÿงฐ Installation

Using npm or yarn ๐Ÿ“ฆ

# Using npm
npm i use-custom-hooks

# Using yarn
yarn add use-custom-hooks

๐Ÿ“˜ Available Hooks

๐Ÿ“„ Documentation

For documentation, examples and other details refer Documentation

๐Ÿค๐Ÿป Contributing

Guidelines ๐Ÿ“‹

Please read CONTRIBUTING for Code of Conduct, details and the process for submitting pull requests to us.

Basic steps:

  1. Open an issue explaining the changes.
  2. Work on the issue after you get assigned.
  3. Fork this repo.
  4. Install the dependencies using npm install.
  5. Make the changes.
  6. Check for linting errors using npm run lint.
  7. Open PR when the feature/fix is ready.
  8. The collaborators will review your PR and if approved will merge to the master.

Contributors โœจ

Thanks goes to these wonderful people (emoji key):

Aromal Anil
Aromal Anil

๐Ÿ“– ๐Ÿ’ป ๐Ÿšง
Rahul Mahesh
Rahul Mahesh

๐Ÿ“–
Fernando Amezcua
Fernando Amezcua

๐Ÿ’ป ๐Ÿ“–
Jonathan Carter
Jonathan Carter

๐Ÿ’ป ๐Ÿ“–
Murilo Leandro
Murilo Leandro

๐Ÿ’ป ๐Ÿ“–
Evangelos Charalampidis
Evangelos Charalampidis

๐Ÿ’ป ๐Ÿ“–

This project follows the all-contributors specification. Contributions of any kind are welcome!


๐Ÿ“œ License

Copyright (c) 2020 Aromal Anil

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

โœ๐Ÿป Creator

Aromal Anil

usecustomhooks's People

Contributors

allcontributors[bot] avatar aromalanil avatar imevanc avatar minimatrix avatar muriloucolouco avatar rahulmahesh62 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

usecustomhooks's Issues

Add useMousePointer hook

Describe the hook

A hook which returns the current coordinates of the mouse pointer, as a state.

Request for useToggle hook

Describe the hook

A hook which will return a boolean state and a toggle function.
The toggle function should set the state to its negation.

Documentation is not complete

What is the Problem?

The documentation for the hooks are not complete. Only useLocalStorage hook has complete documentation. Other hooks does not contain Parameters and Return values in their documentation

Possible Solution

Add parameters and return values to the docs of all other hooks

What to contribute? How can you help?

  • The code for each hook contains corresponding parameters and return values, defined as JSdoc comments.
  • You can take the data from there and add it to the documentation

๐ŸŒŸ Add new custom hooks !

Description

Need to add more custom hooks to this repo.

For Contributors

  • Please include an example of how the hook is used.
  • Add JSDoc comments to the hook to get IntelliSense for the hook.
  • Also consider adding your hook to the Readme file.

import issue

I am getting an invalid hook call error, can anyone help me to solve this!

error

error

code

code

but when I am using it as a separate file, it works

example

image

Move the documentation for the custom hooks from README

Issue Description

Currently, the documentation for every hooks are added to the README file. This can get complex as the number of hooks in the package increases.

Possible Solution

We should move these to a new location. A separate doc section would help. Please share your suggestion on how to solve this.

Include useDarkMode hook

Describe the hook

A hook which will return a dark state and set dark state function.
The hook should add a class name to the body when dark mode.

Example

import {useDarkMode} from "useDarkMode"

const App = () =>{

 const [darkMode,setDarkMode] = useDarkMode(true,"dark")
 //This should add a class name .dark to the body if it is dark mode.

 return <div></div>
}

Need Issue & Pull request templates.

Issue Description

The repo currently has 2 templates for issues, but it lacks an issue template for general issues and documentation issues.

Possible Solution

Add templates for PRs and Issues. Also, suggest improvements for the current issue templates.

Hook to get the latitude and longitude

Describe the hook
A hook to get the latitude and longitude

Additional context
Create a hook to get the current position from the browser.

import React from "react"
import useGeolocalisation from "useGeolocalisation"

const Home = () => {
  /*
  * The hook will return you an object like this: 
  * 
  * {
  *   latitude: 1233234,
  *   longitude: -1234345,
  * }
  * 
  */

  const [geolocalitation] = useGeolocalisation(true);

  return (
    <div>
      {geolocalitation.latitude}
      {geolocalitation.longitude}
    </div>
  );
}

Need useQueue Hook

Describe the hook

Since the package already contains a useStack hook, it would be great to have a useQueue hook.

  • This hook will be similar to useStack but for Queue data structure.

PRs are welcome ๐Ÿ™‚

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.