How to integrate a website written in React.js into Sulu CMS?

Question

I have a website written in React.js and I need to throw it into Sulu CMS. I have researched how to do this and found ways to do it using API. It seems to me there are much simpler options...

I found a video describing that Sulu CMS has the ability to develop pages in React.js. I tried moving the site files to the webspaces folder, but it didn't work :(

Answer 1

You can use Sulu with every frontend framework you want. If you want to use react, it mostly that you need a server side framework like Next.js or Remix. On the Sulu side you need to install the SuluHeadlessBundle:

https://github.com/sulu/suluheadlessbundle

Which will give you the possibility to return the whole page as JSON response and some additional endpoints for Navigation, Snippet Areas and so on.

Keep in mind it is very important when you go headless that you add a caching mechanism in front of your React Application. Most compatible is Varnish, but also SaaS like Fastly, Cloudfront, ... also works. Because without your Node JS server need to render the page for every visitor, but for a Website you want it normally render once and cache it so visitors get responses as fast as possible.

The headless bundle will give you an endpoint for pages which is /{pageUrl}.json so if your react application gets a request to /{pageUrl} you request then Sulu /{pageUrl}.json endpoint and get the whole page data as JSON and render it the way you like it.