DEV Community

Cover image for React, Tremor & Tailwind - Coder Stats via GitHub API
Sm0ke
Sm0ke

Posted on • Edited on • Originally published at blog.appseed.us

React, Tremor & Tailwind - Coder Stats via GitHub API

Hello Coders!

This article mentions an open-source sample that presents the developer's stats pulled from GitHub free API and presents the information using React & Tremor Library. Thanks for reading!


Copyright Note: Project adapted for React & Tremor from Svelte Version crafted by Robert Soriano.

The flow is pretty simple: Users input their username, the information is consumed from GitHub and the charts are displayed. For newcomers, Tremor is a modern stack built on top of Tailwind and ReCharts, focusing mainly on scientists and developers that develop dashboards and analytics products.

React, Tremor & Tailwind - Open-Source Sample (animated presentation)


The product can be used by anyone that has a decent NodeJS version installed in the workstation. Once the sources are saved locally, the project can be started easily.

$ git clone https://github.com/app-generator/sample-tremor-github-charts.git
$ cd sample-tremor-github-charts
$
$ yarn       # install modules
$ yarn start # start for development 
Enter fullscreen mode Exit fullscreen mode

✨ What is Tremor

Tremor is a low-level, opinionated UI component library to build dashboards. It offers components, such as charts, layouts, or input elements, covering the essential parts of a dashboard or analytical interface.

Their approach provides flexibility between beautiful defaults and fast customization. The best way to get started is to check out our templates, called Blocks, for getting a feeling of how components are used and combined.

Tremor - Free React Library for Dashboards


Thanks for reading! For more resources and support, please access:

  • πŸš€ Free support provided by AppSeed (email & Discord)
  • πŸ‘‰ More free apps crafted in Flask, Django, and React

Top comments (6)

Collapse
 
khalidsaifullahfuad profile image
Khalid Saifullah Fuad

So, you're heavily inspired from octoprofile by bchiang7, Right?. You know should add credits and appreciate her work.

Collapse
 
sm0ke profile image
Sm0ke

Hello @khalidsaifullahfuad

The code was adapted from a Svelte codebase, here are the credentials:

Copyright Note: Project adapted for React & Tremor from Svelte Version crafted by Robert Soriano.

Collapse
 
crearesite profile image
WebsiteMarket

nice use case.

Collapse
 
sm0ke profile image
Sm0ke

ty πŸš€πŸš€

Collapse
 
uithemes profile image
ui-themes

Tremor got some traction lately.
Thank you for this experiment

Collapse
 
sm0ke profile image
Sm0ke

looks promising. πŸš€πŸš€