👜 Ticaz Bags & Luggage

Ticaz Bags & Luggage is a modern, responsive static e-commerce website where users can browse and shop for stylish bags and durable travel luggage. Built with React, Vite, and Tailwind CSS, the site is deployed to AWS using Pulumi for end-to-end infrastructure automation.

🌐 Live Demo

Check out the live website: https://dyk9aqch11ytc.cloudfront.net/

📁 Project Structure

/pulumi/www/frontend → React + Vite + Tailwind frontend
/pulumi → Infrastructure as Code using Pulumi (AWS setup)

🚀 Features

• 🧭 Clean and intuitive navigation
• 📱 Mobile-first responsive design
• ✨ Smooth scroll animations with AOS
• 🔔 Toast notifications with react-hot-toast
• 📦 Lazy image loading for performance
• 🛍️ Ready-to-integrate e-commerce layout

🧑‍💻 Tech Stack

Frontend

• React
• Vite
• Tailwind CSS
• React Router DOM
• Arco Design – UI library
• AOS (Animate on Scroll)
• Styled Components

Infrastructure & Deployment

• Pulumi (TypeScript)
• AWS S3 – Static site hosting
• AWS CloudFront – CDN for performance
• AWS IAM – Access control

Getting Started

1. Clone the Repository

git clone https://github.com/iAmSherifCodes/TicazOnAWSPulumi.git
cd TicazOnAWSPulumi

2. Install Dependencies

cd www/frontend
npm install

3. Start the Development Server

npm run dev

⚙️ Deploying with Pulumi

Prerequisites

• Node.js
• Pulumi CLI
• AWS CLI (configured with credentials)

Initial Setup

cd pulumi
pulumi login
pulumi stack init dev
pulumi config set aws:region us-east-1

Deploy to AWS

# Build the frontend
cd ../frontend
npm run build

# Deploy with Pulumi
cd ../pulumi
pulumi up

Updating the Deployment

When changes are made:

cd frontend
npm run build

cd ../pulumi
pulumi up

📸 Screenshots

Clean up

To cleanly destroy the stack and all of its infrastructure on Pulumi

pulumi destroy

🙌 Credits

Built with ❤️ for the Pulumi Deploy and Document Challenge