This document provides a high-level overview of the architecture for the Next.js instance integrated with VEDA-UI.
The project follows the modern Next.js file structure as documented in the Next.js documentation. Key directories include:
- Contains the application’s core pages, layouts, and routes
- Structure: Each folder under
app/
corresponds to a route in the application Example:app/about/page.tsx
maps to/about
- Stores reusable React components for the app
- Holds structured content, such as datasets, stories, or other resources used by the app
- Serves as a centralized module for importing and exporting components, hooks, and utilities from
@developmentseed/veda-ui
that are used across the application
- Purpose: Manages application-level state using React context providers
- Includes global styles and theme configurations.
- Global styles:
styles/index.scss
applies general app-wide styles - Theme styles:
_uswds-theme.scss
is the configuration for the U.S. Web Design System (USWDS) specific for this app
- Global styles:
For details on how USWDS components and styles are used in the project, refer to the Styling guide.
- Custom React hooks to enhance reusability and abstraction of logic
For detailed instructions on setting up and running the project, refer to the Development guide.