https://github.com/rohancyberops/shadcn
https://github.com/rohancyberops/shadcn
Last synced: 12 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/rohancyberops/shadcn
- Owner: RohanCyberOps
- License: mit
- Created: 2025-01-28T12:14:21.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-01-28T12:22:47.000Z (over 1 year ago)
- Last Synced: 2025-03-10T19:51:30.656Z (over 1 year ago)
- Language: TypeScript
- Size: 137 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# Modern React + Vite Starter
A production-ready React starter template powered by Vite, featuring a modern tech stack and comprehensive UI components from shadcn/ui.
## Features
- ⚡️ **Lightning Fast**: Built on Vite for rapid development and optimized builds
- 🎨 **Beautiful UI**: Integrated shadcn/ui components with Tailwind CSS
- 📦 **Type Safe**: Full TypeScript support with strict mode enabled
- 🔧 **Developer Experience**: ESLint configuration for code quality
- 🎯 **Production Ready**: Optimized build setup with best practices
- 🎭 **Dark Mode**: Built-in dark mode support
- 📱 **Responsive**: Mobile-first design approach
## Quick Start
```bash
# Install dependencies
npm install
# Start development server
npm run dev
# Build for production
npm run build
# Preview production build
npm run preview
```
## Tech Stack
- **Framework**: React 18 with TypeScript
- **Build Tool**: Vite
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **Icons**: Lucide React
- **Form Handling**: React Hook Form
- **Date Handling**: date-fns
- **Charts**: Recharts
- **Animations**: Tailwind CSS Animate
## Project Structure
```
src/
├── components/ # UI components
│ └── ui/ # shadcn/ui components
├── hooks/ # Custom React hooks
├── lib/ # Utility functions
└── App.tsx # Main application component
```
## Development
### Code Style
- Follow TypeScript best practices
- Use functional components with hooks
- Maintain consistent file and folder naming
- Write clean, self-documenting code
### Best Practices
- Keep components small and focused
- Use TypeScript types for props and state
- Implement proper error handling
- Follow React performance optimization guidelines
## Building for Production
```bash
npm run build
```
This will create an optimized production build in the `dist` directory.
## License
MIT
## Contributing
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