Complete Tutorial: React Admin Panel with refine and daisyUI

1

Recharts

We first build the dashboard page where we present stats for relevant KPIs in cards, charts and a table. We use the React-based Recharts library for plotting our data.

#Charting Libraries #Data Visualization #Data Dashboard 18 social mentions

We have to install refine's support packages for React Table and React Hook Form. We are using Tailwind Heroicons for our icons, the Day.js library for time calculations and Recharts library to plot our charts for KPI data. So, run the following and we are good to go:.

#Javascript UI Libraries #JS Library #Application And Data 40 social mentions

3

DaisyUI

DaisyUI is an open source UI library built on top of TailwindCSS. It provides short, component-oriented, semantic classes composed from regular, longer Tailwind class strings that typically contribute to clumsy markup in an application. Daisyui hosts a growing collection of pre-styled templates for components like buttons, menus, and tabs with responsive, size, shape, and color variants.

#Design Tools #User Experience #Developer Tools 156 social mentions