Skip to content

Ramzy KEMMOUN, Full-Stack Developer passionate about building modern web applications with TypeScript, React, Svelte, Node.js, Python and AI. Check out my projects and get in touch

Notifications You must be signed in to change notification settings

ramzykemmoun/portfolio

Repository files navigation

🖥️ Ramzy KEMMOUN - Portfolio

SvelteKit TypeScript TailwindCSS Monaco Editor

A unique VS Code-inspired portfolio that showcases my work as an interactive code editor experience.

Live DemoGitHub


✨ Features

  • VS Code UI - Authentic IDE experience with sidebar, tabs, terminal, and file explorer
  • Monaco Editor - Real syntax highlighting with multiple themes
  • AI Chat Assistant - Interactive AI panel powered by Hugging Face
  • Multiple Themes - Cursor, One Dark Pro, Dracula, Tokyo Night, and more
  • Fully Responsive - Optimized for desktop, tablet, and mobile
  • 3D Elements - Three.js powered visuals with Threlte

🛠️ Tech Stack

Category Technologies
Framework SvelteKit 2, Svelte 5
Styling TailwindCSS 4, Skeleton UI
Editor Monaco Editor
3D Graphics Three.js, Threlte
AI Hugging Face Inference
Testing Vitest, Playwright
Docs Storybook

🚀 Quick Start

# Clone the repository
git clone https://github.com/ramzykemmoun/portfolio.git
cd portfolio

# Install dependencies
pnpm install

# Start development server
pnpm dev

# Build for production
pnpm build

📁 Project Structure

src/
├── lib/
│   ├── components/
│   │   ├── Agent/        # AI chat panel
│   │   ├── Editor/       # Code editor & sections
│   │   ├── Navbar/       # Top navigation bar
│   │   ├── Sidebar/      # File explorer & panels
│   │   └── Terminal/     # Terminal component
│   ├── data/
│   │   └── sections/     # Portfolio content data
│   └── stores/           # Svelte stores
├── routes/
│   └── themes/           # Editor themes
└── stories/              # Storybook stories

🎨 Available Themes

  • Cursor (Default)
  • One Dark Pro
  • Dracula
  • GitHub Theme
  • Tokyo Night
  • Catppuccin
  • Monokai
  • Nord
  • Night Owl
  • Solarized Dark
  • Cobalt2

📱 Responsive Breakpoints

Screen Behavior
Desktop (>1024px) Full layout with sidebar, editor, and AI panel
Tablet (768-1024px) Collapsed agent panel
Mobile (<768px) Bottom navigation, full-width editor

📄 License

MIT © Ramzy KEMMOUN


Built by Ramzy KEMMOUN and FREE PALESTINE!!!

About

Ramzy KEMMOUN, Full-Stack Developer passionate about building modern web applications with TypeScript, React, Svelte, Node.js, Python and AI. Check out my projects and get in touch

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published