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


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="MarioFlach" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/MarioFlach/120/24564_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  MarioFlach
                    <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">
								<blockquote>
<p>No I don’t think it was that one, that looks significantly different than what I think I remember seeing (though it’s been near-on a decade now)…</p>
</blockquote>
<p>In the blog posts related to the <a href="http://archive.org" rel="noopener nofollow ugc">archive.org</a> link you shared, the author is referencing following repo: <a href="https://github.com/Vagabond/egitd" rel="noopener nofollow ugc">Vagabond/egitd</a> (which is a fork of the repo I posted lastly).</p>
<blockquote>
<p>But yes, implementing it internally to allow for maximum concurrency is definitely the way to go.</p>
</blockquote>
<p>I did not really implement it because of concurrency, but to have full control over the process and the possibility to add new features (hooks, fine grained permissions, etc.) in future.</p>
<blockquote>
<p>EDIT: Make sure to benchmark the speed.</p>
</blockquote>
<p>This is definitely on my list.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="73108" 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/gitgud-github-clone-entirely-written-in-elixir/12920/12">Post #11</a>
	                </div>
	            </div>
              <div id="likers-container-73108" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="73108"
                     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="73113" data-post-id="73113">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="MarioFlach" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/MarioFlach/120/24564_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  MarioFlach
                    <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>Thanks.</p>
<p>Difficult to tell how many time in took me so far. Well I started the project mid october and was intensively committing code until end of january.</p>
<ul>
<li>Around 150 commits.</li>
<li>Around 4.100 lines of Elixir code.</li>
<li>Around 3.200 lines of C code (where a majority of it is only forked and refactored).</li>
</ul>
<p>But be aware that the project is far from finished!</p>
<p>Currently, only the very core functionality is implemented, Git transport/transfer, basic user and repo schema, very basic authentication. In order to manage users and repositories, you have to use IEx as most Phoenix controller has missing (currently you can list user repos and browse their code). So it’s not really usage…</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="73113" 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/gitgud-github-clone-entirely-written-in-elixir/12920/13">Post #12</a>
	                </div>
	            </div>
              <div id="likers-container-73113" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="73113"
                     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 #12"></div>
  </section>
</div>
    <div class="postbit" id="73118" data-post-id="73118">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="MarioFlach" data-post="13" data-topic="12920">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/marioflach/48/24564_2.png" class="avatar"> MarioFlach:</div>
<blockquote>
<p>But be aware that the project is far from finished!</p>
</blockquote>
</aside>
<p>Yes, first 90% done, other 90% to do, got it - still impressive <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="73118" 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/gitgud-github-clone-entirely-written-in-elixir/12920/14">Post #13</a>
	                </div>
	            </div>
              <div id="likers-container-73118" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="73118"
                     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 #13"></div>
  </section>
</div>
    <div class="postbit" id="74847" data-post-id="74847">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="tme_317" src="/assets/icons/user-9f439610.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  tme_317
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Hi Mario,</p>
<p>What a fascinating project!  Thanks for putting it out there.  Beyond the GitHub-style functionality it has/will have it helps a great people to study code of well architected Elixir/Phoenix OSS apps at scale.</p>
<p>I was looking through it and was curious why you decided to ditch the Vue SPA and rewrite the frontend with EEX rendered React?  I’m guessing you concluded the SPA added unnecessary complexity and was slower to develop?  Were there any other considerations?</p>
<p>I am going the opposite direction on my project rewriting from Vue+EEX → React SPA right now but still don’t have a good feeling for the tradeoffs regarding development speed yet.</p>
<p>Thanks!</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="74847" 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/gitgud-github-clone-entirely-written-in-elixir/12920/15">Post #14</a>
	                </div>
	            </div>
              <div id="likers-container-74847" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="74847"
                     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 #14"></div>
  </section>
</div>
    <div class="postbit" id="74877" data-post-id="74877">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Oh something like this <em>definitely</em> should not be SPA!  If the website is not entirely useful (if not progressively enhanced) without javascript then it has major issues…  o.O</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="74877" 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/gitgud-github-clone-entirely-written-in-elixir/12920/16">Post #15</a>
	                </div>
	            </div>
              <div id="likers-container-74877" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="74877"
                     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 #15"></div>
  </section>
</div>
    <div class="postbit" id="75206" data-post-id="75206">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="MarioFlach" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/MarioFlach/120/24564_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  MarioFlach
                    <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>Thank you <a class="mention" href="/u/tme_317" rel="nofollow">@tme_317</a>. Really appreciate that people take a look into this <img src="https://forum.elixirforum.com/images/emoji/apple/grin.png?v=15" title=":grin:" class="emoji" alt=":grin:" loading="lazy" width="20" height="20"></p>
<p>I started the project for learning purpose only:</p>
<ul>
<li>possibility to implement almost everything with Elixir/Erlang,</li>
<li>multiple network protocols involved,</li>
<li>Git transfer protocol being renown for it complexity (I knew it would be a lot of binary pattern-match fun),</li>
<li>lot’s of C NIFs in order to use <em>libgit2</em> in Elixir/Erlang,</li>
<li>modular design</li>
</ul>
<p>It make me happy that I got so many feedback for this. I published it mainly for people interested in the technical aspect.</p>
<p>As I currently have lot of things going on (2nd baby arriving in a few weeks, house construction and lot’s of work to cover the costs for everything), I’m not sure if the project will be a usable product anytime soon.</p>
<p>Still, I want to provide a very basic user-interface for basic actions such as registration, authentication, repository management and tree browser. Also a more detailed documentation for novice developers to be able to experiment with the project without to much hassle (see <a href="https://github.com/almightycouch/gitgud/issues/15" rel="noopener nofollow ugc">#15</a>).</p>
<blockquote>
<p>I was looking through it and was curious why you decided to ditch the Vue SPA and rewrite the frontend with EEX rendered React? I’m guessing you concluded the SPA added unnecessary complexity and was slower to develop? Were there any other considerations?</p>
</blockquote>
<p>Indeed, I started with the idea of a having a Vue SPA. I’m not really a front-end guy and wanted to give Vue a try. I later decided to go the EEX/HTML path because I was not feeling really well with writting that much Javascript <img src="https://forum.elixirforum.com/images/emoji/apple/sweat_smile.png?v=15" title=":sweat_smile:" class="emoji" alt=":sweat_smile:" loading="lazy" width="20" height="20">. In the end, I will try to render most of the interface using server-side rendered HTML and React/Relay for complex components (branch/tag <code>&lt;select</code>&gt; for example).</p>
<blockquote>
<p>I am going the opposite direction on my project rewriting from Vue+EEX → React SPA right now but still don’t have a good feeling for the tradeoffs regarding development speed yet.</p>
</blockquote>
<p>A while ago, I wrote a small SPA using React/Relay + GraphQL. I was pretty amazed how easy it was to implement once the backend was ready (Absinthe). But still, I’m not a Javascript person and for bigger projects, I prefer to stick to render plain boring HTML from the server…</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="75206" 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/gitgud-github-clone-entirely-written-in-elixir/12920/17">Post #16</a>
	                </div>
	            </div>
              <div id="likers-container-75206" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="75206"
                     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 #16"></div>
  </section>
</div>
    <div class="postbit" id="75216" data-post-id="75216">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="MarioFlach" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/MarioFlach/120/24564_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  MarioFlach
                    <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">
								<blockquote>
<p>Oh something like this definitely should not be SPA! If the website is not entirely useful (if not progressively enhanced) without javascript then it has major issues… o.O</p>
</blockquote>
<p>I’m completely on your side. Indeed I switched from a REST/Vue SPA architecture to a server-side rendered HTML + React/GraphQL for complex components.</p>
<p>Still, for some things, I could argue that it’s better to write specific components with Javascript (complex UX not possible to implement with CSS only, load data only when required, etc.). Github has a bunch of stuff not working well with Javascript disabled.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="75216" 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/gitgud-github-clone-entirely-written-in-elixir/12920/18">Post #17</a>
	                </div>
	            </div>
              <div id="likers-container-75216" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="75216"
                     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 #17"></div>
  </section>
</div>
    <div class="postbit" id="75226" data-post-id="75226">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<aside class="quote no-group" data-username="MarioFlach" data-post="18" data-topic="12920">
<div class="title">
<div class="quote-controls"></div>
<img alt="" width="24" height="24" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/marioflach/48/24564_2.png" class="avatar"> MarioFlach:</div>
<blockquote>
<p>Still, for some things, I could argue that it’s better to write specific components with Javascript (complex UX not possible to implement with CSS only, load data only when required, etc.).</p>
</blockquote>
</aside>
<p>Sure, as long as you can still ‘do’ everything without javascript, even if it is a few extra steps, that is what Progressive Enhancement is.  <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="75226" 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/gitgud-github-clone-entirely-written-in-elixir/12920/19">Post #18</a>
	                </div>
	            </div>
              <div id="likers-container-75226" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="75226"
                     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 #18"></div>
  </section>
</div>
    <div class="postbit" id="75259" data-post-id="75259">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Very tasty <img src="https://forum.elixirforum.com/images/emoji/apple/smiley.png?v=15" title=":smiley:" class="emoji" alt=":smiley:" loading="lazy" width="20" height="20"></p>
<p>Elm is something is can imagine for the UI <img src="https://forum.elixirforum.com/images/emoji/apple/smiley.png?v=15" title=":smiley:" class="emoji" alt=":smiley:" 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="75259" 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/gitgud-github-clone-entirely-written-in-elixir/12920/20">Post #19</a>
	                </div>
	            </div>
              <div id="likers-container-75259" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="75259"
                     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 #19"></div>
  </section>
</div>
    <div class="postbit" id="75263" data-post-id="75263">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="tme_317" src="/assets/icons/user-9f439610.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  tme_317
                  </h3>
		          </div>
						
						</div>
					
					</div>

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<blockquote>
<p>As I currently have lot of things going on (2nd baby arriving in a few weeks, house construction and lot’s of work to cover the costs for everything), I’m not sure if the project will be a usable product anytime soon.</p>
</blockquote>
<p>Congratulations! and definitely understand <img src="https://forum.elixirforum.com/images/emoji/apple/+1.png?v=15" title=":+1:" class="emoji" alt=":+1:" loading="lazy" width="20" height="20"></p>
<blockquote>
<p>Indeed, I started with the idea of a having a Vue SPA. I’m not really a front-end guy and wanted to give Vue a try. I later decided to go the EEX/HTML path because I was not feeling really well with writting that much Javascript <img src="https://forum.elixirforum.com/images/emoji/apple/sweat_smile.png?v=15" title=":sweat_smile:" class="emoji" alt=":sweat_smile:" loading="lazy" width="20" height="20">. In the end, I will try to render most of the interface using server-side rendered HTML and React/Relay for complex components (branch/tag <select> for example).

Yeah, this is exactly how I felt in my first iteration. Nice to know I’m not alone!  I always looked forward to days that were heavy in backend Elixir/Phoenix/Ecto/SQL after spending a few days in JS-land.  Also, I like Vue but felt it messy and too highly coupled sprinkling it in EEX, targeting it by ID, then writing the JS Vue instances in another per-page .js file.
I felt encapsulated components were a cleaner answer but couldn’t figure out how to embed Vue SFCs with EEX (like the way https://github.com/geolessel/react-phoenix or your react_components.ex file works).  Found no examples in the wild doing this with Vue/webpack without going full SPA.  At that point decided to learn/try React components instead.

A while ago, I wrote a small SPA using React/Relay + GraphQL. I was pretty amazed how easy it was to implement once the backend was ready (Absinthe). But still, I’m not a Javascript person and for bigger projects, I prefer to stick to render plain boring HTML from the server…

I realize I’m probably overcomplicating things at the moment which will bite me later, but currently experimenting with a fully decoupled React frontend (written in ReasonML instead of JS) progressively rendered server-side by NextJS talking to Phoenix using GraphQL.  It’s super fast for the client and most things just work even if they have JS disabled!  It’s early and so far, so good, but as a fallback if my experiment fails I’ll probably just follow your lead and go back to EEX rendering with some React components for the complex stuff.
Again, thank you very much for sharing your code and your insights on making this architecture change!</select></p></blockquote> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="75263" 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/gitgud-github-clone-entirely-written-in-elixir/12920/21">Post #20</a>
	                </div>
	            </div>
              <div id="likers-container-75263" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="75263"
                     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 #20"></div>
  </section>
</div>
</template></turbo-stream><turbo-stream action="replace" target="load-more-container"><template><div id="load-more-container" class="load-more-container">
    <a class="load-more-button" data-turbo-stream="true" href="/topics/12920/load_more?page=3">Load more posts (43 remaining)</a>
</div></template></turbo-stream>