✨ Ctrl Create Labs

Creative Engineer Portfolio — Ella L'Esperance

---

🚀 About

A modern, interactive portfolio featuring a Raycast-style command palette that auto-fetches articles from Substack. Built with React, TypeScript, and Framer Motion.

✨ Features

• Command Palette — Search and browse projects with keyboard navigation (⌘K)
• Auto-Fetch — Automatically pulls latest articles from Substack RSS
• Dark/Light Mode — Seamless theme switching
• Responsive — Optimized for all screen sizes
• SEO Optimized — Structured data, sitemap, and meta tags

---

🛠️ Tech Stack

Category	Technologies
Frontend	React 19, TypeScript, Vite
Styling	Tailwind CSS, Framer Motion
Animation	GSAP, Framer Motion
Icons	Lucide React

---

📦 Quick Start

# Clone the repo
git clone https://github.com/codebyellalesperance/ctrl-create-labs-portfolio.git
cd ctrl-create-labs-portfolio

# Install dependencies
npm install

# Start dev server
npm run dev

Open http://localhost:5173 to view it in the browser.

---

📁 Project Structure

├── components/
│   ├── CommandPalette.tsx   # Raycast-style project browser
│   ├── Hero.tsx             # Hero section with animations
│   ├── Header.tsx           # Navigation & theme toggle
│   ├── Footer.tsx           # Contact section
│   └── MenuOverlay.tsx      # Full-screen menu
├── public/
│   ├── sitemap.xml          # SEO sitemap
│   └── robots.txt           # Crawler instructions
├── index.html               # Entry point with SEO meta tags
└── App.tsx                  # Root component

---

🔧 Commands

Command	Description
npm run dev	Start development server
npm run build	Build for production
npm run preview	Preview production build

---

📝 License

MIT © Ella L'Esperance

---

Built with ☕ and curiosity