phoenix-liveview-counter-tutorial

🤯 beginners tutorial building a real time counter in Phoenix + LiveView⚡️ Learn the fundamentals from first principals so you can make something amazing! 🚀
https://github.com/dwyl/phoenix-liveview-counter-tutorial

Last synced: 22 days ago
JSON representation

Bonus Level: Use a `LiveView Component` (Optional)

Add More Tests!

`Phoenix.LiveComponent`

How many `people` are viewing the Counter?

Update the Tests for `GenServer` State

`Presence`

`LiveView`?

More Tests!

Update the Tests for `GenServer` State

Moving state out of the `LiveView`

Create a `LiveView Component`

`GenServer`

`Phoenix LiveView` for Web Developers Who Don't know `Elixir`

Update the Tests for `GenServer` State

Prerequisites: What you Need _Before_ You Start 📝

Step 0: Run the _Finished_ Counter App on your `localhost` 🏃‍

_Download_ the Dependencies

patient

Step 2: Create the `counter.ex` File

_Explanation_ of the Code

Step 4: _Share_ State Between Clients!

Checkpoint: Run It!

`localhost:4000`

ecosyste.ms

Data

Tools

Indexes

Applications

Experiments

Awesome

phoenix-liveview-counter-tutorial

Bonus Level: Use a `LiveView Component` (Optional)

Add More Tests!

How many `people` are viewing the Counter?

Update the Tests for `GenServer` State

`LiveView`?

More Tests!

Update the Tests for `GenServer` State

Moving state out of the `LiveView`

Create a `LiveView Component`

`Phoenix LiveView` for Web Developers Who Don't know `Elixir`

Update the Tests for `GenServer` State

Prerequisites: What you Need _Before_ You Start 📝

Step 0: Run the _Finished_ Counter App on your `localhost` 🏃‍

_Download_ the Dependencies

Step 2: Create the `counter.ex` File

_Explanation_ of the Code

Step 4: _Share_ State Between Clients!

Checkpoint: Run It!

Code Explanation

Recap: Working Counter _Without_ Writing `JavaScript`!