Products Structure

Norio React keeps routes, UI, data, styles, and motion in clear folders under norio-react-dev. Use this map when adding pages or editing sections.

Folder structure

src/pages
- HomePage.tsx — home
- Index2Page.tsx, Index3Page.tsx, dark variants, …
- WorksPage.tsx, Projects*Page.tsx, ProjectDetailsPage.tsx
- AboutPage.tsx, ServicesPage.tsx, ContactPage.tsx, …
- NotFoundPage.tsx
src/AppRoutes.tsx — React Router route table
src/main.tsx / src/App.tsx — Vite entry + shell
src/components
- layout — SiteShell, headers, footers, chrome
- sections — page sections (hero, projects, …)
- elements — shared UI pieces
- cards — card components
- effects — EffectsLoader / EffectsBootstrap
src/data
- JSON content for sections and site meta
src/effects
- Vanilla GSAP / Three.js effect modules
src/styles
- SCSS: abstracts, base, layout, sections, vendors
tokens
- tokens.json — design-token source of truth
public/assets
- Images, fonts, vendored JS (odometer, color-modes, …)