How wscale2026/befreee-commerce works
This is a French e-commerce coaching landing page. A visitor opens the React site, reaches the single Home route, completes a multi-step questionnaire, and receives a personalized diagnostic with payment choices. Supporting sections explain the three-month program, reduce objections, present the trainer, answer FAQs, and provide conversion calls to action. The sampled code shows client-side form persistence and summary rendering, but no implemented Stripe, Zoom, backend, or submission service; those remain marketing claims or unsampled behavior.
Components 15
Application Runtime
- React Entry
src/main.tsx - App Router
src/App.tsx - Home Page
src/pages/Home.tsx - Navigation
src/sections/Navigation.tsx - Site Footer
src/sections/Footer.tsx
Conversion Flow
- Hero Questionnaire
src/sections/HeroForm.tsx - Diagnostic Summary
src/sections/HeroForm.tsx - Payment Choices
src/sections/HeroForm.tsx - Browser Storage
- Final Call To Action
src/sections/FinalCTA.tsx
Program Content
- Three Month Timeline
src/sections/Timeline.tsx
Trust Content
- Objection Handling
src/sections/AntiGalere.tsx - Trainer Profile
src/sections/Formateur.tsx - FAQ Section
src/sections/FAQ.tsx
Other components
- Visitor
Connections 14
- Visitor → React Entry: opens site
- React Entry → App Router: mounts app
- App Router → Home Page: routes home
- Home Page → Navigation: renders
- Home Page → Hero Questionnaire: renders
- Home Page → Objection Handling: renders
- Home Page → Three Month Timeline: renders
- Home Page → Trainer Profile: renders
- Home Page → FAQ Section: renders
- Home Page → Final Call To Action: renders
- Home Page → Site Footer: renders
- Hero Questionnaire → Browser Storage: reads state
- Hero Questionnaire → Diagnostic Summary: shows result
- Hero Questionnaire → Payment Choices: shows options