Fuso documentation

React Folder Structure


To make the code more re-usable we have created multiple components that can be reused. This makes refactoring the code effecient and saves a lot of time for the developers.

We have used the best folder structure to keep all the common types of code separate from each other.

    • Fuso
      • public
        • assets
          • fonts
          • gif
          • images
          • scss
          • svg
          • video
        • json-data
        • favicon.ico
        • index.html
      • src
        • components
          • car
            • detail
              • CarClassic.tsx
              • CarClassicSlider.tsx
              • CarExpandSlider.tsx
          • commonComponents
            • Pagination.tsx
            • FilterOffCanvas.tsx
            • NotFound.tsx
          • home
          • job
          • pages
          • property
        • data
          • Property.tsx
          • Job.tsx
        • jsonData
          • index.tsx
        • layout
          • footer
            • footerDemo1
              • FooterContacts.tsx
              • index.tsx
          • header
            • navigation
              • MainMenu.tsx
              • index.tsx
          • index.tsx
        • reduxToolkit
          • reducers
            • filterSlice.ts
            • layoutSlice.ts
            • productSlice.ts
          • hooks.ts
          • store.ts
        • routers
          • RouterProvider.tsx
          • routes.ts
        • types
          • Blog.ts
          • Layout.ts
        • App.tsx
        • i18n.tsx
        • index.scss
        • index.tsx
    • package.json
    • tsconfig.json

public

Assets Folder

As the name suggest, this folder contains all the assets that are used in the template. All the scss data, images, fonts and all the other static files can be found in this folder.

index.html

To update the favicon or title, you can set default values for the template here.

src

This Folder contains all the important files like all the page components.

Components Folder

This folder is inside the source folder and contains all the pages that are to be rendered. All the components are created according to the sequence of pages in the sidebar, so that it would be easier to find a particular page.

Other Files

Apart from these folders, there are a few other files in the src folder

App.tsx This is the main application component in a React project. It serves as the root component through which all other components are rendered.

index.tsx This is the entry point of the React application. It is responsible for rendering the App.tsx component into the root DOM element. It often includes global configurations such as theme providers, global styles, and strict mode wrappers.