lethinkj/marvel-slice

Purpose and Runtime

Marvel Slice is a React/Vite education and LMS content site with a public catalog, dynamic CMS pages, submission/chat features, and a separate admin dashboard. It runs as a Vite SPA, deployed to Vercel with SPA rewrites; Supabase supplies PostgreSQL, REST access, and Storage. Entry/bootstrap paths: src/main.jsx, src/App.jsx, vercel.json.

Application Routing Boundary

src/App.jsx separates public routes from /admin/*. Public pages cover home, courses and course detail, services/training, blog, career/contact, legal, upcoming classes, and dynamic navigation pages. The admin router, auth provider, protected layout, and editor routes are centered in src/admin/Admin.jsx, src/admin/context/AuthContext.jsx, and src/admin/layout/AdminLayout.jsx.

Public Content Delivery

Public page components compose DB-backed content into reusable site chrome and sections. Home renders configurable sections; course detail renders course metadata and related content; NavPage resolves arbitrary navigation-backed pages. Shared navigation/footer fetch settings and navigation tree data. Key paths: src/pages/Home.jsx, src/pages/CourseDetail.jsx, src/pages/NavPage.jsx, src/components/layout/Header.jsx, src/components/ui/SectionRenderer.jsx.

Data Access and Content Model

The browser connects directly to Supabase through a client configured from Vite environment variables. React Query-oriented hooks encapsulate fetch/mutation behavior for courses, blog, services, training, nav, and site data. The relational schema supports CMS settings/navigation, course relations/tags, blog relations, submissions, chat, services, training, jobs, and legal content. Core paths: src/lib/supabaseClient.js, src/hooks/useSupabase.js, src/hooks/useBlog.js, schema.sql, supabase/migrations.

Administrative CMS

The admin application manages both structured entities and page-section JSON/content: courses, blog, nav, home, services, training, careers, media, site settings, and inbound submissions. It relies on a client-side email/password hash check against admin profiles and persists its session in localStorage; this is an explicit security boundary rather than Supabase Auth. Representative paths: src/admin/pages/CourseEditor.jsx, src/admin/pages/HomePageEditor.jsx, src/admin/pages/BlogPostEditor.jsx, src/admin/pages/MediaLibrary.jsx, src/admin/components/ImageUploader.jsx.

User Interaction and Server Endpoints

Most writes go from the SPA directly to Supabase. Form/contact and career submission flows additionally use Vercel serverless API handlers, separating email/reply or submission-side behavior from the static SPA. Embedded chat and job-application UI are client features backed by corresponding Supabase tables/migrations. Paths: api/submit-contact.js, api/submit-career.js, api/admin-reply.js, src/components/chat/ChatWidget.jsx, src/components/apply/JobApplyModal.jsx.

Data Provisioning and Migration Assets

Database setup is rooted in the main SQL schema plus incremental Supabase migrations. JSON exports and scripts provide development/restore/seed pipelines, especially for course and page content; they are operational inputs rather than production runtime sources. Paths: schema.sql, services-schema.sql, training-schema.sql, scripts/seed-all.js, data/courses/courses_raw.json.