DEV Community

Discussion on: FrontEnd Workflow help

Collapse
 
shiftyp profile image
Ryan Kahn (he/him)

How do these components (Header and Footer) render into a single page? Tools like webpack are usually one of a few tools you end up using to bring components together into a page, and there are many possible answers here depending on what your code is. What markup is in header.html, and what functionality is in header.js? What is your expectation about how these come together in a webpage?

Collapse
 
bairrada97 profile image
bairrada97

Imagine just a empty header tag, that I want to render on index.html, but I want to have a file for that, that's my header.html.

Right now I can have a lot of .js files that will compile in a bundle, and for Scss too, but I cant to that with html.

I just want to work with modules and components and I'm looking for a way to put them together in pages with webpack.

Collapse
 
shiftyp profile image
Ryan Kahn (he/him) • Edited

HTML, by itself, isn't composable in that way. Components are usually built in Javascript or something you can turn into Javascript. This is because in order to render they need access to the DOM to change the page dynamically. They also usually require some additional framework code to run, otherwise they would be more complicated individually. There are some divergent directions I could recommend, but I'd want to know what you think of the above first.