Listing tutorials

Published 26 Dec - 2020

Bootstrap 5 and Phoenix LiveView

bootstrapformsmodalliveview

Even though a large part of the Phoenix community seem to embrace Tailwind, there are still a lot that prefer Bootstrap CSS framework. And with Boos..

Go to tutorial

Published 23 Dec - 2020

Getting Started with Phoenix and LiveView

phoenixliveview

This guide to getting started with Phoenix covers getting up and running with Elixir and Phoenix. This is a direct conversion of the Getting started..

Go to tutorial

Published 09 Nov - 2020

Add bulk actions in Phoenix LiveView

bulkliveviewtable

In this tutorial, I have a list of products. One common feature for a table of records is to perform some sort of bulk actions. As an example in thi..

Go to tutorial

Published 23 Sep - 2020

Setup Stripe with Phoenix LiveView

stripeliveviewformspayments

In this tutorial, I will go through how I setup Stripe payments with Phoenix and LiveView to make your app prepared for accepting payments. The tuto..

Go to tutorial

Published 02 Sep - 2020

Table sorting with Ecto and LiveView

sortingectoliveview

A very common or even mandatory feature in e-commerce stores is the ability to sort a list of products by attributes. This is easy enough and a good..

Go to tutorial

Published 31 Aug - 2020

Fuzzy find with Ecto in Phoenix LiveView

fuzzyseachsearchliveviewecto

Fuzzy find is both a simple and a complex thing. Even though though it's simple to implement, its hard to get right from a UX perspective. Luckily, ..

Go to tutorial

Published 07 Aug - 2020

Phoenix Presence with Phoenix LiveView

presenceliveview

A lot of apps have some sort of notification on if users are online or not. Phoenix makes it easy to build that with the built in Phoenix Presence. ..

Go to tutorial

Published 30 Jul - 2020

Getting started with GraphQL and Absinthe in Phoenix

phoenixapiabsinthegraphql

In the last tutorial, there I had an app with a simple rest api that was authenticated with Guardian and Json Web Token. In this tutorial, I will go..

Go to tutorial

Published 22 Jul - 2020

Combining authentication solutions with Guardian and Phx Gen Auth

apiguardianauthentication

Many web apps have both a web interface and an Json api. When the normal web app has a classic session based authentication, an API need something l..

Go to tutorial

Published 11 Jul - 2020

Create a reusable modal with LiveView Component

liveviewphoenixmodalalpinejstailwind

To reduce duplicity and complexity in your apps, Phoenix LiveView comes with the possibility to use reusable components. Each component can have its..

Go to tutorial