DEV Community

Cover image for react-profiles deployed !
Natesh M Bhat
Natesh M Bhat

Posted on

react-profiles deployed !

My Workflow

github actions makes Publishing packages to various package managers easier than ever before.

I am using "Node.js Package" workflow to build and publish my npm package into npm and github packages when i create a new release in my codebase.

Submission Category:

DIY Deployments

Yaml File or Link to Code

GitHub logo nateshmbhat / react-profiles

A set of Profile UI components like Github , Stackoverflow , hackerrank with automatic api calls to get the profile data of a user.

react-profiles

A collection various Profile components with auto data retrieval using public APIs and auto cache management of profile data. You wanna showcase your profile ? Style it up with react-profiles :)

Features :

  • Profile components for lot of common sites.
  • Compressed SVG icons for scalability.
  • Uses public APIs to fetch data based on given username
  • Manages caching of API data automatically with appropriate refresh frequency.
  • Material ui components for visual treat.
  • Tooltip customization.

Usage :

npm install react-profiles
import { GitHub, HackerRank, Facebook, StackOverflow, LinkedIn, Instagram, GooglePlus, Youtube, Yahoo, Twitch, Twitter, Skype } from 'react-profiles';

NOTE : DONT FORGET to include fontawesome css in your index.html

<link href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.css" rel="stylesheet"  type='text/css'>

Profile Bars :

GitHub (auto fetch data) :

<GitHub username="nateshmbhat" />

StackOverflow

Top comments (0)