An open API service indexing awesome lists of open source software.

https://github.com/schrojf/parcel-preact-ts-tailwindcss-template

⚡ Minimal Parcel + Preact + TypeScript + Tailwind CSS Starter Template A modern, zero-config web development starter kit with blazing-fast builds and type safety. Perfect for building lightweight, performant web applications with the latest tools and best practices.
https://github.com/schrojf/parcel-preact-ts-tailwindcss-template

eslint modern-tooling parcel postcss preact starter-template tailwindcss typescript web-development zero-config

Last synced: 2 months ago
JSON representation

⚡ Minimal Parcel + Preact + TypeScript + Tailwind CSS Starter Template A modern, zero-config web development starter kit with blazing-fast builds and type safety. Perfect for building lightweight, performant web applications with the latest tools and best practices.

Awesome Lists containing this project

README

          

# 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:

```bash
# 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](https://choosealicense.com/licenses/mit/).