heroweb/react-shadcn-starter

React Shadcn Starter

React + Vite + TypeScript template for building apps with shadcn/ui.

Getting Started

git clone https://github.com/hayyi2/react-shadcn-starter.git new-project
cd new-project
npm install
npm run dev

Getting Done

• Single page app with navigation and responsif layout

• Customable configuration /config

• Simple starting page/feature /pages

• Github action deploy github pages

Deploy gh-pages

• change basenameProd in /vite.config.ts
• create deploy key GITHUB_TOKEN in github /settings/keys
• commit and push changes code
• setup gihub pages to branch gh-pages
• run action Build & Deploy

Auto Deploy

• change file .github/workflows/build-and-deploy.yml
• Comment on workflow_dispatch
• Uncomment on push

# on:
#   workflow_dispatch:
on:
  push:
    branches: ["main"]

Features

• React + Vite + TypeScript
• Tailwind CSS
• react-router-dom
• shadcn-ui
• radix-ui/icons

Project Structure

react-shadcn-starter/
├── public/            # Public assets
├── src/               # Application source code
│   ├── components/    # React components
│   │   └── ui/        # shadc/ui components
│   │   └── layouts/   # layouts components
│   ├── context/       # contexts components
│   ├── config/        # Config data
│   ├── hook/          # Custom hooks
│   ├── lib/           # Utility functions
│   ├── pages/         # pages/features components
│   ├── App.tsx        # Application entry point
│   ├── index.tsx      # Main rendering file
│   └── Router.tsx     # Routes component
├── index.html         # HTML entry point
├── postcss.config.js  # PostCSS configuration
├── tailwind.config.js # Tailwind CSS configuration
├── tsconfig.json      # TypeScript configuration
└── vite.config.ts     # Vite configuration

License

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