frontend-demos-structure

To navigate the frontend structure of a React and Vite project, review the App.jsx and index.css files to understand UI wiring, and check vite.config.js for build configurations like the base URL and output directory.

The main entry points for a React 18 and Vite 5 application are typically found in the src/ directory, specifically main.jsx for bootstrapping and App.jsx for the root component, with global styles managed in index.css.

To onboard to an existing React frontend codebase, you need familiarity with React, Vite, and standard project layouts, allowing you to quickly locate files and understand conventions used in the repository's site and Playground components.

To adjust the theme of a React application using CSS variables, navigate to the index.css file in the src/ directory and modify the existing CSS variables to immediately reflect changes across the UI components.

A Vite build output works with a specific base URL configuration by setting the base path in vite.config.js, such as /demos/, which ensures assets are correctly resolved when deployed to the frontend/dist directory.