Bullshit Store

A modern, satirical e-commerce website built with React, TypeScript, and Tailwind CSS.

Tech Stack

• React 18 - Modern React with hooks
• TypeScript - Type-safe development
• Vite - Fast build tool and dev server
• Tailwind CSS - Utility-first CSS framework
• Lucide React - Beautiful icon library

Getting Started

Install Dependencies

npm install

Development

npm run dev

The app will be available at http://localhost:5173

Build

npm run build

Preview Production Build

npm run preview

Deployment to Cloudflare Pages

Option 1: Deploy via Git (Recommended)

1. Push your code to GitHub/GitLab/Bitbucket

   git add .
   git commit -m "Initial commit"
   git push origin main

2. Connect to Cloudflare Pages

   • Go to Cloudflare Dashboard
   • Navigate to Pages → Create a project
   • Connect your Git repository
   • Configure build settings:
     • Build command: npm run build
     • Build output directory: dist
     • Root directory: / (or leave empty)
     • Node version: 18 or 20

3. Deploy

   • Cloudflare will automatically build and deploy on every push to your main branch
   • You'll get a preview URL for each deployment

Option 2: Deploy via Wrangler CLI

1. Install Wrangler CLI

   npm install -g wrangler

2. Login to Cloudflare

   wrangler login

3. Build and Deploy

   npm run build
   wrangler pages deploy dist

Build Configuration

• Build command: npm run build
• Output directory: dist
• Node version: 18 or 20 (specified in Cloudflare Pages settings)

The _redirects file in the public folder ensures proper SPA routing on Cloudflare Pages.

Features

• 🛒 Shopping cart functionality
• 📱 Responsive design
• 🎨 Modern, beautiful UI
• ⚡ Fast and performant
• 🔒 Type-safe with TypeScript

Project Structure

bullshit/
├── src/
│   ├── components/     # React components
│   ├── types.ts        # TypeScript type definitions
│   ├── App.tsx         # Main app component
│   ├── main.tsx        # Entry point
│   └── index.css       # Global styles
├── index.html          # HTML template
├── package.json        # Dependencies
├── tsconfig.json       # TypeScript config
├── vite.config.ts      # Vite config
└── tailwind.config.js  # Tailwind config