Hey there, we are building and hosting collaboration & networking platforms for our customers. We already have the Nextcloud Files App integrated, but it opens in a new tab with its original frontend, creating a design breach for our users.
Now, we want to properly integrate the Nextcloud Deck App into our platform as well. Instead of embedding the boards as iframes (or even worse, opening them in a new tab as well), we would like to built a custom frontend with React + Chakra UI to offer a seemless look and feel. The features shall basically be the same as in the original frontend, so we are currently not planning to add or remove significant parts.
Looking at the API of the Deck App, this seems to be possible (it will of course be a lot of work). However, we could not find any examples where anyone else did this (or tried this). Learning from successful or failed experiences of others would help us a lot in evaluating whether building a custom frontend is a good idea. Does anyone know of any attempts? It must not be regarding the Deck App, but can be about other apps or Nextcloud in general. Thanks a lot, we really appreciate it!
In general, this is doable. But there are some considerations to be done.
Slave software
You will have to keep updating along with the Deck app. So, your custom framework will be tightly coupled to the version of deck in use. As Deck can be updated anytime, this might cause trouble in general.
Cookbook has mobile apps
I know of another app, that allows for 3rd part access: the cookbook intentionally published an OpenAPI spec (I did that years ago) and allowed to create an ecosystem of 3rd party apps for Android/iOS. This works so far well. The main point is that I keep the API stable at least for 3rd parties.
Problems with CORS
Depending on your intending setup, you might into issues with CORS (and CSRF). If you deploy the NC on a different domain than the frontend, the browsers will trigger CORS preflights.
By default, CORS is not enabled for endpoints. The app devs can rather easily enable CORS by adding some lines. However, some security considerations must be taken, there is a reason for making CORS disabled the default. A quick check showed that Deck has CORS enabled for the API controllers but this is not checked for each endpoint by me.
In order to access from a foreign domain, the CSRF checker must either be disabled or you have to send non-standard headers on top.
A quick glance on the deck app shows that they are no longer obeying the latest development best practices. There might be changes in the API in the future coming.
→ You have to update with the deck app and keep it compatible.
You can however try a MWE. This must not be high-polished but should just show if you can reach the basic endpoints to read/edit the cards in a separate frontend (stub). Jst to get some kind of experience.
Thank you for your replies! Eventually, we decided to build our own client, because an iframe would most likely impair look&feel, mobile responsivity and a11y.
We hope everything goes well
Edit: The frontend will be on the same domain as the Nextcloud
Deck is also a good example for this as there’s already another client for it: the Android app