Personal Developer Portfolio: Midhun M

An interactive personal portfolio and engineering resume showcasing full-stack applications, mobile projects, and technical leadership.

---

Architectural Workflow

The portfolio utilizes modern semantic HTML5 and CSS3 custom properties deployed on Vercel Edge Network for sub-second global asset delivery.

flowchart TD
    subgraph ClientBrowser["Client Presentation Engine"]
        DOM["Semantic HTML5 DOM Shell"]
        CSSVars["CSS3 Design Tokens & Glassmorphism"]
        JSInteractions["Vanilla ES6+ Scroll & DOM Engine"]
        DOM --> CSSVars
        CSSVars --> JSInteractions
    end

    subgraph ShowcaseModules["Showcase Modules"]
        Projects["Featured Repositories (Agry-Key, Resort App, Security Analyzer)"]
        Skills["Core Competencies (C++, C, Python, Flutter, Java)"]
        Experience["Technical Leadership (IEDC ASET, KBA)"]
    end

    subgraph EdgeCDN["Deployment Pipeline"]
        VercelEdge["Vercel Edge CDN (Zero-Build Global Serving)"]
    end

    JSInteractions --> ShowcaseModules
    EdgeCDN --> ClientBrowser

Loading

---

Overview

This website serves as my primary developer hub, highlighting:

• Featured Projects: Agry-Key, Resort Booking App, WebApp Security Analyzer, and ESP32 Packet Sniffer.
• Leadership Experience: Tech Lead at IEDC ASET, General Secretary at College Union, and Student Lead at Kerala Blockchain Academy (KBA).
• Core Skillset: Flutter, Dart, Python, FastAPI, Supabase, C/C++, JavaScript, and Embedded Systems.

---

Tech Stack

• Markup & Styling: HTML5, Semantic Elements, Vanilla CSS3 (Custom Properties, Glassmorphism, Responsive Flex/Grid)
• Scripting & Interactivity: Vanilla JavaScript (ES6+), DOM Manipulation, Dynamic Animations
• Hosting & Deployment: Vercel Edge Network, sub-second global CDN distribution

---

Project Structure

portfolio/
├── assets/         # Project images, icons, and downloadable resume
├── index.html      # Semantic HTML structure & accessibility tags
├── style.css       # Responsive styling, color tokens & micro-animations
├── script.js       # Dynamic UI logic, smooth scrolling & interactions
└── LICENSE         # MIT Open-Source License

---

Local Development

Clone and preview locally without heavy build tools:

# Clone the repository
git clone https://github.com/Midhun-M-git/portfolio.git
cd portfolio

# Open directly in browser
open index.html

---

Contact and Connect

• Portfolio: portfolio-omega-eosin-56.vercel.app
• LinkedIn: linkedin.com/in/techwithmidhun
• Email: mmidhun781@gmail.com

---

License

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