1.2.3 • Published 5 years ago

react-hooks-giphy v1.2.3

Weekly downloads
15
License
ISC
Repository
github
Last release
5 years ago

react-hooks-giphy

Open Source Love

NPM version npm download last commit Repo size Github Top Language

Super easy Giphy API support for ReactJS

Alt Text

Dependencies

Needs axios as a dependency

npm install --save axios

yarn

yarn add axios

Install

Note: Make sure that you have installed the correct version of react(>= v16.8.0) and react-dom(>= v16.8.0).

npm

npm install --save react-hooks-giphy

yarn

yarn add react-hooks-giphy

Demo

Live Show

Usage

import Giphy

import Giphy from "react-hooks-giphy";

Get random gif

<Giphy />

Get gif with a tag

<Giphy tag="happy" />

Pass in triggers to refresh with a new gif

<Giphy triggers={[triggers]} />

Configuring Options

Show gif title

const config = {
  title: true
};
<Giphy {...config} />;

Example

import React, { useState } from "react";
import ReactDOM from "react-dom";
import "./styles.css";

import Giphy from "react-hooks-giphy";

function App() {
  const [flag, triggerFlag] = useState(false);
  return (
    <div className="App">
      <h1>React Hooks Giphy</h1>
      <p> Random Gif </p>
      <Giphy />
      <p> Happy Gif </p>
      <Giphy tag="happy" />
      <p> Happy Gif with a trigger to refresh Gif</p>
      <Giphy tag="happy" triggers={[flag]} />
      <button onClick={() => triggerFlag(!flag)}>Get another gif</button>
    </div>
  );
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

Contribution

Make a PR

PRs Welcome

Development

Node >= v8 LTS

  • Clone the project to local disk
  • npm install
  • npm start

License

MIT Licence

1.2.3

5 years ago

1.2.2

5 years ago

1.2.1

5 years ago

1.2.0

5 years ago

1.1.3

5 years ago

1.1.2

5 years ago

1.1.0

5 years ago

1.0.3

5 years ago

1.0.2

5 years ago

1.0.1

5 years ago

1.0.0

5 years ago