Clojurians Log v2
reagent
How would you structure an app to generate 100% of html from reagent/react? I began my project with a basic template, and am now running into conflicts from index.html generating multiple :head and :body blocks. I'd like to control all of that programmatically, as opposed to sending everything to an "app" div.
Not sure if it is documented somewhere, but I'm quite sure React can't be used to create html, head or body elements. React render target has to be a element inside body.
I assume you’d have to do it server side or do a workaround with something like this: https://www.npmjs.com/package/react-helmet
1👏
I'm not sure what you mean.
String templates (and Hiccup, since you mentioned keywords) that can generate HTML do allow you to avoid adding multiple <head> and <body>.
And Reagent/React do not touch <head> at all. Or <body>, unless that's what you use for your app's container.
Thanks for the help. This is the main reason I asked the question:
I 've been attempting to insert a "common" layout with a menu bar, head logo and such. It appears the conflict stems from attempting to insert a :body twice, once in index.html and next in the inserted hiccup
(defn common [& body]
[:ul {:class "menu_bar"}
[:li {:class "menu_item"}
From what you're saying though, this structure is not the only or best option. How do you generate an initial index.html and more, without creating one manually?
This looks like a solid option, thanks.
1👍When you're using Reagent, there has to be HTML generated outside of it. It cannot generate it for you. I create just a bare-bones HTML myself. If you want to stick to Hiccup, just transform it to text and serve it with your web server.