Folder structure

FrontWing follows a clean and modular folder structure, typical for modern React + Remix applications.

This structure ensures separation of concerns and scalability. Each part of the app lives in its domain, making onboarding and maintenance easier.

Here are the key folders and their responsibilities:

/app

Main source directory. Contains all code, including routes, components, types, and utilities.

Folder	Purpose
routes/	Remix route files. Each file maps to a URL (e.g. /product/:slug)
components/	Shared UI components, grouped by domain (e.g. product/, order/)
context/	React Contexts (e.g. OrderContext) for global state
layouts/	Page layout components (e.g. Default.tsx, Account.tsx)
types/	TypeScript interfaces for data models (Product, Order, Taxon, etc.)
utils/	Helper functions: formatting, fetchers, price utils, env setup
api/	API abstraction layer for Sylius endpoints (e.g. fetchProduct())
styles/	SCSS files, Bootstrap overrides, variables
images/	Static assets and icons used in the UI

/public

Static files served directly by the server.

File / Folder	Purpose
robots.txt	SEO control for search engines
favicon.ico	Favicon for browser tabs
images/	Static images used across the app