How varunhunakunti2-crypto/protfillo works
This is a bilingual Vue portfolio: visitors navigate an animated, section-based showcase of the owner’s profile, services, skills and projects, with contact options and a separate project-detail route. The shared app shell hosts navigation and the floating chat assistant; the chat flow sends a visitor’s transcript to a server endpoint, where shared logic validates it and calls Groq. Other notable capabilities include localized content, scroll-driven presentation, and an interactive audio keyboard. Relationships for unsampled sections and the contact endpoint are limited to documented or indexed references; no unshown contact submission flow is inferred.
Main entry points: HomePage.vue Home composition · index.js Route selection · Navbar.vue Navigation and theme · App.vue App shell
Components 30
App and navigation
- App shell
src/App.vue - Route selection
src/router/index.js - Navigation and theme
src/components/Navbar.vue - English and Japanese
src/i18n/index.js
Portfolio content
- Home composition
src/pages/HomePage.vue - Project detail
src/pages/ProjectDetail.vue - Not found page
src/pages/NotFound.vue - Profile and impact
src/sections/About.vue - Services
src/sections/Services.vue - Skills
src/sections/Skills.vue - Projects
src/sections/Projects.vue - Contact section
src/sections/Contact.vue - Cinematic footer
src/components/ui/CinematicFooter.vue - Statement
src/sections/Statement.vue - Experience
src/sections/Experience.vue - Impact
src/sections/Impact.vue - Home introduction
src/sections/Home.vue
Visitor interactions
- Keyboard section
src/sections/Keyboard.vue - Vintage keyboard
src/components/ui/VintageKeyboard.vue - Keyboard logic
src/components/ui/vintage-keyboard-logic.js - Keyboard key
src/components/ui/VintageKeyboardKey.vue - Magnetic interaction
src/composables/useMagnetic.js - Particle effect
src/components/react/DotsEffect.jsx - Particle swarm wrappers
src/components/AtomSwarm.vue - Halo animation
src/components/HaloSwarm.vue
Chat assistant
- Chat widget
src/components/ChatBot.vue - Chat endpoint
api/chat.js - Chat validation and logic
server/chat.mjs - Groq API
Other components
- Visitor
Connections 29
- Visitor → App shell: opens site
README.md - App shell → Navigation and theme: renders
src/App.vue - App shell → Route selection: guards navigation
src/App.vue - Route selection → Home composition: routes to
src/router/index.js - Route selection → Project detail: routes to
src/router/index.js - Route selection → Not found page: routes to
src/router/index.js - Home composition → Home introduction: renders
src/pages/HomePage.vue - Home composition → Impact: renders
src/pages/HomePage.vue - Home composition → Profile and impact: renders
src/pages/HomePage.vue - Home composition → Services: renders
src/pages/HomePage.vue - Home composition → Skills: renders
src/pages/HomePage.vue - Home composition → Keyboard section: renders
src/pages/HomePage.vue - Home composition → Statement: renders
src/pages/HomePage.vue - Home composition → Projects: renders
src/pages/HomePage.vue - Home composition → Contact section: renders
src/pages/HomePage.vue - Home composition → Cinematic footer: renders
src/pages/HomePage.vue - Keyboard section → Vintage keyboard: renders
src/sections/Keyboard.vue - Vintage keyboard → Keyboard key: renders
src/components/ui/VintageKeyboard.vue - Vintage keyboard → Keyboard logic: uses logic
src/components/ui/VintageKeyboard.vue - Navigation and theme → Magnetic interaction: uses interaction
src/components/Navbar.vue - Visitor → Chat widget: asks questions
README.md - Chat widget → Chat endpoint: posts transcript
README.md - Chat endpoint → Chat validation and logic: delegates to
api/chat.js - Chat validation and logic → Groq API: requests response
server/chat.mjs - Particle swarm wrappers → Particle effect: renders effect
src/components/AtomSwarm.vue - Halo animation → Particle effect: renders effect
src/components/HaloSwarm.vue - Cinematic footer → Particle swarm wrappers: renders
src/components/ui/CinematicFooter.vue - Visitor → Navigation and theme: switches language
README.md - Navigation and theme → English and Japanese: selects locale