How nishannp/my-portfolio works
This is a React personal portfolio site. Visitors enter through the shared navigation, which selects a routed page: a personal profile, photography gallery, project showcase, or chronological life timeline. The timeline’s event data is supplied by the application and rendered with year filtering and image viewing; pages also provide SEO metadata, with structured markup on the home page. The README describes Create React App setup rather than additional product features. Some component files are present in the tree but their wiring was not sampled, so uncertain connections are omitted.
Main entry points: App.js App and routes · home.js About home · projects.js Project showcase · timeline.js Timeline rendering
Components 15
Site shell
- App and routes
src/App.js - Navigation
src/components/navbar.js - Footer
src/components/footer.js
Personal profile
- About home
src/components/home.js - Structured markup
src/components/schemamarkup.js
Photos and memories
- Photo gallery
src/components/gallery.js - Timeline page
src/components/timeline.js - Timeline rendering
src/components/timeline.js - Image viewer
src/components/timeline.js - Site images
public/images
Projects and metadata
- Project showcase
src/components/projects.js - SEO metadata
src/components/seo.js - Project images
public/project
Other components
- Visitor
- Linked projects
Connections 21
- Visitor → App and routes: opens site
- App and routes → Navigation: renders
- App and routes → About home: routes to
- App and routes → Photo gallery: routes to
- App and routes → Project showcase: routes to
- App and routes → Timeline page: routes to
- App and routes → Footer: renders
- Navigation → App and routes: selects route
- App and routes → Timeline rendering: passes events
- Timeline page → Timeline rendering: renders
- Timeline rendering → Image viewer: opens images
- About home → Structured markup: renders markup
- About home → SEO metadata: sets metadata
- Photo gallery → SEO metadata: sets metadata
- Project showcase → SEO metadata: sets metadata
- Timeline page → SEO metadata: sets metadata
- Photo gallery → Site images: loads photos
- Timeline rendering → Site images: loads photos
- About home → Site images: loads profile image
- Project showcase → Project images: loads thumbnails
- Project showcase → Linked projects: links out