Atlassian Forge UI Kit leverages React hooks concepts like useState and useEffect but implements them uniquely to work within Forge’s server-side FaaS platform. This briefing unpacks these differences and best practices for developers building Forge apps.
- Forge UI Kit 1 implements custom hooks on server-side FaaS.
- UI Kit 2 and Custom UI apps use standard React hooks.
- Handling async logic in useEffect differs between versions.
What happened
Atlassian’s Forge platform provides developers with UI Kit 1 and UI Kit 2 frameworks to build cloud apps, utilizing hooks similar to those in React for state and lifecycle management. UI Kit 1 includes eight specific hooks, some tailored to Atlassian product contexts, while UI Kit 2 and Custom UI adopt native React hooks.
The key difference lies in how hooks operate behind the scenes: UI Kit 1 hooks are executed server-side on a Function-as-a-Service platform, whereas UI Kit 2 and Custom UI hooks run client-side using React’s native implementation. This creates unique development considerations, especially around async operations.
Why it matters
Understanding the distinctions between Forge UI Kit hook implementations is crucial for developers to properly manage component state, side effects, and asynchronous data fetching without unexpected behavior. Misusing hooks or misunderstanding their lifecycle can lead to bugs, especially considering UI Kit 1’s server-side environment.
Additionally, knowing these differences helps developers leverage Atlassian-specific hooks in UI Kit 1 while transitioning smoothly to UI Kit 2 or Custom UI, which rely on standard React patterns but require different approaches such as accessing product context via @forge/bridge instead of @forge/ui.
What to watch next
Developers should monitor Atlassian’s evolving documentation and developer forums for updates on best practices and tooling improvements around hooks in Forge. Real-world examples demonstrating distinctions or unexpected behaviors between UI Kit versions can guide better app design choices.
Exploration of async handling patterns, particularly within useEffect, remains a focus. Proper techniques for awaiting asynchronous calls and cleanup in hooks will improve app reliability. Sharing insights and questions in the Forge Developer Community can help surface emerging tips and workarounds as the platform matures.