CashWay Dashboard

A modern, responsive dashboard application built with React and Tailwind CSS. Features a clean UI with dark/light theme support, interactive charts, and a collapsible sidebar navigation.

Features

• 🎨 Dark/Light Theme - System preference detection with manual theme switching
• 📱 Responsive Design - Mobile-friendly layout with collapsible sidebar
• 📊 Data Visualization - Interactive charts using Recharts
• 🧭 Navigation - Multi-section sidebar with routing support
• ⚡ Fast Development - Built with Vite for optimal performance

Tech Stack

• React 18 - UI library
• Vite - Build tool and dev server
• Tailwind CSS - Utility-first CSS framework
• React Router - Client-side routing
• Recharts - Chart library for data visualization
• Lucide React - Icon library

Prerequisites

• Node.js (v16 or higher)
• npm or yarn

Installation

1. Clone the repository:

git clone https://github.com/Jobsidney/CashWay.git
cd CashWaydashboard

2. Install dependencies:

npm install

Running the Application

Development Mode

Start the development server:

npm run dev

The application will be available at http://localhost:5173 (or the next available port).

Build for Production

Create an optimized production build:

npm run build

The built files will be in the dist directory.

Preview Production Build

Preview the production build locally:

npm run preview

Project Structure

src/
├── assets/          # Images and static assets
├── constants/       # Application constants and configuration
├── contexts/        # React context providers
├── hooks/           # Custom React hooks
├── layouts/         # Layout components (Header, Sidebar, Footer)
├── routes/          # Route components and pages
└── utils/           # Utility functions

Available Scripts

• npm run dev - Start development server
• npm run build - Build for production
• npm run preview - Preview production build
• npm run lint - Run ESLint

License

© 2024 XD Code All Rights Reserved