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


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="mikeclark" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/mikeclark/120/5163_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  mikeclark
                    <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! It was fun coming up with that line.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="176980" 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/starter-phoenix-liveview-course-pragmatic-studio-free/31291/23">Post #22</a>
	                </div>
	            </div>
              <div id="likers-container-176980" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="176980"
                     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="177106" data-post-id="177106">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Great, thank you. I just bought your other Elixir course partially to thank for this free one <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> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="177106" 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/starter-phoenix-liveview-course-pragmatic-studio-free/31291/24">Post #23</a>
	                </div>
	            </div>
              <div id="likers-container-177106" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="177106"
                     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="177139" data-post-id="177139">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="mikeclark" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/mikeclark/120/5163_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  mikeclark
                    <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! That’s very thoughtful. We appreciate the support. I hope you enjoy the Elixir course. <img src="https://forum.elixirforum.com/images/emoji/apple/grinning_face.png?v=15" title=":grinning_face:" class="emoji" alt=":grinning_face:" 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="177139" 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/starter-phoenix-liveview-course-pragmatic-studio-free/31291/25">Post #24</a>
	                </div>
	            </div>
              <div id="likers-container-177139" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="177139"
                     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="185725" data-post-id="185725">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>This course is really well done.  Just watched video 16 (real-time updates) and it cleared so much up for me.  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="185725" 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/starter-phoenix-liveview-course-pragmatic-studio-free/31291/26">Post #25</a>
	                </div>
	            </div>
              <div id="likers-container-185725" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="185725"
                     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="185729" data-post-id="185729">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>I’m not really liking this approach, because you just made your liveview responsible for the validation knowledge. I would move it out to a separated module.</p>
<pre data-code-wrap="elixir"><code class="lang-elixir">defmodule PorchLight do

  def up(brightness) do
    # your case statement. Or multiple up functions with pattern match.
    # returns updated brightness
  end

end
</code></pre>
<p>In the LiveView you just have:</p>
<pre data-code-wrap="elixir"><code class="lang-elixir">def handle_event("up", _unsigned_params, socket) do
   {:noreply, update(socket, :brightness, &amp;PorchLight.up/1)}
end
</code></pre>
<p>You can also make the <code>PorchLight</code> a struct with more complex structure. Anyway, the point is that now you can use this module anywhere, regardless if you are rendring with LiveView, just HTML, JSON or whatever. It can also be tested better in isolation because the function is pure.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="185729" 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/starter-phoenix-liveview-course-pragmatic-studio-free/31291/27">Post #26</a>
	                </div>
	            </div>
              <div id="likers-container-185729" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="185729"
                     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="185778" data-post-id="185778">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="mikeclark" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/mikeclark/120/5163_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  mikeclark
                    <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>In general, I agree that it’s better to put the porch light behavior in a separate module independent of LiveView. However, since this is the very first example in the course, we wanted to keep it really simple and focused in one file without any indirection.</p>
<p>You’ll find that in subsequent videos we’re careful to extract this type of logic into separate modules. And as we get into using Ecto, we rely heavily on Phoenix context modules as a boundary layer.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="185778" 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/starter-phoenix-liveview-course-pragmatic-studio-free/31291/28">Post #27</a>
	                </div>
	            </div>
              <div id="likers-container-185778" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="185778"
                     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 #27"></div>
  </section>
</div>
    <div class="postbit" id="185779" data-post-id="185779">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Oh, I didn’t mean it as a critique of the course. To teach LiveView it is a perfect implementation. I’m a big fan actually, currently on lesson 11. Huge thanks! <img src="https://forum.elixirforum.com/images/emoji/apple/heart.png?v=15" title=":heart:" class="emoji" alt=":heart:" loading="lazy" width="20" height="20"></p>
<p>My comment was only in context of how to improve the particular code snippet.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="185779" 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/starter-phoenix-liveview-course-pragmatic-studio-free/31291/29">Post #28</a>
	                </div>
	            </div>
              <div id="likers-container-185779" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="185779"
                     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 #28"></div>
  </section>
</div>
    <div class="postbit" id="188043" data-post-id="188043">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>Thank you for those LiveView video tutorials. Those are truly amazing.</p>
<p>One remark: one thing lacking are the dates of the release of each video. Because I can’t know at which pace those are released (i.e. I don’t even know when was the last video released, which makes it hard to take a guess on the next video release).</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="188043" 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/starter-phoenix-liveview-course-pragmatic-studio-free/31291/30">Post #29</a>
	                </div>
	            </div>
              <div id="likers-container-188043" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="188043"
                     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 #29"></div>
  </section>
</div>
    <div class="postbit" id="188127" data-post-id="188127">
  <section>
    <div class="post-wrap">


					<div class="post-header">
		        <div class="user-avatar">
		          <img alt="mikeclark" src="https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/mikeclark/120/5163_2.png" width="120" height="120" />
		        </div>
					
						<div class="user-details">
		          <div class="user-name">
		            <h3>
                  mikeclark
                    <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 for your kind words!</p>
<p>You make a good point. We released the first 7 videos in late April, and then generally released a new video every couple weeks. But you would only know that if you were on the mailing list where we sent updates. So going forward I’ll be mindful to give better indications on the course page.</p>
<p>Thanks for the feedback!</p>
<p>Mike</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="188127" 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/starter-phoenix-liveview-course-pragmatic-studio-free/31291/31">Post #30</a>
	                </div>
	            </div>
              <div id="likers-container-188127" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="188127"
                     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 #30"></div>
  </section>
</div>
    <div class="postbit" id="188529" data-post-id="188529">
  <section>
    <div class="post-wrap">


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

	        <div class="thread-main">
	            <div class="post-body" data-turbo="false">
								<p>I noticed something weird in <code>page_live.ex</code>.</p>
<p>In the <code>handle_event</code> for “suggest”, there is the following return line:</p>
<pre data-code-wrap="elixir"><code class="lang-elixir">{:noreply, assign(socket, results: search(query), query: query)}
</code></pre>
<p>But I can even type “hello” for <code>:query</code>, like so:</p>
<pre data-code-wrap="elixir"><code class="lang-elixir">{:noreply, assign(socket, results: search(query), query: "hello")}
</code></pre>
<p>And the input field won’t change its text even though its value should come from assigns <code>:query</code>:</p>
<pre data-code-wrap="elixir"><code class="lang-elixir">&lt;input type="text" name="q" value="&lt;%= @query %&gt;" placeholder="Live dependency search" list="results" autocomplete="off"/&gt;
</code></pre>
<p>I could not find a way to programmatically change the input field’s text.</p>
<p>There’s something I miss there…</p>
<p>Print screen:</p>
<pre data-code-wrap="elixir"><code class="lang-elixir">This is the value of @query: "&lt;%= @query %&gt;"&lt;br&gt;
&lt;input type="text" name="q" value="&lt;%= @query %&gt;" placeholder="Live dependency search" list="results" autocomplete="off"/&gt;
</code></pre>
<p></p><div class="lightbox-wrapper"><a class="lightbox" href="https://forum.elixirforum.com/uploads/default/original/3X/9/b/9b21c94f394ba61ea351dff872a85890f5eed725.png" data-download-href="https://forum.elixirforum.com/uploads/default/9b21c94f394ba61ea351dff872a85890f5eed725" title="2020-09-07_12-56-27" rel="nofollow"><img src="https://forum.elixirforum.com/uploads/default/original/3X/9/b/9b21c94f394ba61ea351dff872a85890f5eed725.png" alt="2020-09-07_12-56-27" data-base62-sha1="m8motTicpxRzIPXYI3Zwuq3pHMN" width="434" height="86"><div class="meta"><svg class="fa d-icon d-icon-far-image svg-icon" aria-hidden="true"><use href="#far-image"></use></svg><span class="filename">2020-09-07_12-56-27</span><span class="informations">579×115 4.34 KB</span><svg class="fa d-icon d-icon-discourse-expand svg-icon" aria-hidden="true"><use href="#discourse-expand"></use></svg></div></a></div><p></p>
<p>EDIT: not being able to edit while the text input has focus seems normal:</p>
<blockquote>
<p>For any given input with focus, LiveView will never overwrite the input’s current value, even if it deviates from the server’s rendered updates.</p>
</blockquote>
<p>I actually wonder then if we really need that state <code>:query</code>, I don’t see what it’s for.</p> 
	            </div>

	            <div class="base-line">
	                <div class="thread-counters">
	                    <span class="thread-count count-likes js-likers-trigger" title="Likes" data-post-id="188529" 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/starter-phoenix-liveview-course-pragmatic-studio-free/31291/32">Post #31</a>
	                </div>
	            </div>
              <div id="likers-container-188529" 
                   class="likers-container"
                   data-first-post="false"
                   data-batch-url="/posts/batch_likers">
                   <div class="likers-placeholder" 
                     data-likers-post-id="188529"
                     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 #31"></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/31291/load_more?page=4">Load more posts (1 remaining)</a>
</div></template></turbo-stream>