Antd Admin Dashboard

A modern, responsive admin dashboard built with React 19, TypeScript, Ant Design, and Vite. Perfect for fintech applications, payment gateways, and administrative systems.

✨ Features

• Modern Tech Stack: Built with React 19, TypeScript, and Vite for blazing-fast development
• Beautiful UI: Polished interface based on Ant Design components
• Responsive Layout: Works flawlessly across desktop, tablet, and mobile devices
• Lazy Loading: Optimized performance with code splitting and suspense
• Hierarchical Navigation: Clean sidebar with multi-level menu support
• Authentication Ready: Includes secure sign-in page with validation

🚀 Quick Start

Prerequisites

• Node.js 18.x or higher
• npm or yarn

Installation

# Clone the repository
git clone https://github.com/amritach222/antd-admin.git
cd antd-admin

# Install dependencies
npm install
# or
yarn install

# Start the development server
npm run dev
# or
yarn dev

The application will be available at http://localhost:5173.

🧰 Project Structure

antd-admin/
├── public/             # Static assets
├── src/
│   ├── assets/         # Images, fonts, etc.
│   ├── components/     # Reusable components
│   │   ├── Footer/     
│   │   ├── SideBar/    
│   │   ├── Suspense/   # Loading components
│   │   └── TopBar/     
│   ├── context/        # React contexts
│   ├── hooks/          # Custom React hooks
│   ├── layouts/        # Layout components
│   ├── pages/          # Page components
│   ├── routes/         # Routing configuration
│   ├── styles/         # Global styles
│   ├── utils/          # Utility functions
│   ├── App.tsx         # Main App component
│   └── main.tsx        # Entry point
├── .eslintrc.js        # ESLint configuration
├── package.json        # Dependencies and scripts
├── tsconfig.json       # TypeScript configuration
└── vite.config.ts      # Vite configuration

📱 Screenshots

💻 Available Scripts

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

🔧 Configuration

Environment Variables

Create a .env file in the root directory:

VITE_API_URL=your_api_url
VITE_APP_VERSION=$npm_package_version

Theming

The project uses Ant Design's theme customization. You can adjust the primary color and other variables in src/App.tsx.

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

1. Fork the repository
2. Create your feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add some amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

🙏 Acknowledgments

• React
• TypeScript
• Ant Design
• Vite
• React Router
• React Icons
• TanStack Query