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


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Can you do a CRUD or business app with both - Yes you can.<br>
Should you use live view for a static site - NO.<br>
Can you use htmx for it - YES.</p>
<p>htmx is easy to pick up and you can get started in an afternoon.<br>
Liveview has a higher learning curve than htmx. But once you learn it its more enjoyable.</p>
<p>Liveview is more declarative and htmx is more explicit.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="339022" data-batch-url="/posts/batch_likers">
                        3
                      </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/htmx-a-js-library-sort-of-like-liveview/31888/22">Post #21</a>
	                </div>
	            </div>
              <div id="likers-container-339022" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="339022"
                     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 #21"></div>
  </section>
</div>
    <div class="postbit" id="357359" data-post-id="357359">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>There’s currently an <a href="https://forum.devtalk.com/t/ama-with-mark-volkmann-codebar-winter-lit-fest/187449" rel="nofollow">AMA on devtalk</a> with the author of <a href="https://pragprog.com/titles/mvhtmx/server-driven-web-apps-with-htmx/" rel="nofollow">Server-Driven Web Apps with htmx</a> (you can win a copy via the AMA) and after reading its description…</p>
<blockquote>
<p>htmx is a library that adds logic and server interaction to HTML; you get the effect of using a front-end SPA framework without writing front-end code. Use any server-side programming language and framework to build server applications with endpoints that simply return snippets of HTML. Dynamically update portions of the current web page from HTTP responses. Add interactivity with JavaScript and libraries such Alpine and _hyperscript. Make your apps more secure by escaping user-supplied content and specifying a Content Security Policy. Go beyond basic HTTP requests with WebSockets and server-sent events.</p>
</blockquote>
<p>I was curious whether anyone has used it with Phoenix and whether there are any use cases for it <em>alongside</em> LiveView? (Like would you ever want to use both such as in different parts of an app?)</p>
<aside class="quote no-group" data-username="garrison" data-post="18" data-topic="31888">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/letter_avatar_proxy/v4/letter/g/3bc359/48.png" class="avatar"> garrison:</div>
<blockquote>
<p>The programming model is wildly different, and so are the use cases.</p>
</blockquote>
</aside>
<aside class="quote no-group" data-username="garrison" data-post="18" data-topic="31888">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/letter_avatar_proxy/v4/letter/g/3bc359/48.png" class="avatar"> garrison:</div>
<blockquote>
<p>The only other thing to note is that what LiveView does is really only possible on the BEAM, as it can actually handle that many stateful connections without catching fire. The HTMX approach on the other hand is something you can do on any stack (including Phoenix!). But again, they are <em>completely different</em> approaches that are not useful for solving the same problems.</p>
</blockquote>
</aside>
<p>What kind of apps/areas do you think each excel?</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="357359" 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/htmx-a-js-library-sort-of-like-liveview/31888/23">Post #22</a>
	                </div>
	            </div>
              <div id="likers-container-357359" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="357359"
                     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 #22"></div>
  </section>
</div>
    <div class="postbit" id="357568" data-post-id="357568">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="AstonJ" data-post="23" data-topic="31888">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/astonj/48/15_2.png" class="avatar"> AstonJ:</div>
<blockquote>
<p>I was curious whether anyone has used it with Phoenix and whether there are any use cases for it <em>alongside</em> LiveView? (Like would you ever want to use both such as in different parts of an app?)</p>
</blockquote>
</aside>
<p>I did a lot of Unpoly a couple of years ago, which is pretty similar to HTMX (a bit more abstract). I don’t see how useful it would be to mix the two honestly as both would be competing to control the DOM. What I like about HATEOAS or HTML over the wire is that it’s really explicit when things are initiated and how you return the state back to the client.</p>
<p>It’s a fine approach, but to me, the main issue with Unpoly/ HTMX is dealing with really complex state (the URL here being the main driver here), which is effortless with LiveView. There’s an argument to be made about explicitness though, but still.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="357568" data-batch-url="/posts/batch_likers">
                        2
                      </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/htmx-a-js-library-sort-of-like-liveview/31888/24">Post #23</a>
	                </div>
	            </div>
              <div id="likers-container-357568" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="357568"
                     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 #23"></div>
  </section>
</div>
    <div class="postbit" id="381601" data-post-id="381601">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>The allure for things like HTMX (for me) is the simplicity.  But we all know that as you get into more complex front-end apps and problems, the simplicity fades and you’re stuck trying to work around the library to – do something weird – and outside the normal happy path.  That was my (mostly good) experience with Rails apps.</p>
<p>I love the idea(l) of HTMLX of just having your app return snippets of HTML and stitching those in with simple to understand constructs.  (Rails hotwire kind of hit the same buttons for me).</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="381601" 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/htmx-a-js-library-sort-of-like-liveview/31888/25">Post #24</a>
	                </div>
	            </div>
              <div id="likers-container-381601" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="381601"
                     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 #24"></div>
  </section>
</div>
    <div class="postbit" id="381602" data-post-id="381602">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Also.  Found this HTMX + Elixir via reddit =&gt;  <a href="https://forum.elixirforum.com/t/nex-a-minimalist-web-framework-for-indie-hackers-and-startups/73789" class="inline-onebox" rel="nofollow">Nex - A minimalist web framework for indie hackers and startups</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="381602" 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/htmx-a-js-library-sort-of-like-liveview/31888/26">Post #25</a>
	                </div>
	            </div>
              <div id="likers-container-381602" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="381602"
                     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 #25"></div>
  </section>
</div>
    <div class="postbit" id="381728" data-post-id="381728">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Hey! Thanks for sharing Nex <img src="https://forum.elixirforum.com/images/emoji/apple/folded_hands.png?v=15" title=":folded_hands:" class="emoji" alt=":folded_hands:" loading="lazy" width="20" height="20"></p>
<p>I’m the author of Nex. Really glad to see the discussion here about HTMX + Elixir!</p>
<p>The philosophy behind Nex is exactly what you guys are discussing - leveraging HTMX’s simplicity with Elixir’s power, without the complexity overhead. We wanted to make it dead simple for indie hackers to ship fast.</p>
<p>Happy to answer any questions about the framework or the design decisions behind it!</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="381728" 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/htmx-a-js-library-sort-of-like-liveview/31888/27">Post #26</a>
	                </div>
	            </div>
              <div id="likers-container-381728" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="381728"
                     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>