mirror of
https://github.com/walkxcode/dashboard-icons.git
synced 2025-11-18 17:47:30 +01:00
b8e77a46db
Add ExperimentalWarning component to community page to inform users that the submission system is in experimentation phase and submissions won't be reviewed. Includes feedback button for PostHog survey targeting.
Dashboard Icons Web App
A web application to browse, search, and download icons from the Dashboard Icons collection.
Features
- Browse through a curated collection of beautiful dashboard icons
- Search icons by name, aliases, or categories
- View icon details including author, formats, and variants
- Download icons in different formats (SVG, PNG, WebP)
- Copy icon URLs directly to your clipboard
- Responsive design that works on mobile, tablet, and desktop
- Dark mode support
Tech Stack
- Next.js 15 - React framework with App Router
- TypeScript v5 - Type-safe JavaScript
- Tailwind CSS - Utility-first CSS framework
- Shadcn UI - Reusable components built with Radix UI and Tailwind
Project Structure
src/
├── app/ # Next.js App Router
│ ├── api/ # API routes
│ │ └── icons/ # Icons browsing and detail pages
│ │ ├── [icon]/ # Dynamic icon detail page
│ │ │ ├── components/ # Icon-specific components
│ │ │ ├── error.tsx # Error handling
│ │ │ ├── loading.tsx # Loading state
│ │ │ └── page.tsx # Icon detail page
│ │ ├── components/ # Icons page components
│ │ ├── loading.tsx # Loading state
│ │ └── page.tsx # Icons browse page
│ ├── globals.css # Global styles
│ ├── layout.tsx # Root layout
│ ├── page.tsx # Homepage
│ └── theme-provider.tsx # Theme provider component
├── components/ # Shared components
│ ├── ui/ # UI components (from shadcn/ui)
│ ├── header.tsx # App header
│ └── theme-switcher.tsx # Theme switcher
├── lib/ # Utility functions
│ ├── api.ts # API utilities
│ └── utils.ts # General utilities
└── types/ # TypeScript type definitions
├── icons.ts # Icon-related types
└── index.ts # Type exports
Development
Prerequisites
- Node.js 18+
- pnpm
Installation
- Clone the repository
- Install dependencies:
pnpm install - Create a
.envfile with the following variables:GITHUB_TOKEN=your_github_token - Start the development server:
pnpm dev
Build
pnpm build
Deployment
The application is optimized for deployment on Vercel.
Contributing
Contributions are welcome! Please feel free to submit a Pull Request.