https://github.com/hellbus1/ts-react-tailwind-starter

A React.js template with Vite that packed with all the essential libraries
https://github.com/hellbus1/ts-react-tailwind-starter

boilerplate daisy daisyui eslint prettier react tailwind tailwindcss typescript

Last synced: 26 days ago
JSON representation

A React.js template with Vite that packed with all the essential libraries

• Host: GitHub
• URL: https://github.com/hellbus1/ts-react-tailwind-starter
• Owner: HellBus1
• License: apache-2.0
• Created: 2024-07-31T15:29:31.000Z (3 months ago)
• Default Branch: master
• Last Pushed: 2024-08-22T16:52:37.000Z (3 months ago)
• Last Synced: 2024-10-13T06:40:15.892Z (26 days ago)
• Topics: boilerplate, daisy, daisyui, eslint, prettier, react, tailwind, tailwindcss, typescript
• Language: TypeScript
• Homepage:
• Size: 222 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Lightweight React JS + Vite Starter Kit Template



  

  



## Description

A React.js template with Vite ⚡ is super simple and ready to go. It comes packed with all the essential libraries you need for modern frontend development.

### Why Vite?

Here is several things that made vite is better bundler out there :

1. **Instant Server Start**: No more waiting around—start your server instantly.

2. **Lightning Fast HMR**: Hot Module Replacement that's truly fast.

3. **Create React App Best Alternative**: Skip the unecessary clutter of Create React App 🙂.

4. **And More**: There are plenty of other reasons to love Vite!

If you’re curious to explore Vite further, check out the [link](https://vitejs.dev/)

## Features

Here is the building blocks of this repository

- 📟 **Navigation**: Configured with [React Router DOM](https://reactrouter.com/en/main) for dynamic routing.

- 🔋 **CSS Frameworks**: [Tailwind CSS](https://tailwindcss.com/) and [Daisy UI](https://daisyui.com/) for rapid UI development with minimal custom styling.

- 📊 **Code Formatting**: [Prettier](https://prettier.io/) is integrated to ensure consistent code style across the project.

- 🗂️ **Linting**: [ESLint](https://eslint.org/) is set up to enforce coding standards and best practices.

- 📮 **Pre-commit Hooks**: [Husky](https://github.com/lint-staged/lint-staged) is utilized to run automated checks before code is committed.

- 🛠️ **Lint-Staged**: Paired with Husky, [lint-staged](https://github.com/lint-staged/lint-staged) handles formatting and linting for all staged changes.

## Getting Started

1. **Clone the repository** :

```shell

git clone https://github.com/HellBus1/ts-react-tailwind-starter.git

cd ts-react-tailwind-starter

```

2. **Install dependencies** :

```shell

npm install

```

3. **Run the development server** :

```shell

npm run dev

```

4. **Build for production** :

```shell

npm run build

```

## Getting Started

Contributions are welcome! Please open an issue or submit a pull request.

## Supports Me

Want to see more free, high-quality code and articles? Buy me a coffee and make it happen! 

[!["Buy Me A Coffee"](https://www.buymeacoffee.com/assets/img/custom_images/orange_img.png)](https://www.buymeacoffee.com/syubban)