Pinchflat

Local-First Apps: TanStack DB + Phoenix Sync (Part 1)

Media Tasks
Actions

Raw Attributes

Source: Code and Stuff
  • livestream: false
  • upload_date_index: 99
  • nfo_filepath: /downloads/Code and Stuff/Season 2026/s2026e010399 - Local-First Apps： TanStack DB + Phoenix Sync (Part 1).nfo
  • description: In this video, I build a local-first voting app called Food Captain using TanStack DB. This is Part 1 of a two-part series—we'll add Phoenix Sync in Part 2 to make it multiplayer. What's covered: - What is TanStack DB? - Setting up collections with the localStorage adapter - Using live queries to reactively render UI from collections - Implementing CRUD operations (insert, update, delete) with schema validation - Managing optimistic updates with manual transactions - Building a voting interface with complex state management - Preparing for server synchronization in Part 2 This project goes beyond todo apps to show realistic patterns you'd use in production applications. Staged edits, transaction rollbacks, multi-step forms, and complex UI state that works local-first. Links Screen recording software I use (affiliate): https://screen.studio/@Yy75o Demo repository: https://github.com/ChristianAlexander/food_captain Changes from this video: https://github.com/ChristianAlexander/food_captain/pull/1 TanStack DB documentation: https://tanstack.com/db Phoenix Sync: https://hexdocs.pm/phoenix_sync ElectricSQL: https://electric-sql.com Timestamps What are we doing? - 00:00 What is TanStack DB? - 01:34 Read and Write - 03:27 Manual Transactions - 10:55 Advanced Transactions - 21:24 What's next? - 27:29
  • id: 59540
  • uploaded_at: 2026-01-03T00:56:01Z
  • inserted_at: 2026-01-03T01:03:44Z
  • uuid: 16a0a34c-51da-41cb-9555-bfa26e668dac
  • last_error:
  • playlist_index: 0
  • short_form_content: false
  • predicted_media_filepath: /downloads/Code and Stuff/Season 2026/s2026e010399 - Local-First Apps： TanStack DB + Phoenix Sync (Part 1).mp4
  • media_filepath: /downloads/Code and Stuff/Season 2026/s2026e010399 - Local-First Apps： TanStack DB + Phoenix Sync (Part 1).mp4
  • original_url: https://www.youtube.com/watch?v=2J48c2sukbo
  • updated_at: 2026-01-03T01:06:17Z
  • media_redownloaded_at:
  • source_id: 24
  • title: Local-First Apps: TanStack DB + Phoenix Sync (Part 1)
  • matching_search_term:
  • media_downloaded_at: 2026-01-03T01:06:09Z
  • prevent_download: false
  • thumbnail_filepath: /downloads/Code and Stuff/Season 2026/s2026e010399 - Local-First Apps： TanStack DB + Phoenix Sync (Part 1)-thumb.jpg
  • media_size_bytes: 125252235
  • duration_seconds: 1682
  • metadata_filepath: /downloads/Code and Stuff/Season 2026/s2026e010399 - Local-First Apps： TanStack DB + Phoenix Sync (Part 1).info.json
  • media_id: 2J48c2sukbo
  • prevent_culling: false
  • subtitle_filepaths: en/downloads/Code and Stuff/Season 2026/s2026e010399 - Local-First Apps： TanStack DB + Phoenix Sync (Part 1).en.srt
  • culled_at:
Worker
State
Scheduled At
Pinchflat.Downloading.MediaDownloadWorker completed