Create Sitecore React App Step By Step

• Be sure having latest node?

• Be user in installed the following latest version packages??

• Sitecore Headless Services Server XP 21.0.587?

• Sitecore JavaScript Services Server for Sitecore 10.0.0 XP 15.0.1 rev. 201112?

• Open CMD in the folder that you want to create your app and run the followings commands in t

• npm install -g @sitecore-jss/sitecore-jss-cli?

• npm init sitecore-jss shahwan-jss-app react?

• Answer the following questions??

• Which template would you like to create??

• Select react??

• ? Where would you like your new app created??

• ?SiteCoreHeadless\React\react (path where you will create your app)?

• ? Would you like to use the pre-push hook for linting check??

• ?Yes?

• ? What is the name of your app???

• shahwan-jss-app (Name of your app)?

• ? What is your Sitecore hostname (used if deployed to Sitecore)??

• Sc103sc.dev.local (host of your sitecore instance)?

• ? How would you like to fetch Layout and Dictionary data??

• Select REST?

• ? Which additional language do you want to support (en is already included and required)??

• ?ar-SA?

• Run JSS start you will see browser open the following https://localhost:3000?

• You may get the following error??

start jss : File C:\Users\Amr\AppData\Roaming\npm\jss.ps1 cannot be loaded. The file C:\Users\Amr\AppData\Roaming\npm\jss.ps1 is not digitally signed. You cannot run this script on the current system. For more information about running scripts and setting execution policy, see about_Execution_Policies at https:/go.microsoft.com/fwlink/?LinkID=135170.?

?

This happens as your system, power shell is not yet allowed to execute any executable scripts. This error is encountered mainly in Windows 10 when using VS Code IDE where Power Shell is selected as a command-line option by default.?

??

You can fix this issue by execute the following CMD command in the same Powershell terminal?

??

Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUser?

• Stop listening by clicking on ctrl +c?

• jss setup answer the following?

• Is your Sitecore instance on this machine or accessible via network share? [y/n]:?

• y?

• Path to the Sitecore folder (e.g. c:\inetpub\wwwroot\my.siteco.re):?

• C:\inetpub\wwwroot\sc103sc.dev.local?

• Sitecore hostname (e.g. https://myapp.local.siteco.re; see /sitecore/config; ensure added to hosts):?

• ?https://sc103sc.dev.local??

• Sitecore import service URL [https://sc103sc.dev.local/sitecore/api/jss/import]:?

• Click Enter???

• Sitecore API Key (ID of API key item):?

• ?{C5D48FDF-D929-4E45-BC3C-8944AB25FDB8} (write your own)?

• Please enter your deployment secret (32+ random chars; or press enter to generate one):?

• Click Enter???

• jss deploy config?

• Open the following on the browser that is mean your steps till now are correct??

• https://sc103sc.dev.local/sitecore/api/layout/render/jss/?item=home&sc_apikey={C5D48FDF-D929-4E45-BC3C-8944AB25FDB8}?

• jss deploy items if you run that command only it will raise an error so skip that one and go to next one?

• jss deploy items –acceptCertificate test??

• It will raise error telling you have to set right thumbprint take that thumbprint copy and append it to? jss deploy items –acceptCertificate to be like that??

• jss deploy items --includeContent --includeDictionary --acceptCertificate 67:B1:1D:6A:C8:66:64:96:E3:46:B1:FE:5D:17:56:8A:43:F2:D0:68?

• Now if you go to sitecore and explore content you will find jss app with name that you create as below?

?

?

Steps to create API key?

?

1. From the start menu or from the Sitecore Launchpad, open the Content Editor application.?

1. In the content tree, navigate to /sitecore/system/Settings/Services/API Keys.?

1. On the Home ribbon, insert a new API Key item. The name of the item is for your reference only?

1. Set the following prosperities as below??

1. CORS Origins: *?

1. AllowedControllers : *?

1. Impersonation User: extranet\anonymous?

?

?

#sitecoreian #sitecore10

?