How brewed-ops/portfolio-template works
This is a React portfolio-template site: visitors navigate a responsive portfolio shell to explore profile, projects, services, showcases and other pages, then can contact the portfolio owner. The main runtime path is browser entry and route selection into the persistent shell, which renders the selected page and adapts navigation for phone layouts. Portfolio content is placeholder-driven; the README documents additional content areas such as testimonials, AI systems, FAQs and funnel pages. Some page and integration wiring is inferred only from route declarations and README descriptions because their source was not sampled.
Main entry points: App.tsx Responsive shell · main.tsx Route table · Home.tsx Home page · ProjectsView.tsx Projects page
Components 23
Routing and shell
- Browser entry
src/main.tsx - Route table
src/main.tsx - Responsive shell
src/App.tsx - Phone navigation
src/components/TabBar.tsx - Contour background
src/components/HeroCanvasV2.tsx - Frame health
src/lib/perf.ts - Smooth scrolling
src/hooks/useLenis.ts
Portfolio pages
- Home page
src/components/Home.tsx - Projects page
src/views/ProjectsView.tsx - Services page
src/views/ServicesView.tsx - Showcase page
src/views/ShowcaseView.tsx - Testimonials
src/components/TestimonialsGrid.tsx - About page
src/components/AboutGrid.tsx - Contact page
src/components/ContactGrid.tsx - Legal pages
src/components/Privacy.tsx - 3D carousel
src/components/Flagship.tsx
Portfolio content
- Profile content
src/data/profile.ts - Project content
src/data/projects.ts - AI systems
src/data/ai-stack.ts - Funnel listings
src/data/funnels.ts
Visitor interactions
- Contact handling
src/lib/contact.ts
Other components
- Visitor
- Email application
Connections 23
- Visitor → Browser entry: opens site
- Browser entry → Route table: renders routes
- Route table → Responsive shell: mounts shell
- Responsive shell → Home page: renders route
- Responsive shell → Projects page: renders route
- Responsive shell → Services page: renders route
- Responsive shell → Showcase page: renders route
- Responsive shell → Testimonials: renders route
- Responsive shell → About page: renders route
- Responsive shell → Contact page: renders route
- Route table → Legal pages: routes legal pages
- Responsive shell → Phone navigation: shows on phones
- Responsive shell → Contour background: loads decoration
- Responsive shell → Frame health: measures frame health
- Responsive shell → Smooth scrolling: initializes scrolling
- Home page → Profile content: reads profile
- Projects page → Project content: reads projects
- Projects page → AI systems: shows systems
- Home page → AI systems: shows systems
- Showcase page → 3D carousel: shows carousel
- 3D carousel → Funnel listings: reads listings
- Contact page → Contact handling: handles submission
- Contact handling → Email application: opens email app