Forum

[aravind108267]

Team

I have followed the steps as suggested in the below link for creating a simple react application on crownpeak.

https://community.crownpeak.com/t5/Developer-Blogs/Crownpeak-Digital-Experience-Management-DXM-React...

I'm blocked at the below step,

1. "Deploy the React App to your chosen delivery tier. Create DXM Configuration"

            Where(Which location) & How should I deploy the React App?

2. "Create an Asset in DXM using the Template that we’ve configured, and an appropriate Workflow. Ensure that the workflow deploys Assets to the same target delivery location that you deployed your production React App"

            Create an Asset - Create a page?

            Deploys Assets to the same target delivery location that you deployed your production React App - Need clarity on this?

Can someone please help me on this?

[MarcusEdwards]

1. Crownpeak is a decoupled CMS so you will need to publish any content managed in the CMS to a content delivery server or service of some kind. You can use just about anything you want for this provided DXM can deliver files over SFTP, FTPS or S3. If you're not hosting your React app on Crownpeak hosting then you don't even need this step -- deploy your React app to wherever you are hosting directly.

2. Crownpeak does not define the notion of a "page" but rather works with assets. Assets can represent a page, a fragment of page, or content that isn't even published at all. Step 3 in the tutorial you're referring to is instructing you to create a templated asset using the template you made in step 2. Do this by going to a content folder and using the File > New > File action. You should be seeing the New File dialog where you will need to provide three things: a name or label; the template to use; and the workflow to associate with your new asset.

In order to "deploy" the asset, you will need to have workflow and publishing set up. You trigger publishing by using the workflow command to move the content asset into a workflow state that has publishing enabled.

[aravind108267]

Thank you Marcus for the response.

Our intention is to use the S3 bucket to host both CrownPeak and React SPA files.

We are trying to publish our React Application(with Routing) on S3 as suggested by you, but we are facing Routing issues after deploying the React application on S3. We have tried the following to resolve the routing issue:

1. As described in the link mentioned below, we also tried to associate the "Error document" to index.html so that the link falls back to the index.html page,  whenever an user clicks a link.  But this approach will not only affect the 'SPA' - 'Single Page React Application' it will also affect the CrownPeak files we plan to publish on S3.

2. We also tried the RoutingRules to fix the issue as mentioned in the link below, but still we are unable to resolve the issue on S3.

Reference: https://viastudio.com/hosting-a-reactjs-app-with-routing-on-aws-s3/

Any customization done to the folder structure for facilitating React SPA routing will also affect the CrownPeak files. Please let us know the best approach to host both CrownPeak as well as SPA(Routing) files on S3.

[MarcusEdwards]

> Our intention is to use the S3 bucket to host both CrownPeak and React SPA files.

>...

> Please let us know the best approach to host both CrownPeak as well as SPA(Routing) files on S3.

It is unclear what the distinction is here. Can you provide a sample S3 listing that shows these two types of files. I presume by "Crownpeak files" you mean assets that have been published from the CMS? 

> We are facing Routing issues after deploying the React application on S3.

What kind of issues? Please provide examples of what you are seeing and what you would expect to see.

The important thing to understand here is that there are no "Crownpeak" files or code involved here -- this is all plain react + S3. If you can get your React application working in S3 *without* Crownpeak, then you can get it to work after you have added in Crownpeak for content management. My recommendation is, therefore, to get the application working independently because what you're describing doesn't sound like a problem with the Crownpeak products but with runing React apps from S3.