Most projects we work on end up having different areas in the website for different user types, eg -

• Brand and Influencer in BeTagged
• Recruiter and Candidate in Select10X
• Group Admin and Brand Admin in Convosight
• B2B, Credit and GST in CashFlo

Many components are shared between these different login areas. Hereon, we refer to each of these areas as Modules.

To support this type of project, the code structure we follow is

The app is where all the shared code lies whereas each module has its own separate section in the codebase. Apart from shared UI components, the app includes code around logging, server communication, global stylesheets, assets, routing, and so on.

<aside> ⚡ Use kebab-case for all package, folder, and file names. Each filename follows the naming standard - name.type.ts. Eg: user.model.ts, user.service.ts, user.component.tsx. Note, the type might not be possible in all cases like setup.ts

</aside>

We have the src folder inside the web client folder where the main code will reside.

• src