This project implements Satori dashboard with Search functionality, using Typescript, React and Redux. The following tutorial is used for building it.
!!!Important. Node version 14.17.0 is used.
This is a Next.js project bootstrapped with create-next-app.
- Next.js
- React
- TypeScript
- Redux
Random 100 rows data were generated, using a Python script. They are in file.
The dashboard loads data directly from the file. No database is used.
Go to the Dashboard directory:
cd DashboardFirst, install the modules:
npm install
# or
yarn installThan, run the development server:
npm run dev
# or
yarn devOpen http://localhost:3000 with your browser to see the result.
You can start editing the page by modifying pages/index.tsx. The page auto-updates as you edit the file.
Search, using the search bar and multiple select boxes.
!!!Important. After a setting of select boxes or an input in the search bar, do not press the search button. It acts as a clear now. Instead make a left click on the purple box. Everything will work correctly then.