Docs: how to get a copy of page react code before rendering to client side ?

[ys-oo]

What is the improvement or update you wish to see?

so i need a way to export a copy of page react code , so far I'm able to get a copy of the final HTML, but I couldn't find any way that i can copy the current page react code to a file , this is needed as I'm working on website builder that give the user ability to export Next.js code rather than HTML only. any help is appreciated and thank you .

Is there any context that might help us understand?

If you take a look at something like Builder.io or any website builder, a few of them provide their users with the ability to obtain the React code and components of the built page

Does the docs page already exist? Please link to it.

No response

[DIEGOHORVATTI]

I believe it's something close to that

import ReactDOMServer from 'react-dom/server';

const getWebComponent = () => {
    const reactCode = ReactDOMServer.renderToString(<App />) // Replace App with your root component

    const fileBlob = new Blob([reactCode], {
      type: 'text/javascript'
    })

    return URL.createObjectURL(fileBlob)
  }

  <a
    download="App.json"
    href={getGTMServer()}
    startIcon={<Iconify icon="line-md:arrow-align-bottom" />}
    > 
       GTM Server
   </a>

[ys-oo]

I believe it's something close to that

import ReactDOMServer from 'react-dom/server';

const getWebComponent = () => {
    const reactCode = ReactDOMServer.renderToString(<App />) // Replace App with your root component

    const fileBlob = new Blob([reactCode], {
      type: 'text/javascript'
    })

    return URL.createObjectURL(fileBlob)
  }

  <a
    download="App.json"
    href={getGTMServer()}
    startIcon={<Iconify icon="line-md:arrow-align-bottom" />}
    > 
       GTM Server
   </a>

i think so, currently I'm reading the source code of react-dom , thank you <3

[delbaoliveira]

Hi @ys-oo, does the answer above help?

This is outside the scope of our docs at the moment, so I'll close the issue, but you can continue discussing it here.

[ys-oo]

Hi @ys-oo, does the answer above help?

This is outside the scope of our docs at the moment, so I'll close the issue, but you can continue discussing it here.

yeah i think closing this issue is wise , I'm currently searching every open source code which i think will help me to answer my question in full detail , and when i get the full answer i will post it here and maybe open a pull request for next js docs , thanks <3