CSS
CSS Structure
If any modification needs to be done, most of the style or css is in style.css. In this the main colors are used as css variable so its easier to change the main colors.
Pages and Routing
Pages and Routing Structure
In the app folder all the folder act as page url. The page.tsx in the root act as index page or "/" directory and same inside the folder page.tsx files act as the index of the directory where all the required components are mounted.
Re-usable Functional Components
Components Structure
In the component folder there are all componets used to mount in the digiboard pages. The components can be editted easily as most of them are re-usable components.
Context API
DigiContext
In the context folder the DigiContext.tsx in located. In it most of the state management of digiboard is done to avoid extra prop drilling and ease of state management. From this file any required state can be modifed easily as all of the state management code blocks are well documented. We have useDigiContext a custom hook to avoid calling useContext multiple time to use the logic of the context.
Dummy Data
Data Structure
In this Data.ts there are dummy data fetched from mockaroo. The user can fetch data from rest api using async method where the data is fetched instead of fetching data locally.