tonydangblog/liveview-svelte-pwa

Local-First LiveView Svelte ToDo App

Local-First LiveView Svelte ToDo App

This to-do app is a demo of an installable Phoenix Progressive Web App (PWA) that can sync real-time across multiple devices while also being able to work locally offline.

Video Walkthrough

Demo

A live demo of the app can be found here.

Technologies used

• Phoenix LiveView, PubSub, and Ecto/PostgreSQL for real-time syncing and data persistence.
• Svelte (via live_svelte) for the frontend UI and state management.
• Service Workers, Web Storage, and IndexedDB (via y-indexeddb) for offline support.
• CRDTs (via Yjs) to resolve conflicts between distributed app states.

Inspired by

• Wout De Puysseleir - LiveSvelte - Render Svelte directly into Phoenix LiveView with E2E reactivity.
• Ryan Cooke - Ryan Cooke - E2E Reactivity - using Svelte with Phoenix LiveView
• Daniils Petrovs - SvelteKit: From landing page to offline PWAs

Contact

Created by Tony Dang. Please feel free send any questions or feedback to [email protected].

liveview-svelte-pwa's Issues

There is no UserStates module in the project.

↳ :elixir_compiler_1.FILE/1, at: priv/repo/seeds.exs:18
** (Protocol.UndefinedError) protocol Ecto.Queryable not implemented for LiveViewSvelteOfflineDemo.UserStates.UserState of type Atom, the given module does not exist. This protocol is implemented for the following type(s): Atom, BitString, Ecto.Query, Ecto.SubQuery, Tuple
(ecto 3.11.0) lib/ecto/queryable.ex:41: Ecto.Queryable.Atom.to_query/1
(ecto 3.11.0) lib/ecto/repo/queryable.ex:184: Ecto.Repo.Queryable.delete_all/3
priv/repo/seeds.exs:19: (file)
(elixir 1.16.1) lib/code.ex:1485: Code.require_file/2
(mix 1.16.1) lib/mix/tasks/run.ex:146: Mix.Tasks.Run.run/5
(mix 1.16.1) lib/mix/tasks/run.ex:85: Mix.Tasks.Run.run/1
(mix 1.16.1) lib/mix/task.ex:478: anonymous fn/3 in Mix.Task.run_task/5
(mix 1.16.1) lib/mix/task.ex:544: Mix.Task.run_alias/6
(mix 1.16.1) lib/mix/cli.ex:96: Mix.CLI.run_task/2
/home/alex/.asdf/installs/elixir/1.16.1-otp-26/bin/mix:2: (file)