# Client roadmap - key points

### Reducing Technical Debt (Near term)
- Set convention for the directories (https://www.taniarascia.com/react-architecture-directory-structure/) + readme
- Set convention for components (what and when) (https://medium.com/wesionary-team/types-of-react-components-you-should-know-251cceacd8ac) + readme
- keep in mind
- impact of using states (via XState)
- ability to reuse data / logic components (vs display components)

Follow up epics
- prioritized gap list of work to be done, including creating component tests
- Standardize component libraries - remove bootstrap, bootstrap icons, poppper, etc and integrate mui

Separate
- State mgmt: e.g. XState
- Logging framework e.g. winston that can have a transport to Sentry or can Sentry do this?

### Design considerations
- Accesibility / internationalisation
- Security: e.g. a package like Helmet; QA scanning options
- Browser support

### Reducing Technical Debt (Long term)
- Refactor routing/navigation to optimize loading process
- Add complex/e2e/performance component & integration tests

### Logging / Monitoring / Metrics (Near term)
- Define key user flows and use Sentry to (trace users)/(capture errors)
- Integrate google analytics?

### SEO Optimization (Near term)
- React helmet
- Simplify routing

### SEO Optimization (Long term)
- Partial server-side rendering & react hydration

### Usability
- Incorporate/Highlight useful information
- Pages can get too long, allow the user to quickly scan for information - e.g. navigation panel
- Home pages includes relevant user activity at a glance - e.g. dashboard
- Navigating to a project/opportunity can be frustrating
- Add ability to pin/unpin ecoverses/challenges/opportunities/projects
- Involve community as much as possible - e.g. add ability to give feedback through email, dedicated matrix channel, etc.

### Features
- Add messaging capabilities
- Add global search
- Brand recognition (Explicit designer involvement) - e.g.