It has an acceptable level of quality.
The whole OJS app is localised, which will come in handy if we decide to expand into other markets, and also allows us to standardise our App Vocabulary / terms (they way we call things)
The challenges are divided in the following sections
Jump to next topic ➡️
Our current React codebase lacks consistent structure, impacting maintainability and velocity.
READ MORE ⬇️
No clear separation between business logic and presentational components (critical)
Components tend to grow very large and complex over time
Inconsistent patterns lead to fragile code that’s hard to maintain or scale
READ MORE ⬇️
No clear separation between business logic and presentational components (critical)
Components tend to grow very large and complex over time
Inconsistent patterns lead to fragile code that’s hard to maintain or scale
READ MORE ⬇️
Enforce separation between logical (container) and presentational components
Define clear responsibilities for each layer:
Presentational: purely UI, stateless, reusable
Logical: data fetching, state management, business rules
Introduce code standards and guidelines for component organization
Increase test coverage around business logic
READ MORE ⬇️
Fix complexity: Medium (5/10)
Time estimate: Medium-high (8/10)
Why?
Though technically straightforward, it requires tests and coordination on standards
Needs team agreement on component roles and responsibilities
Incremental refactoring to avoid large disruptions
READ MORE ⬇️
Standardizing React architecture is essential. It will significantly reduce bugs, accelerate development, and elevate product quality. Without it, we risk maintaining fragile, error-prone code that slows us down.
Jump to next topic ➡️
Lack of clear onboarding docs slows ramp-up and creates knowledge gaps.
READ MORE ⬇️
No centralized documentation for setup and common tasks
New hires and existing devs rely on tribal knowledge or direct syncs
Key info missing: enabling Developer Tools, clearing cache, initializing app, plugin launcher behavior
READ MORE ⬇️
Maintain a clear README.md plus other Markdown docs for key topics
Cover setup, tools, cache, app init, and common issues
Use Claude Code to keep docs accurate and updated automatically
Encourage team contributions to keep docs fresh
READ MORE ⬇️
Fix complexity: Low (2/10)
Time estimate: Low (2/10)
Why?
Writing docs is straightforward
Requires discipline to keep it updated
READ MORE ⬇️
Clear onboarding docs speed up new developer integration, reduce errors, and free up senior engineers from repeated explanations.
It’s a small investment with a big return on productivity.
Jump to next topic ➡️
Current styling approach complicates consistency and maintainability.
READ MORE ⬇️
CSS-in-JS is brittle, hard to maintain, and restricts CSS overrides
It leads to messy, inconsistent styles and design drift
Our code heavily overrides FluentUI, which is built for Microsoft’s look, not Definely’s
These overrides break FluentUI’s design, causing UI glitches and maintenance pain
READ MORE ⬇️
UI consistency suffers, confusing users and undermining brand identity
Styling bugs become frequent and harder to fix
Development slows as more time is spent debugging UI issues
Increases technical debt and risks longer-term instability
READ MORE ⬇️
Build an internal UI component library with reusable, standardized elements
Use TailwindCSS plus a custom atomic CSS layer for consistency and flexibility
Follow atomic design principles to organize and scale styles cleanly
Integrate seamlessly with existing business logic without heavy overrides
READ MORE ⬇️