Vite Shadcn Boilerplate

Overview

Welcome to the Vite Shadcn Boilerplate! This repository serves as a comprehensive starter template for rapidly setting up a Vite project integrated with Shadcn, React, Tailwind CSS, and TypeScript. With this boilerplate, you can jumpstart your development process, saving valuable time on configuration and setup.

Features

• Vite: Lightning-fast development server and build tool for modern web development.
• Shadcn: A powerful state management library for React, ensuring efficient and predictable state handling.
• React: A popular JavaScript library for building user interfaces.
• Tailwind CSS: A utility-first CSS framework that provides a set of pre-designed styles for rapid UI development.
• TypeScript: A superset of JavaScript that adds static types, enhancing code quality and developer productivity.

Getting Started

1. Fork the Repository: Start by forking this repository to your GitHub account.

2. Clone the Repository: Clone your forked repository locally using the following command:

   git clone https://github.com/your-username/vite-shadcn-boilerplate.git

3. Install Dependencies: Navigate to the project directory and install the required dependencies.

   cd vite-shadcn-boilerplate
   npm install

4. Run the Development Server: Launch the development server to start building your application.

   npm run dev

5. Build for Production: When you're ready to deploy your application, create a production build.

   npm run build

Included Libraries

• @radix-ui/react-slot: Component primitives for building unstyled, fully accessible UIs.
• class-variance-authority: A utility for managing conditional CSS class variations.
• clsx: A tiny utility for constructing className strings conditionally.
• lucide-react: A library of simply designed, easily recognizable SVG icons for React.
• react: The JavaScript library for building user interfaces.
• react-dom: Entry point for React applications to interact with the DOM.
• tailwind-merge: Utility functions for merging Tailwind CSS classes.
• tailwindcss-animate: A plugin for animating Tailwind CSS classes.

Development Tools

• @typescript-eslint/eslint-plugin: ESLint plugin for TypeScript.
• @typescript-eslint/parser: TypeScript parser for ESLint.
• @vitejs/plugin-react: Vite plugin for React.
• autoprefixer: A PostCSS plugin to parse CSS and add vendor prefixes.
• eslint: A pluggable linting utility for JavaScript and JSX.
• eslint-plugin-react-hooks: ESLint plugin for React hooks.
• eslint-plugin-react-refresh: ESLint plugin for React Refresh.
• postcss: A tool for transforming styles with JavaScript plugins.
• tailwindcss: A utility-first CSS framework for rapidly building custom designs.
• typescript: A superset of JavaScript that adds static types.

License

This project is licensed under the MIT License - see the LICENSE file for details.

Contribution

Contributions are welcome! Feel free to open issues or submit pull requests to enhance this boilerplate and make it even more powerful.

Happy coding! 🚀