Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/xeven777/reactvite-starter
Vite + react starter template with tailwindcss, react router, eslint , daisyUI and react icons
https://github.com/xeven777/reactvite-starter
daisyui icons react- react-router reatctjs router starter-kit starter-template template-project vite vitejs
Last synced: 8 days ago
JSON representation
Vite + react starter template with tailwindcss, react router, eslint , daisyUI and react icons
- Host: GitHub
- URL: https://github.com/xeven777/reactvite-starter
- Owner: Xeven777
- Created: 2024-02-06T05:42:52.000Z (9 months ago)
- Default Branch: main
- Last Pushed: 2024-02-22T15:51:03.000Z (9 months ago)
- Last Synced: 2024-02-22T16:53:12.578Z (9 months ago)
- Topics: daisyui, icons, react-, react-router, reatctjs, router, starter-kit, starter-template, template-project, vite, vitejs
- Language: JavaScript
- Homepage: https://startling-florentine-772a7a.netlify.app
- Size: 138 KB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
![Vite](https://img.shields.io/badge/-Vite-646CFF?logo=vite&logoColor=white&style=for-the-badge)
![React](https://img.shields.io/badge/-React-61DAFB?logo=react&logoColor=white&style=for-the-badge)
![React Router](https://img.shields.io/badge/React_Router-CA4245?style=for-the-badge&logo=react-router&logoColor=white)
![DaisyUI](https://img.shields.io/badge/daisyui-%2324C8DB.svg?style=for-the-badge)
![ESLint](https://img.shields.io/badge/ESLint-4B3263?style=for-the-badge&logo=eslint&logoColor=white)
![TailwindCSS](https://img.shields.io/badge/tailwindcss-%2338B2AC.svg?style=for-the-badge&logo=tailwind-css&logoColor=white)# Vroom+ : Starter Template for Building Web Apps with ❤️
Vroom+ is a minimal, yet powerful starter template for building web applications using Vite, React, Tailwind CSS, React Router, and Daisy UI. It's optimized for speed, developer experience, and SEO.
![https://imgur.com/83qlqmN.png](https://imgur.com/83qlqmN.png)
## Features ✨
- **Vite ⚡**: Enjoy a lightning-fast development experience with Vite's out-of-the-box Hot Module Replacement (HMR).
- **React**: Build your UI with the latest version of React.
- **Tailwind CSS**: Style your application with utility-first CSS framework Tailwind CSS.
- **React Router**: Implement routing in your application with React Router v6.
- **Daisy UI**: Use Daisy UI components to speed up your UI development.
- **ESLint**: Keep your code clean and consistent with ESLint.
- **React Icons**: Decorate with react-icons
- **SEO Optimized**: Meta tags, OG tags, and descriptions are all set up for you.## Getting Started
Follow these steps to get the project up and running:
1. **Clone the repository:**
Run the following command to create a shallow clone of the repository:```sh
git clone --depth 1 https://github.com/xeven777/reactvite-starter.git
```This will create a new directory named `reactvite-starter` in your current directory.
2. **Remove the old `.git` directory and initialize a new one:**
Navigate to the new `reactvite-starter` directory and run the following commands:```sh
cd reactvite-starter
rm -rf .git
git init
```3. **Install the dependencies:**
Run the following command to install the project dependencies:```sh
npm install
```4. **Start the development server:**
After installing the dependencies, start the development server by running:
```sh
npm run dev
```Now, you should be able to see the application running at `localhost:5173` in your web browser! ✨
#### You can also download the code as Zip or use it as a template.
## Project Structure
- `src/`: This directory contains all the React components and CSS for the application.
- `App.jsx`: The main component that wraps the entire application.
- `index.css`: Global styles for the application.
- `main.jsx`: The entry point for the application.
- `home/`: This directory contains the Home component.
- `about/`: This directory contains the About component.
- `components/`: This directory contains reusable components like `Tag.jsx`.
- `public/`: This directory contains public assets that can be referenced in the HTML.
- `index.html`: The main HTML page that is served when someone visits your site.
- `package.json`: This file lists the packages your project depends on and specifies versions of a package that your project can use using semantic versioning rules.
- `vite.config.js`: This file contains configuration for Vite.
- `tailwind.config.js`: This file contains configuration for Tailwind CSS.
- `.eslintrc.cjs`: This file contains configuration for ESLint.
- `postcss.config.js`: This file contains configuration for PostCSS.### Contributing
Contributions are welcome! Please feel free to submit a Pull Request.