Question
Verizon Data Services
IN
Last activity: 29 Jun 2020 3:16 EDT
how to use react components in pega 8.3
Hi,
I want to configure react js and have to develop UI using react components in pega 8.3.
I have gone through the react starter pack: https://community.pega.com/marketplace/components/react-starter-pack .
While installing i am facing Batch file not found the in the Path...I have run this command in command prompt.. Please help me to resolve this issue.
## Installation Instructions
Hi,
I want to configure react js and have to develop UI using react components in pega 8.3.
I have gone through the react starter pack: https://community.pega.com/marketplace/components/react-starter-pack .
While installing i am facing Batch file not found the in the Path...I have run this command in command prompt.. Please help me to resolve this issue.
## Installation Instructions
1. Get Pega React Starter Pack zip file from Pega Exchange 2. Unzip the PegaReactStarterPack813.zip, it should create PegaReactStarterPack813 directory that contains the following sub-directories: CableConnectApp, Documents and ReactApp 3. Using a terminal, cd into ./PegaReactStarterPack813. 4. Install Cable Connect sample application by following the instruction in ./CableConnectSampleApp.pdf 5. Make sure that your application server supports CORS. 6. Install Yarn. Installation link [here](https://yarnpkg.com/lang/en/docs/install/#mac-stable). 7. Using a terminal, cd into ./ReactApp directory and unzip PegaReact.zip. 8. Using a terminal, cd into ./pegaapp-react 9. Run the following commands: * `yarn install` * `yarn start` 10. This should open your browser to http://localhost:3000, which is where the application will be served.
***Edited by Moderator Kayla to update Content Type from Discussion to Question***
Updated: 25 Jun 2020 11:42 EDT
Morgan Stanley
IN
Hi,
Check whether you have installed necessary Node and Yarn versions installed on your system and check whether you added those in the environmental variables of your system.
To verify the configuration, you can run and check the following commands in the command prompt.
node -v
yarn version
If all fine, it should return the versions of the software. Then try executing "yarn install" in the appl directory.
Good Luck!
Updated: 27 Jun 2020 14:40 EDT
Verizon Data Services
IN
Hi Sir,
Thanks for the reply.
I am getting network Error..Please let me know how to login with the application.
Thanks.
Morgan Stanley
IN
Hi Udayakumar,
Have you imported the sample appl in your instance and updated the endpoints in src/_services/endpoints.js with the URL of your Pega instance?
If not, change the BASEURL: "http://localhost:1080/prweb/api/v1" with your Pega URL in the src/_services/endpoints.js file after importing the appl in that instance. Follow the document provided with the code if you need any assistance on Appl import.
If the issue persists, Please share the snip of your browser console, which helps us to debug faster.
Good Luck!
Verizon Data Services
IN
Hi Sir,
I have change the endpoint URL but still i am getting network error.
Morgan Stanley
IN
Can you share the screenshot of the browser console?
Updated: 29 Jun 2020 2:23 EDT
Verizon Data Services
IN
Hi Sir,
Please find the Browser Console.
Morgan Stanley
IN
CORS issue is happening during our Service Request. The request from the localhost URL is getting blocked by Pega. I think whitelisting the localhost URL in the Pega might help.
This article might be helpful for you: https://community.pega.com/knowledgebase/release-note/cross-origin-resource-sharing-cors-policies-apis-and-rest-services
To know more about CORS: https://medium.com/@dtkatz/3-ways-to-fix-the-cors-error-and-how-access-control-allow-origin-works-d97d55946d9
Good Luck!