Ways to load Html content through reactjs wrapper

https://grapesjs.com/docs/getting-started.html

@artf Bro, I want to load the html page which contains css and js for effects (parallax). I worked around 10 days but still I cant able to find whether am doing it right. So can you provide me instructions to do it in correct way. Ultimate goal is to provide set of templates for the user in the react wrapper page and once user picks any template, system will load the selected template into the grapesjs editor. So Please me to get out of this issue. Thanks in advance.

Hi Bro Any update on Grapesjs with react ?

@artf Bro, I want to load the html page which contains css and js for effects (parallax). I worked around 10 days but still I cant able to find whether am doing it right. So can you provide me instructions to do it in correct way. Ultimate goal is to provide set of templates for the user in the react wrapper page and once user picks any template, system will load the selected template into the grapesjs editor. So Please me to get out of this issue. Thanks in advance.

Hi Bro Any update on Grapesjs with react ?

In your react component's componentDidMount() you can initialize the editor like below:

var editor;
componentDidMount{
 editor = grapesjs.init({
      container: "#editor-portal",
      allowScripts: 1,
      height: "100vh",
      canvas: {
        styles: selectedTemplateExternalStyles,
        scripts: selectedTemplateExternalScripts
      },
      plugins: ["gjs-preset-webpage", "grapesjs-custom-code"],
      pluginsOpts: {
        "gjs-preset-webpage": {
          exportOpts: {
            filenamePfx: "hc",
            filename: null,
            addExportBtn: 1,
            btnLabel: "Export to ZIP"
          }
        },
        "grapesjs-custom-code": {}
      },
      storageManager: {
        id: "gjs-",
        type: "remote",
        autosave: 1,
        autoload: 1,
        stepsBeforeSave: 1, // If autosave enabled, indicates how many steps (general changes to structure), need to be done before save. Useful with remoteStorage to reduce remote calls
        urlLoad: API_ROOT + "/template/get/" + this.state.editorType + "/" + this.props.templateId,// Endpoint where to fetch data
        urlStore: API_ROOT + "/template/save/" + this.props.templateId, // Endpoint where to save all stuff
        headers: { "x-apiKey": "XXXXXXXXXXXX" },
        contentTypeJson: true // false: 'x-www-form-urlencoded' // true: application/json; charset=utf-8'   // set contentType paramater of $.ajax
      }
    });
}

I loaded html content from remote storage. Can you tell me how you like to get the html for your editor canvas?