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


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Indeed, I feel immutability and the functional nature of elixir gives a huge advantage over JS.<br>
Type safety is one thing I wish elixir did have - we have dialyzer etc, but it doesn’t really compare. I am always interested in projects like gleam <a href="https://gleam.run/" rel="noopener nofollow ugc">https://gleam.run/</a> that aim to bring this to the beam.<br>
Still, for what’s out there now, elixir is still my go to for its productivity, tooling, libraries, reliability and fun <img src="https://forum.elixirforum.com/images/emoji/apple/slight_smile.png?v=15" title=":slight_smile:" class="emoji" alt=":slight_smile:" loading="lazy" width="20" height="20"></p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="143744" 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/which-ui-framework-you-prefer-to-use-along-with-phoenix-api-back-end/25334/22">Post #21</a>
	                </div>
	            </div>
              <div id="likers-container-143744" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="143744"
                     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="143785" data-post-id="143785">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="bjunc" data-post="12" data-topic="25334">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bjunc/48/16781_2.png" class="avatar"> bjunc:</div>
<blockquote>
<p>Phoenuxt</p>
</blockquote>
</aside>
<p>Evercam is also a happy Phoenuxt User.</p>
<p>(Though we’re still in the process of migrating and haven’t moved to GraphQL, yet)</p>
<p><a href="https://github.com/evercam/evercam-dashboardv2" class="onebox" target="_blank" rel="noopener nofollow ugc">https://github.com/evercam/evercam-dashboardv2</a></p>
<p>M</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="143785" 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/which-ui-framework-you-prefer-to-use-along-with-phoenix-api-back-end/25334/23">Post #22</a>
	                </div>
	            </div>
              <div id="likers-container-143785" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="143785"
                     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="144278" data-post-id="144278">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="jimmycoyne" data-post="19" data-topic="25334">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/jimmycoyne/48/1391_2.png" class="avatar"> jimmycoyne:</div>
<blockquote>
<p>Do you find the lack of type checking is less of an issue with Elixir compared to JS (maybe due to its functional nature or immutability ) ?</p>
</blockquote>
</aside>
<p>I think the immutability helps but it’s mostly pattern matching. Function heads can match the specific shape of expected data!</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="144278" 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/which-ui-framework-you-prefer-to-use-along-with-phoenix-api-back-end/25334/25">Post #24</a>
	                </div>
	            </div>
              <div id="likers-container-144278" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="144278"
                     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="144379" data-post-id="144379">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>So what’s the best way to include independent Vue apps on different pages? Do you create a new entry in your webpack config for each one, and include the output in a script tag in the template, or just import all the Vue stuff into <code>app.js</code>? Or is there another way. I’ve always been confused about the best practice for that.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="144379" 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/which-ui-framework-you-prefer-to-use-along-with-phoenix-api-back-end/25334/26">Post #25</a>
	                </div>
	            </div>
              <div id="likers-container-144379" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="144379"
                     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="144390" data-post-id="144390">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="acrolink" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/acrolink/120/8985_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  acrolink
                    <span class="op-star" title="Thread Starter">
                      <img alt="OP" class="op-star-icon" src="/assets/thread-icons/thread-icon-thread-starter-df91e872.png" />
                    </span>
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>I simply use a decoupled pattern. Phoenix as API backend only and Vue on frontend.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="144390" 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/which-ui-framework-you-prefer-to-use-along-with-phoenix-api-back-end/25334/27">Post #26</a>
	                </div>
	            </div>
              <div id="likers-container-144390" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="144390"
                     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 #26"></div>
  </section>
</div>
    <div class="postbit" id="144402" data-post-id="144402">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="bonzobavaria" data-post="26" data-topic="25334">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/bonzobavaria/48/34524_2.png" class="avatar"> bonzobavaria:</div>
<blockquote>
<p>the best practice</p>
</blockquote>
</aside>
<p>There is no one “best practice”. There are a lot of ways to do it and different projects lend themselves to different approaches.</p>
<p>Since I generally care about SEO and want to keep things simple, I like the approach common in the Laravel community—embedding Vue components directly in the (eex) template files. You can pass data as <code>props</code> to the component. This won’t disrupt the page and its assets and you can easily use your normal CSS and JS in addition to Vue. This also keeps things simple in terms of sessions and everything else Phoenix provides for an app.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="144402" data-batch-url="/posts/batch_likers">
                        4
                      </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/which-ui-framework-you-prefer-to-use-along-with-phoenix-api-back-end/25334/28">Post #27</a>
	                </div>
	            </div>
              <div id="likers-container-144402" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="144402"
                     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>