An example
Last updated
Last updated
In the following screenshots, you can see the way one build works. Each build is generated from one line (with 5 comma-delimited lines) inside build.cull.txt The HTML filename given as the first value of that comma-delimited line. For the generation, Cull Front culls together the four filenames specified on that line, after the first HTML filename. In short, these five filenames are present in one line of the build.cull.txt file and in this example, there are no other lines (thus no other builds).
Let us go thru the contents of each of those four files:
The first file ("Tree") explains the tree structure. When you are working with this file, your focus is not distracted by any tree shaped HTML (or indentation as seen in Pug/HAML, etc) The tree is logically formed by Cull Front because you specified what are the direct children of the elements you have given. If you want to experiment with other tree shapes of the HTML, it is as easy as moving the element ID from one element's child list to another one. A similar situation can be seen in the 2nd file ("Elements"). That file explains the regular HTML attributes of each element, again using the element ID. Note: Your eventual HTML may have elements without IDs — for e.g. if you had written some HTML fragment in a template file, and included that as a virtual "t" element.
The HTMX and Alpine files lets you concentrate purely on the HTMX and the AlpineJS respectively. Finally, also take note of the fact that there is no specific "order" in which you give your data in any of the files. The only place where the ordering would be important, is when you specify the direct children of an element in the first file ("Tree") This frees you up in trying to figure out how the HTML would turn out. Of course you would need to occasionally look at the built HTML in a browser but you almost would never have to really look inside the HTML dom tree at all. Cull Front would be doing all that for you quite religiously.