Products Structure

Rasuke Next.js keeps routes, UI, data, styles, and motion in clear folders under rasuke-nextjs-dev. Use this map when adding pages or editing sections.

Folder structure

rasuke-nextjs-dev/
├─ src/
│  ├─ app/                    App Router routes
│  │  ├─ layout.tsx           root layout (metadata, fonts, color-modes preinit)
│  │  ├─ page.tsx             home
│  │  ├─ index-2/, index-3/   alternate homepages
│  │  ├─ about/, services/, service-details/
│  │  ├─ team/, team-details/, blog/, blog-details/
│  │  ├─ project-listing-1…5/ project-showcase-1…6/
│  │  ├─ project-details/, pricing/, contact/, terms/
│  │  ├─ globals.scss         imports src/styles/main.scss
│  │  ├─ not-found.tsx        404
│  │  └─ error.tsx            route error boundary
│  ├─ components/
│  │  ├─ layout/              SiteShell, PageChrome, headers 1–4,
│  │  │                       footers 1–3, navigation, preloader, cursor,
│  │  │                       transition, back-to-top, offcanvas
│  │  ├─ sections/            one folder per family: hero, about, projects,
│  │  │                       services, testimonials, team, faqs, blog, other
│  │  ├─ elements/            GridWipe and other shared pieces
│  │  └─ effects/             EffectsLoader + EffectsBootstrap
│  ├─ data/                   one JSON per section + site/chrome config
│  ├─ effects/                vanilla GSAP / Three.js modules
│  ├─ hooks/                  useIsomorphicLayoutEffect
│  ├─ lib/                    gsap registration, asset helpers, inline SVG
│  └─ styles/
│     ├─ main.scss            SCSS entry (order matters)
│     ├─ abstracts/           tokens.generated, css-vars, mixins
│     ├─ base/                reset, typography, utilities
│     ├─ layout/              container, headers, footers, smooth scroll…
│     ├─ components/          preloader, transition, cursor, lightbox…
│     └─ sections/            per-section partials + index files
├─ tokens/tokens.json         single source of design values
├─ scripts/build-tokens.mjs   token compiler
├─ public/assets/             imgs, css/vendors, js/vendors, video
├─ next.config.ts             static export + Sass options
└─ tsconfig.json              @/* path alias

Routes

Every route is a folder with a page.tsx that exports metadata and renders SiteShell around its sections. Shared chrome comes from SiteShell props, not from per-page markup.

Route	Chrome	Sections
`/`	header-1, footer-1, preloader	Hero1, About1, Projects1, Services1, Testimonials1, Team1, WhyUs1, Blog1
`/index-2`	header-2, footer-2, preloader	Hero2, Projects2, Testimonials2, Img1, Services2
`/index-3`	header-4, footer-3, preloader	Hero3, Projects3, Brands1, Fact1, Services4, Faqs3, Blog2
`/about`	header-1, footer-1	About2, Team2, Number1, Awards1
`/services`	header-1, footer-1	PageTitle1, Services3, Faqs1
`/service-details`	header-1, footer-1	PageTitle2, ServiceDetail1, ServiceDetail2, ServiceDetail3
`/team`	header-1, footer-1	PageTitle5, Team3, Cta1
`/team-details`	header-1, footer-1	PageTitle4, TeamDetails1, TeamDetails2
`/blog`	header-1, footer-1	PageTitle6, BlogPosts
`/blog-details`	header-1, footer-1	BlogDetails
`/pricing`	header-1, footer-1	PageTitle1, Pricing, Faqs2
`/contact`	header-1, footer-1	Contact
`/terms`	header-1, footer-1	PageTitle1, TermsContent
`/project-listing-1…5`	header-1, footer-1	Listing title + grid/list section per layout
`/project-showcase-1…6`	header-3; footer hidden on 1–4	One fullscreen showcase per page
`not-found`	no header/footer, no preloader	Error404

Section families

hero — Hero1, Hero2, Hero3
about — About1, About2
projects — Projects1–3, Showcase1–6, ProjectListing1–5 (title + grid/list pairs)
services — Services1–4
testimonials — Testimonials1–2
team — Team1–3
faqs — Faqs1–3
blog — Blog1, Blog2
other — page titles 1/2/4/5/6, awards, brands, contact, CTA, facts, image band, number stats, pricing, project/service/team details, terms, why-us, 404

Data files

src/data holds one JSON per section (for example hero1.json, projects1.json, serviceDetail2.json). Chrome configuration lives in preloader.json, cursor.json, and transition.json; site-wide values (name, description, logo, contact) live in site.json. Navigation data lives in navPrimary.json, navHeader2.json, navHeader4.json, and offcanvasMenu.json.

Assets

Static files live in public/assets and are referenced with root URLs like /assets/imgs/hero-1/…. Use asset() from @/lib/assets when a path comes from JSON so relative assets/… strings from the HTML master resolve correctly.