Skip to content

React Component to scrape and display Instagram Posts based on Username or hashtag

Notifications You must be signed in to change notification settings

luchoster/react-ig

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

41 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

React-Ig

npm

This React Component will allow you to scrape Instagram posts and dislay a grid of images with an overlay (on hover) of number of likes and comments, each image links (opens in a new tab) to it's IG post url.

Based, inspired and ported from Gatsby Source Instagram.

Development

This project was bootstrapped with Create React App.

In the project directory, you can run:

yarn start

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.

Install

npm

npm install @luchoster/react-ig --save

yarn

yarn add @luchoster/react-ig

Available Props

  username
  hashtag
  altHash
  maxPosts

How to use

import InstagramPosts from '@luchoster/react-ig'

<InstagramPosts username="vegas" />

when using the username prop, it will only return the most recent 12 posts from that account, but you can use maxPosts if you want to display than 12 posts

or you can get scrape a hashtag and define a number of maxPosts (recommended) to display

<InstagramPosts hashtag="vegas" maxPosts="24" />

tags: React Instagram instafeed

About

React Component to scrape and display Instagram Posts based on Username or hashtag

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages