How itzraynx/frens-project-1bac works
This is a French-language editorial site presenting Maghrebi literature and the characters of Ahmed Sefrioui’s La Boîte à merveilles. Visitors enter through a project splash and hero, then navigate the definition, four project chapters, and a review quiz; navigation, theme switching, print, and scroll controls support that reading journey. The graph centers on the documented content stages and the sampled React composition. Several visual components are indexed but not excerpted, so their internal behavior and connections are not inferred.
Main entry points: App.tsx Page composition · SectionNumber.tsx Section marker · main.tsx React entry · Hero.tsx Project introduction
Components 23
Application shell
- React entry
src/main.tsx - Page composition
src/App.tsx - Theme state
src/context/ThemeContext.tsx
Editorial content
- Project splash
src/components/SplashScreen.tsx - Project introduction
src/components/Hero.tsx - Literature definition
src/components/Introduction.tsx - Character chapters
src/components/ProjectChapters.tsx - Review quiz
src/components/ProjectEnd.tsx - Project footer
src/components/Footer.tsx
Reading controls
- Section navigation
src/components/Navbar.tsx - Scroll progress
src/components/ScrollProgress.tsx - Back to top
src/components/BackToTop.tsx - Print control
src/components/PrintButton.tsx
Visual effects
- Animated title
src/components/TextScramble.tsx - Custom cursor
src/components/CustomCursor.tsx - Floating particles
src/components/FloatingParticles.tsx - Animated mesh
src/components/AnimatedMesh.tsx - Section marker
src/components/SectionNumber.tsx - Aura card
src/components/AuraCard.tsx - Breathing glow
src/components/BreathingGlow.tsx - Confetti effect
src/components/Confetti.tsx - Tilt card
src/components/TiltCard.tsx
Other components
- Site visitor
Connections 21
- Site visitor → React entry: opens site
README.md - React entry → Page composition: renders
src/main.tsx - Page composition → Theme state: provides theme
src/App.tsx - Page composition → Project splash: renders
src/App.tsx - Page composition → Custom cursor: renders
src/App.tsx - Page composition → Floating particles: renders
src/App.tsx - Page composition → Animated mesh: renders
src/App.tsx - Page composition → Section navigation: renders
src/App.tsx - Page composition → Scroll progress: renders
src/App.tsx - Page composition → Project introduction: renders
src/App.tsx - Page composition → Literature definition: renders
src/App.tsx - Page composition → Character chapters: renders
src/App.tsx - Page composition → Review quiz: renders
src/App.tsx - Page composition → Project footer: renders
src/App.tsx - Page composition → Back to top: renders
src/App.tsx - Page composition → Print control: renders
src/App.tsx - Project introduction → Animated title: renders title
src/components/Hero.tsx - Literature definition → Section marker: renders marker
src/components/Introduction.tsx - Character chapters → Section marker: renders marker
src/components/ProjectChapters.tsx - Review quiz → Section marker: renders marker
src/components/ProjectEnd.tsx - Section navigation → Theme state: reads theme
src/components/Navbar.tsx