I am using Cumulocity IoT (Release 10.13.0)
Free Trial
I am trying to host a react application on Cumulocity. Just guide me if there is any documentation for the same or if anyone has tried this before. It would be a great help.
Hi Samanyu,
you can just upload your react application as described here: Administration - Cumulocity IoT Guides . In addition to your application you would also have to place a cumulocity.json file in your zip archive.
I’ve attached a sample zip file with just a basic HTML file for demonstration. app.zip
Regards,
Tristan
Hi Tristan,
Thank you for your reply. Can you please guide me on how will I route the application internally in react from the index.html file. Let me know if you have any guides, it will help me a lot.
Regards,
Samanyu
Hi Samanyu,
you probably have some issues as the application is served from an subfolder and not in the root of server.
Maybe you can try what is suggested here:
The baseUrl should be something like /apps/<contextPath-of-your-app>/.
Regards,
Tristan
Hi Tristan,
Thank you for your response. That could help me in the later stage but right now I got another issue. I was able to solve that so now I am building my application and deploying the build of the application on cumulocity. Now I have many react pages that I am routing internally. But whenever I am trying to go to a different page through a link, the cumulocity is appending a .html in the URL. So do you have any idea about how I can block the cumulocity to look for foo.html and just go to the foo I have mentioned?
P.S: I am taking into account that you are not aware of React.js so I am letting you know that in react we have numerous .js pages which are known as components and we route the application without any suffix. Like, Link to /foo instead of /foo.js.
So is it possible to route to other pages or do I need to create HTML pages for all the pages that i have created in js? Do let me know what you think about this.
Regards,
Samanyu
Hi Samanyu,
I’ve just tested it with this react sample application: GitHub - andrewagain/emoji-search: Simple React app for searching emoji
I’ve had to adapt the homepage attriubute of the package.json to /apps/emoji-search.
After running npm run build, I’ve zipped the files contained in the newly created build folder and renamed the zip file to emoji-search.zip.
This zip file I just had to upload then to the tenant.
Regards,
Tristan
Hi Tristan,
Thank you so much for your response. The relative path (/apps/emoji-search) helped me. Now my application is working on cumulocity. You were a great help, I hope you come to answer me in the future too, haha. Thanks a ton!
Regards,
Samanyu
This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.