📚 Tommy Werner - Developer Portfolio

Welcome to my Developer Portfolio, a modern and responsive website showcasing my projects, skills, and experience.

This project is built using React + Vite with TypeScript and designed using Geist Fonts and Catppuccin themes (Frappe for Dark Mode, Latte for Light Mode). It features smooth dark/light mode toggling, clear section blocking, and a Credits section to highlight the open-source tools that made this possible.

---

🌟 Live Demo

Check out the live version of the portfolio here:
👉 https://wtwerner.dev

---

🛠️ Features

• 🎨 Modern UI Design: Clean and sleek interface with Catppuccin themes (Frappe & Latte).
• 🌗 Dark/Light Mode: Auto-detects browser preference with manual toggle switch.
• 📱 Responsive Design: Fully optimized for mobile, tablet, and desktop devices.
• 📚 Project Showcase: Grid-based layout to display featured projects.
• 📬 Contact Section: Easy access to reach out via email.
• 📝 Credits Section: Acknowledgment of open-source tools and libraries.

---

💻 Technologies Used

Frontend:

• ⚛️ React – Component-based UI library
• ⚡️ Vite – Lightning-fast build tool
• 🔄 TypeScript – Static type-checking for better tooling
• 🎨 Catppuccin Themes – Frappe (Dark) & Latte (Light)
• ✍️ Geist Fonts – Sleek and modern font style

Tooling:

• 🛡️ ESLint – Code linting and error prevention
• ✨ Prettier – Code formatting
• 🔗 React Icons – Beautiful SVG icons

Deployment:

• ▲ Vercel – Seamless deployment and hosting
• ☁️ Cloudflare – Custom domain and security

---

🚀 Getting Started

Follow these steps to run the portfolio locally on your machine:

1. Clone the Repository

git clone https://github.com/wtwerner/dev-portfolio.git
cd dev-portfolio

2. Install Dependencies

npm install

3. Start the Development Server

npm run dev

4. Open in Browser

Navigate to http://localhost:5173.

---

📦 Build for Production

npm run build

The optimized static files will be generated in the dist folder.

---

📬 Contact Me

If you'd like to reach out, feel free to connect via:

• 📧 Email: tommy@wtwerner.dev
• 💼 LinkedIn: linkedin.com/in/wtwerner
• 🐙 GitHub: github.com/wtwerner

---

📝 Credits

This project was made possible thanks to the following open-source tools:

• React – JavaScript library for building user interfaces.
• React Icons – SVG icons for React applications.
• Vite – Next-generation frontend tooling for fast builds.
• TypeScript – Typed JavaScript for better tooling.

---

🛡️ License

This project is licensed under the MIT License.
See the LICENSE file for details.

---

Happy coding! 🚀✨