How newmi-git/portfolio-vue works
Portfolio-Vue is a Vue single-page portfolio. A visitor enters through the application bootstrap, which installs routing and state support, mounts the shell, and lets the router dispatch either the home profile or gallery view. The gallery currently uses local reactive image state, supports image selection, and opens a lightbox with Escape/click dismissal. The sampled code shows no API or persistent storage; gallery population is explicitly future-facing. Styling is loaded globally, with additional view-scoped presentation rules.
Components 11
Application Runtime
- Application Bootstrap
Frontend/src/main.js - App Shell
Frontend/src/App.vue - Pinia Plugin
- Global Theme
Frontend/src/assets/theme.css
Navigation Layer
- Vue Router
Frontend/src/router/index.js
Portfolio Views
- Home Profile
Frontend/src/views/Home.vue - Gallery View
Frontend/src/views/Gallery.vue
Interaction State
- Menu State
Frontend/src/views/Home.vue - Gallery State
Frontend/src/views/Gallery.vue - Image Lightbox
Frontend/src/views/Gallery.vue
Other components
- Portfolio Visitor
Connections 13
- Portfolio Visitor → Vue Router: navigates
- Application Bootstrap → App Shell: creates
- Application Bootstrap → Pinia Plugin: installs
- Application Bootstrap → Vue Router: installs
- Application Bootstrap → Global Theme: loads styles
- Application Bootstrap → App Shell: mounts
- App Shell → Vue Router: renders routes
- Vue Router → Home Profile: dispatches
- Vue Router → Gallery View: dispatches
- Home Profile → Menu State: toggles menu
- Gallery View → Gallery State: updates images
- Gallery View → Image Lightbox: opens overlay
- Portfolio Visitor → Gallery View: selects image