Made with 💚💙💜💛❤️ by @dbernheisel

If you're interested in the source code, check it out . Have any ideas on what would be helpful here? Drop me a line by starting a discussion on GitHub .

What does this site use?

How does Phoenix LiveView make this awesome?

Before we get to Phoenix LiveView, let's start at the beginning:

  • Elixir is an awesome language to work with to write web applications (and more like embedded devices!).
  • Phoenix is a wonderful web framework which is quickly productive for handling web requests.
  • Phoenix LiveView is a welcome addition that enables normally-backend-developers like me produce reactive Web UIs like the Regex Tester without having to split the codebase into "backend" and "frontend" so much. This isn't a knock on frontend frameworks; this is just another highly-efficient tool in the developer's toolbelt to rapidly produce good web applications.

Phoenix LiveView is performing server-side HTML diffing before sending it over the wire to your browser. "The wire" in this case is not AJAX or even an HTTP request, no, instead it's using websockets. Once the changed bits are received in the browser, Phoenix LiveView's JavaScript (with a lot of help from morphdom) is patching those changed bits to the HTML DOM, rendering what you see.

How do you deploy the app?

We're using fly.io . When it's time to deploy, all we do is commit to the main branch and a GitHub Action will run flyctl deploy automatically if tests pass.

Since it costs money, it would be wonderful if you considered sponsoring us at GitHub.

While I have you here...

Check out Thinking Elixir and the podcast .

Remember to stay positive!