Skip to content
React components made for Product Hunt users 😽
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
example
src
.babelrc
.editorconfig
.eslintrc
.gitignore
.travis.yml
README.md
_config.yml
package.json
rollup.config.js
yarn.lock

README.md

React Product Hunt

React Components for Product Hunt Tweet

React Components for Product Hunt users

NPM JavaScript Style Guide

Requirements

Requires React and a Product Hunt account!

Installation

yarn add react-producthunt
# or
npm install --save react-producthunt

Components

1. Ship Widget Component

The Ship widget is a little bubble that appears on the bottom left or bottom right of the page that lets you capture email subscribers. See more about Ship at https://www.producthunt.com/ship.

React Product Hunt

ES6 import

import { ShipWidget } from "react-producthunt";

JSX (example)

<ShipWidget appId={12345} position="bottomLeft">

Props

  • appId: Number

    • Default: No default
    • Options: You can find your App ID in your Ship dashboard at a URL like this:

      https://www.producthunt.com/my/upcoming/[your-upcoming-product]/embed

  • position: String

    • Default: "bottomLeft"
    • Options: "bottomLeft" or "bottomRight"

2. Badge Component

A badge component based off of LinkedIn's Badges that you can put on your site to show off your Product Hunt profile.

Light Badge

React Product Hunt

Dark Badge

React Product Hunt

ES6 import

import { Badge } from "react-producthunt";

JSX (example)

<Badge username="thomaswangio" darkMode={true}>

Props

  • username: String

    • Default: No default
    • Options: Any Product Hunt username!
  • darkMode: Boolean

    • Default: false
    • Options: true or false

Future

This package is open for PR's of any kind! There's room for many creative components using the Product Hunt API. See the Product Hunt API GitHub Repo for their starter kit and more references on what data you can pull.

Makers Festival

This package was made for Product Hunt's Makers Festival 2019 - API Edition.

License

MIT © thomaswangio

You can’t perform that action at this time.