parcel-preact-ts-tailwindcss-template

A minimal, fast, and modern web development starter kit using Parcel, Preact, TypeScript, and Tailwind CSS.

🚀 Quick Start

Clone this repo and install dependencies:

# Clone this repo
git clone https://github.com/schrojf/parcel-preact-ts-tailwindcss-template.git
cd parcel-preact-ts-tailwindcss-template

# Install dependencies
npm install

# Start development server
npm start

# Build for production
npm run build

Open http://localhost:1234 in your browser to see the app.

🛠 Available Scripts

• npm start – Start development server with hot reload
• npm run build – Build optimized production bundle
• npm run lint – Run ESLint to check code quality
• npm run lint:fix – Fix ESLint issues automatically
• npm run check – Run TypeScript type checking

🎯 Features

• ⚡ Parcel - Zero-config bundler with fast builds
• ⚛️ Preact - Fast 3kB alternative to React
• 🧠 TypeScript - Type-safe JavaScript development
• 🎨 Tailwind CSS - Utility-first CSS framework
• 📝 ESLint - Code linting and formatting
• 🔧 Modern Tooling - Latest development tools and practices

📁 Project Structure

my-parcel-app/
├── src/
│   ├── app.tsx          # Main application component
│   ├── main.tsx         # Application entry point
│   ├── index.html       # HTML template
│   ├── style.css        # Global styles
│   └── assets/          # Static assets
├── .postcssrc           # PostCSS configuration
├── tailwind.config.js   # Tailwind CSS configuration
├── tsconfig.json        # TypeScript configuration
└── eslint.config.js     # ESLint configuration

🎨 Tailwind CSS Plugins

This starter includes useful Tailwind CSS plugins:

• @tailwindcss/typography - Beautiful typography styles
• @tailwindcss/forms - Better form element styling
• @tailwindcss/aspect-ratio - Aspect ratio utilities

🔧 Development

This is my personal minimal starter kit for building modern web applications. It's designed to be:

• Minimal - Only essential dependencies
• Fast - Optimized for development speed
• Modern - Latest tools and best practices
• Type-safe - Full TypeScript support
• Maintainable - Clean, well-structured code

📝 License

This project is licensed under the MIT License.