Folder structure
Orbix is a standard ASP.NET Core 10 solution. The web app adds a few configuration files, Razor shell pieces and a small TypeScript layer:
orbix-aspnet/
├── Orbix.slnx solution: the web app and its tests
├── global.json, Directory.Build.props SDK version and shared project settings
├── src/Orbix/
│ ├── Program.cs services and middleware (localization, path base, status pages)
│ ├── appsettings.json CSS engine, languages, brand name, path base
│ ├── menu.json sidebar menu (also feeds the command palette)
│ ├── Locales/{en,es,pt,fr,ar}.json translations (shared by Razor and JavaScript)
│ ├── Infrastructure/
│ │ ├── Navigation/PageRoutes.cs routing table: Razor page => URL of every page
│ │ ├── Navigation/Menu.cs menu model (menu.json)
│ │ ├── Localization/ IStringLocalizer over Locales/, plural rules, language endpoints
│ │ ├── TagHelpers/ <ox-partial>, <ox-slot>, <ox-page-header>
│ │ ├── Assets/ViteAssets.cs <ox-vite>: built assets of the engine in use
│ │ └── OrbixOptions.cs, OrbixSite.cs settings and view helpers (language, direction, inline assets)
│ ├── ViewComponents/ sidebar, topbar, footer, customizer, command palette
│ ├── Pages/
│ │ ├── _ViewImports.cshtml namespaces, tag helpers, L (localizer) and Site
│ │ ├── index.cshtml, dashboards/, apps/… one Razor page per screen
│ │ └── Shared/
│ │ ├── _Layout.cshtml app layout (sidebar shell); _AuthLayout and _BlankLayout
│ │ ├── Shell/ document head and page header
│ │ ├── Components/ views of the shell view components
│ │ └── Partials/ reusable blocks (product card, mail row, password field, ...)
│ ├── ClientApp/
│ │ ├── css/engines/tailwind.css CSS engine entry
│ │ ├── css/foundry/ design system compiled from SCSS by the build (generated)
│ │ ├── css/orbix.css, css/orbix/ template styles (tokens only, logical properties)
│ │ ├── js/app.ts entry: theme, i18n, behaviors, page modules
│ │ ├── js/core/ i18n, formats, charts, shell preferences
│ │ ├── js/pages/ one module per page family (<body data-module>)
│ │ ├── js/boot/ no-flicker boot scripts inlined in <head>
│ │ ├── scss/brand.scss brand settings of the design system (colors, radius, fonts)
│ │ └── svg/sprite.svg icon sprite inlined in every page (generated)
│ ├── packages/foundry-ui/ design system bundled with the template (local npm package),
│ │ with its SCSS sources (see Customize with SCSS)
│ ├── scripts/ build of the CSS engine, icon sprite and icon sets
│ ├── wwwroot/
│ │ ├── build/tailwind/ compiled CSS, JavaScript and fonts (npm run build)
│ │ ├── icon-sets/ full icon sets for the icon browser pages
│ │ └── images/ demo photos (CC0 / public domain) and their CREDITS.json
│ └── package.json, vite.config.ts front-end tooling (Node.js only at build time)
└── tests/Orbix.Tests/ xUnit: pages, languages, rendered text, translations, sources, builds, imagesHow a page is put together
Infrastructure/Navigation/PageRoutes.csmaps a Razor page to its URL, for example["/dashboards/crm"] = "dashboards/crm". A routing convention applies the table: every page answers only the URL listed there, so a URL changes in one place.- The page
Pages/dashboards/crm.cshtmlstarts with@page, chooses its layout and setsViewData["Title"](translation key),ViewData["Nav"](navigation id) and, optionally,ViewData["Module"]. - The layout renders the document head (title, language and direction, built assets), the shell view components
(the sidebar from
menu.json, the topbar, the footer, the customizer and the command palette) and the page. - If the page declares
ViewData["Module"] = "dashboards/crm", the page scriptClientApp/js/pages/dashboards/crm.tsis loaded on demand (charts, calendars and other interactive widgets). ClientApp/js/app.tsstarts the theme, the translations and the behaviors in the browser.