Using App Runtime in a Next JS application

Recently, there has been a growing need to integrate DHIS2 with modern web technologies. One such technology is Next.js, a React-based framework. Although Next.js is built on React, it cannot directly work with the existing DHIS2 React development tools. To address this, I have created a guide for building a Next.js application using the DHIS2 app runtime tools.

The guide covers key aspects such as:

  • Proxying DHIS2 API requests
  • Setting up the App Runtime Provider
  • Using the App Runtime hooks in client-side components

You can find the detailed guide here, and an example repository is available here.

Note: This guide focuses on a minimal implementation and does not address security or performance considerations.

3 Likes

Wow @nnkogift ! It looks like a nicely written guide. I can’t wait to test it.

It’s a great thought you shared it here with the community. From your perspective, when should one revert to using this method ?

Thank you!

2 Likes

this is amazing @nnkogift - I will give it a shot. I will also try to investigate how difficult it would be to make appruntime work server-side (let me know if you have thoughts there).

cc @Roger_NDUTIYE this might be relevant to what we were talking about building a portal with Next JS.

2 Likes

Thanks @Gassim

Please try it out and let me know if you have any feedback.

This can be useful if one is trying to create an external application(not a DHIS2-installed) that needs to work with DHIS2. An example of this would be a web portal for public use.

1 Like

Thanks @mozafar

Please let me know if you have any feedback after trying it

I think it is very useful to have the runtime working for the server side as well. I think maybe it could start by being able to initialize the data engine on the server side and maybe build up from there.

1 Like

VERY cool @nnkogift !

It definitely should be possible to use the Engine from app-runtime in server components, we’ve been discussing decoupling the engine from the react hooks recently…

2 Likes