search

GrapesJS / grapesjs

Free and Open source Web Builder Framework. Next generation tool for building templates without coding
https://grapesjs.com
BSD 3-Clause "New" or "Revised" License
22.36k stars 4.05k forks source link

Best way to render a page stored in firestore? #2782

Closed joshbedo closed 4 years ago

joshbedo commented 4 years ago

I've been reading a lot of the documentation and closed issues but I'm a little confused on the best approach to render a page stored in firestore.

For example I have a node.js backend using cloud functions and i was thinking i would basically have an API endpoint that pulls the page from the firestore and renders it. Is this possible? I haven't found many examples on how to render pages from the server.

In short how can i render a page generated in grapejs? So i can show a preview of the page and also have a live website using something generated by grapejs.

ex:

app.get('/pages/:id', (req, res) => {
   const page = firebase.getData(req.params.id); // just an example

   res.send(page);
});
artf commented 4 years ago

Hi Josh, storing and loading templates is described more in details here: https://grapesjs.com/docs/modules/Storage.html#store-and-load-templates

Basically, the editor stores 2 types of data:

In short how can i render a page generated in grapejs?

Well, this depends, I'd expect you to know that at first 😅. For example, if you store the entire object in your firebase document the result might be something like this:

app.get('/pages/:id', (req, res) => {
   const page = firebase.getData(req.params.id); // just an example
   // Just an example of what you can return
   res.send(`<html>
        ...
            <style>${page.css}</style>
        </head>
        <body>
            ${page.html}
        </body>
    <html>`);
});