OuthBack / sentineler

The package is a "sentinel" that trigger a function when is visible.

Sentineler

The package is a "sentinel" that trigger a function when is visible.

View Preview · Report Bug · Require Feature

Content Tabel

1. About the project
   • Built with:
2. Getting Started
   • Requirements
   • Instalation
   • Instalation
3. Site Preview
4. Licence
5. Contact

📖 About the project

The package is a "sentinel" that trigger a function when is visible.

🔋 Built with:

• React.js
• Intersection Observer

📜 Getting Started

To run the project it is just:

⚠️ Requirements

• npm

  npm install npm@latest -g

⚙️ Installation

1. Install the package

   npm install sentineler

   ou

   yarn add sentineler

2. Import the package

   import Sentineler from "sentineler";

3. Call the compoenent and give the callback

   <Sentinel
     callback={() => {
       console.log("test");
     }}
   />

   Example:

   import Sentineler from "sentineler";
   
   const App = () => {
     return (
       <Sentinel
         callback={() => {
           console.log("test");
         }}
       />
     );
   };
   
   export default App;

🦴 Props

Prop	Type	Default	Description
callback (required)	Function	–	Callback function to run when the Sentineler is visible

🖥️ Site Preview

I made this infinite scroll using this component.

See the Site Preview: https://taq-challenge.vercel.app

🎯 Test

To contribute to the project you just need:

1. Clone the repository

   git clone https://github.com/OuthBack/sentineler

2. Install the packages

   npm install

   ou

   yarn

3. For now you can create a link, but soon I will create a react application

   yarn link
   

4. In another project that you are using react

   yarn link "sentineler"

5. Now it is just follow the example

📝 Licence

Distributed under the MIT License. See LICENSE for more information.

📞 Contact

Henrique Figueiredo - [e-mail]

Project Link: https://github.com/OuthBack/sentineler