File size: 2,782 Bytes
909a85b dfe5dd5 909a85b 4ac90cc 909a85b 4ac90cc 909a85b |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 |
# React + Vite + TypeScript Template (react-vite-ui)
[](https://github.com/Dan5py/react-vite-ui/blob/main/LICENSE)
A React + Vite template powered by shadcn/ui.
## π Features
- **React** - A JavaScript library for building user interfaces.
- **Vite** - A fast, opinionated frontend build tool.
- **TypeScript** - A typed superset of JavaScript that compiles to plain JavaScript.
- **Tailwind CSS** - A utility-first CSS framework.
- **Tailwind Prettier Plugin** - A Prettier plugin for formatting Tailwind CSS classes.
- **ESLint** - A pluggable linting utility for JavaScript and TypeScript.
- **PostCSS** - A tool for transforming CSS with JavaScript.
- **Autoprefixer** - A PostCSS plugin to parse CSS and add vendor prefixes.
- **shadcn/ui** - Beautifully designed components that you can copy and paste into your apps.
## βοΈ Prerequisites
Make sure you have the following installed on your development machine:
- Node.js (version 16 or above)
- pnpm (package manager)
## π Getting Started
Follow these steps to get started with the react-vite-ui template:
1. Clone the repository:
```bash
git clone https://github.com/dan5py/react-vite-ui.git
```
2. Navigate to the project directory:
```bash
cd react-vite-ui
```
3. Install the dependencies:
```bash
pnpm install
```
4. Start the development server:
```bash
pnpm dev
```
## π Available Scripts
- pnpm dev - Starts the development server.
- pnpm build - Builds the production-ready code.
- pnpm lint - Runs ESLint to analyze and lint the code.
- pnpm preview - Starts the Vite development server in preview mode.
## π Project Structure
The project structure follows a standard React application layout:
```python
react-vite-ui/
βββ node_modules/ # Project dependencies
βββ public/ # Public assets
βββ src/ # Application source code
β βββ components/ # React components
β β βββ ui/ # shadc/ui components
β βββ styles/ # CSS stylesheets
β βββ lib/ # Utility functions
β βββ App.tsx # Application entry point
β βββ index.tsx # Main rendering file
βββ eslint.config.js # ESLint configuration
βββ index.html # HTML entry point
βββ postcss.config.js # PostCSS configuration
βββ tailwind.config.ts # Tailwind CSS configuration
βββ tsconfig.json # TypeScript configuration
βββ vite.config.ts # Vite configuration
```
## π License
This project is licensed under the MIT License. See the [LICENSE](https://choosealicense.com/licenses/mit/) file for details.
|