In this article I start from what built in Step-by-Step Tutorial to Build a Phoenix App that Supports User Upload. We see how to integrate ImageMagick and the Mogrify wrapper in the last article Phoenix app, to create thumbnails for image and PDF files.
As always any kind of feedback or question is more than welcome! 
in the previous articles we’ve seen how to build a small Phoenix app that processes user uploads, creating thumbnails for images and PDFs.
The problem with the current app is that nothing is shown during the upload, which is maybe ok while testing the app in localhost (the upload was fast also with big files). But in the real world an upload could last minutes.. or even hours.
So in this part we focus on the front-end and see how to use JavaScript to upload a file while animating a progress bar.
At first we see how to add jQuery to our Phoenix app and using it in our JavaScript files. We then see how to use jQuery to upload a file and listen to progress events to update an HTML5 progress bar.
Learn about custom ecto types.
https://invictusbytes.blogspot.com/2019/06/how-to-create-elixir-ecto-custom-type.html
Phoenix LiveView pushState support – Change the URL without refreshing the page
)
t’s now possible to try the LiveView pushState support! Just few days ago Chris McCord (creator of Phoenix) made it available in the LiveView master branch!
But.. What is pushState? and why can be useful?
With Phoenix LiveView we can easily update parts of the page without having to change the location, refreshing the page or directly use JavaScript.
But when the page’s content changes, the URL remains the same, making it difficult for a user to bookmark or share the current page state.
The LiveView pushState support solves exactly this - while changing the page content we can now dynamically update the URL without a page refresh.
I started a series about Phoenix Internals a couple of months ago, and just published part two! This one covers routers: The Phoenix Router | Griffin Byatt
live_link
A quick article (and screencast) still related to the LiveView pushState. The previous one was mainly focused on live_redirect .
We now see how to refactor the code with live_link getting simpler code and less messages exchanged between LiveView and our browser.
LiveView doesn’t support JavaScript interop at the moment (but it’s a planned feature), so in this article we see how to come up with a workaround to make LiveView playing together with a JavaScript library like Select2.
We see how to take advantage of phx:update events, which LiveView dispatches every time it updates the DOM. Then we see how to send events to the server using liveSocket.
I’ve had similar issue keeping a JS library component initialized but have been too lazy to figure it out! Thank you for posting!
Hey everyone 
After few busy months, I’m super happy to be back posting content weekly, starting with the first of a series of episodes for who wants to explore Phoenix LiveView and start building real-time web apps.