How inouzen/86-themed-portfolio works
This is a Next.js personal portfolio. Visitors enter through the shared site shell, navigate the home, about, projects, education, and contact pages, and can browse project and timeline content or initiate contact. A separate chat widget sends messages to the Lena API route. The graph also captures shared visual effects and settings. Edges reflect README statements and source-index references; unsampled implementations and integrations are not inferred beyond that evidence.
Main entry points: layout.js Site shell · content.js Portfolio data · Jp.jsx Japanese accents · FxProvider.jsx Effects state
Components 23
Portfolio pages
- Home page
app/page.js - Hero
components/Hero.jsx - About page
app/about/page.js - Projects page
app/projects/page.js - Education page
app/education/page.js - Contact page
app/contact/page.js
Portfolio content
- Portfolio data
lib/content.js
Interactive features
- Project carousel
components/Sorties.jsx - Education timeline
components/Timeline.jsx - Contact form
components/ContactForm.jsx - Effects settings
components/Settings.jsx - Lena chat
components/LenaChat.jsx - Lena API
app/api/lena/route.js
Shared experience
- Site shell
app/layout.js - Navigation and theme
components/Header.jsx - Ticker
components/Ticker.jsx - Cursor
components/Cursor.jsx - Effects state
components/FxProvider.jsx - Particle effects
components/Particles.jsx - Reginleif effect
components/Reginleif.jsx - Japanese accents
components/Jp.jsx
Other components
- Visitor
- Visitor email app
Connections 39
- Visitor → Home page: opens site
README.md - Visitor → About page: opens page
README.md - Visitor → Projects page: opens page
README.md - Visitor → Education page: opens page
README.md - Visitor → Contact page: opens page
README.md - Site shell → Navigation and theme: renders
app/layout.js - Site shell → Ticker: renders
app/layout.js - Site shell → Cursor: renders
app/layout.js - Site shell → Effects state: provides state
app/layout.js - Site shell → Particle effects: renders
app/layout.js - Site shell → Reginleif effect: renders
app/layout.js - Site shell → Lena chat: renders
app/layout.js - Site shell → Effects settings: renders
app/layout.js - Site shell → Portfolio data: reads profile
app/layout.js - Home page → Hero: renders
app/page.js - Hero → Portfolio data: reads profile
components/Hero.jsx - About page → Portfolio data: reads content
app/about/page.js - About page → Japanese accents: uses accents
app/about/page.js - Projects page → Project carousel: renders
app/projects/page.js - Projects page → Portfolio data: reads quotes
app/projects/page.js - Projects page → Japanese accents: uses accents
app/projects/page.js - Project carousel → Portfolio data: reads projects
components/Sorties.jsx - Project carousel → Japanese accents: uses accents
components/Sorties.jsx - Education page → Education timeline: renders
app/education/page.js - Education page → Portfolio data: reads education
app/education/page.js - Education page → Japanese accents: uses accents
app/education/page.js - Contact page → Contact form: renders
app/contact/page.js - Contact page → Portfolio data: reads contact details
app/contact/page.js - Contact page → Japanese accents: uses accents
app/contact/page.js - Contact form → Portfolio data: reads contact data
components/ContactForm.jsx - Contact form → Visitor email app: opens email app
README.md - Navigation and theme → Effects state: opens settings
components/Header.jsx - Navigation and theme → Japanese accents: uses accents
components/Header.jsx - Particle effects → Effects state: reads effects state
components/Particles.jsx - Reginleif effect → Effects state: reads effects state
components/Reginleif.jsx - Effects settings → Effects state: reads and updates
components/Settings.jsx - Effects settings → Japanese accents: uses accents
components/Settings.jsx - Lena chat → Lena API: posts messages
components/LenaChat.jsx - Lena chat → Japanese accents: uses accents
components/LenaChat.jsx