<turbo-stream action="append" target="posts_list"><template>    <div class="postbit" id="301032" data-post-id="301032">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="rmoorman" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/rmoorman/120/2232_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  rmoorman
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>By the way, I can see somewhat where <a class="mention" href="/u/werner" rel="nofollow">@Werner</a> and <a class="mention" href="/u/conradfr" rel="nofollow">@conradfr</a> are coming from though, having used (and still using) template-inheritance based templates in several applications.</p>
<p>Personally I feel that there is some additional (superficially seemingly unneeded) complexity within the phoenix view implementation due to the concepts of layouts (root and app layout). With jinja2-style templates, there is just one template entry point/file. It is only within that template file that we usually determine which “layout” we use, and the structure of the whole HTML document is determined only based on that template.</p>
<p>Having to do a put_layout or setting the root layout somewhere in the plug pipeline feels a bit out of place when you are just concerned with rendering a the HTML document based on a template.<br>
Suddenly there are three things that determine the document structure as a whole, and those are not really that co-located with the rest of the view/template/component stuff. It somehow feels a bit like mixing and spreading concerns. The router is for routing, the controller for calling your logic and returning html/json or whatever, and the view for the intricacies of building up the structure of an HTML document.</p>
<p>Luckily we now have components with slots as <a class="mention" href="/u/josevalim" rel="nofollow">@josevalim</a> mentioned though, and coming to think of it, is the root/app layout thing really still needed? I mean, couldn’t a layout just be wholly defined in a <code>&lt;.base_layout /&gt;</code> component (including the <code>html</code>, <code>head</code> and <code>body</code> wrapping things needed for e.g. liveview)?<br>
Then, all the things about the html output could be determined through that component (e.g. slots for additional js/css things based on the template) and it’s children.<br>
Additionally, the view implementation could be cleaned up a bit because <code>put_layout/2</code>, <code>plug :put_root_layout, html: {MyWeb.Layouts, :root}</code> and friends are not needed anymore.</p>
<p>Or would this be too far fetched or maybe even blatantly wrong thing to aspire <a class="mention" href="/u/josevalim" rel="nofollow">@josevalim</a> (or <a class="mention" href="/u/chrismccord" rel="nofollow">@chrismccord</a>)?</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="301032" data-batch-url="/posts/batch_likers">
                        1
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/using-function-components-for-template-inheritance/49678/12">Post #11</a>
	                </div>
	            </div>
              <div id="likers-container-301032" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="301032"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-standard-post cat-standard-post" title="Post #11"></div>
  </section>
</div>
    <div class="postbit" id="301394" data-post-id="301394">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="rmoorman" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/rmoorman/120/2232_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  rmoorman
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>For reference, I made a related proposal over here: <a href="https://forum.elixirforum.com/t/remove-view-layouts-in-favor-of-function-components/58290" rel="nofollow">Remove view layouts in favor of function components</a></p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="301394" data-batch-url="/posts/batch_likers">
                        0
                      </span>
                      <!-- <span class="thread-count js-solved-indicator" title="Marked as solution"></span> -->
	                </div>
	                <div class="go-to-post">
	                  <a title="Go to post" alt="Go to post" href="https://forum.elixirforum.com/t/using-function-components-for-template-inheritance/49678/13">Post #12</a>
	                </div>
	            </div>
              <div id="likers-container-301394" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="301394"
                     data-batch-url="/posts/batch_likers">
                  <div class="post-likers"></div>
                </div>
              </div>
	        </div>
			

    </div>

    <div class="triangle-top-right type-last-post cat-last-post" title="Last post!"></div>
  </section>
</div>
</template></turbo-stream><turbo-stream action="replace" target="load-more-container"><template><div id="load-more-container" class="load-more-container">
    <span class="all-loaded">— All posts loaded —</span>
</div></template></turbo-stream>