Modern administrative dashboard for product management and authentication. Built with React 19, TypeScript, Tailwind CSS, and Vite.
Artisan Dashboard is a complete web administration application that provides:
- 🔐 Secure authentication system
- 📦 Product management with intuitive interface
- 🎨 Responsive design based on Tailwind CSS
- ⚡ High performance with Vite and React 19
- 🔄 State management with Zustand
- 📡 Data management with TanStack Query
- Secure login
- Session management
- Backend API integration
- Product listing
- Create, edit, and delete products
- Search and filtering
- Pagination
- Reusable components
- Consistent theme with Radix UI
- Responsive design
- Radix UI Icons iconography
| Category | Technology |
|---|---|
| Framework | React 19 |
| Language | TypeScript 5.9 |
| Build Tool | Vite 7 |
| Styles | Tailwind CSS + Radix Themes |
| State Management | Zustand |
| Data Fetching | Axios + TanStack Query |
| Routing | React Router 7 |
| UI Components | Radix UI |
| Linting | ESLint 9 |
- Node.js 18+
- npm or yarn
# Clone the repository
git clone <repository-url>
cd artisan-dashboard
# Install dependencies
npm install
# Configure environment variables (if needed)
# cp .env.example .envnpm run devThe application will run at http://localhost:5173
npm run buildnpm run previewnpm run lintsrc/
├── assets/ # Images and static resources
├── core/ # Core logic (API, services)
├── features/ # Features by module
│ ├── auth/ # Authentication
│ ├── products/ # Product management
│ └── shared/ # Shared components
├── helpers/ # Utility functions
├── lib/ # Libraries and configurations
├── main.tsx # Entry point
└── ArtisanApp.tsx # Root component
Authentication is managed through:
- Zustand for global state
- LocalStorage for persistence
- Backend API for validation
Uses Axios + TanStack Query for:
- Data fetching
- Automatic caching
- Error handling
- State synchronization
- Tailwind CSS for utilities
- Radix Themes for base components
- CSS Modules for specific styles
- Components with PascalCase
- Functions/variables with camelCase
- Types/Interfaces with PascalCase (optionally prefixed with
I) - Custom hooks with
useprefix
Main branch: develop
To contribute:
- Create a feature branch:
git checkout -b feature/new-feature - Make commits:
git commit -m "feat: description" - Push:
git push origin feature/new-feature - Create a Pull Request
Contributions are welcome. Please:
- Fork the project
- Create a feature branch
- Commit your changes
- Push to the branch
- Open a Pull Request
This project is licensed under the MIT License.
Artisan Development Team
For questions or support, contact the development team.
Last updated: November 2025