DEV structure of the project

The project was scaffolded using react-create-app, and the folder structure of the project is the following:

crowdhub-web
├── public
└── src
    ├── Components
        ├── Appbar
        ├── Items
        ├── Projects
        ├── Sidebar
        ├── Workflows
            └── WorkflowsDashboard
        ├── common
        ├── utils
        ├── AppRouter.js
        └── Layout.js
    ├── Services
        ├── RunnableWorkflowService
        └── rest
    ├── images
    ├── mock-data
    ├── testHelpers
    ├── App.js
    └── index.js

(some files and folder are ommited for brevity)

Below you can find a brief description of each folder:

public

The public folder contains the index.html file and some other static resources (for example a folder with the resources of the tinyMCE editor);

src/Components

The Components folder contains all the react components, grouped by folder. Every folder contains different number of subfolders, since some components are more complex than others. Moreover, the Components folder contains the Layout component, which defines the layout used in all the application, and the AppRouter component, which defines the router of the app. Ref: Authentication and routes

src/Components/Workflows/WorkflowsDashboard

This component contains the editor of the workflow. Ref: WorkflowEditor

src/Services/rest

The Services/rest folder contains the objects that use the API. All the arguments received and objects returned from these services are plain object or primitives. However the structure of these objects may differ from the JSON received/sent to the API. Because of this, services have methods to convert the JSON representation to the one used in the application and vice versa.

src/Services/RunnableWorkflowService

Ref: Workflow-and-Runs