Criei meu primeiro app local-first com ElectricSQL e Tanstack DB

Links importantes 👇
• CONVITE: Participe da live coding HOJE (22/05), às 19h e aprenda na prática, a criar um app Full-Stack do zero usando Remix (React Router V7) e Prisma https://rseat.in/live_coding2_rocketseat
• Projeto no Git https://github.com/rocketseat-content/youtube-electric-tanstack-db
• TanStack db https://github.com/TanStack/db
• electric https://electric-sql.com/
• X https://x.com/dieegosf

Quer aprender a construir um app Local First e Offline First que funcione totalmente offline e sincronize dados em tempo real? Neste vídeo, o Diego Fernandes mostra passo a passo de como criar, usando Electric SQL, Tanstack DB (TStackDB) e Drizzle ORM, ferramentas modernas que facilitam o desenvolvimento de apps rápidos, seguros e escaláveis.
Entenda os conceitos essenciais de Local First apps, a diferença para apps Offline First, além de aprender como implementar a sincronização de dados em tempo real com controle de acesso via JWT (JSON Web Token). Veja também sobre a normalização de dados no frontend, consultas com useLiveQuery para atualizar informações ao vivo, e estratégias de interface otimista para melhorar a experiência do usuário em cenários com latência ou conexão instável.

Fique por dentro do futuro do desenvolvimento Local First com Electric SQL e Tanstack DB 👇

00:00 - 00:14 — Qual a diferença entre Local First e Offline First Apps?
00:14 - 00:36 — O que são Local First Apps?
00:33 - 01:02 — Quais são as vantagens e desafios de Local First?
01:03 - 01:38 — Quais são as tecnologias e ferramentas emergentes (Electric SQL, Zero)?
02:01 - 02:43 — Veja Local First vs Offline First + Armazenamento local
02:44 - 03:18 — Como fazer um protótipo com Electric SQL e TStackDB?
04:04 - 05:30 — O que é Electric SQL e uso de Elixir?
05:31 - 06:15 — O que é PGLite e como fazer aplicação segura offline?
06:16 - 07:06 — Quais são as limitações e integração com React?
07:07 - 08:00 — Como é a estrutura no frontend com TStackDB?
08:01 - 08:27 — Como o TStackDB aplica normalização no frontend?
08:27 - 08:50 — Comparação com banco de dados relacional (joins no front)
08:50 - 09:42 — Como funciona a sincronização de dados com Local First
09:42 - 10:06 — Como usar Electric como ponte entre front e banco de dados?
10:06 - 11:20 — Sincronização em tempo real via SSE e conexão contínua com o banco de dados
11:23 - 11:50 — Quais são os detalhes técnicos sobre a conexão contínua com o banco (PostgreSQL)?
11:50 - 12:14 — Arquitetura do backend com Electric SQL e PostgreSQL local
12:14 - 12:36 — Como criar tabelas e popularização do banco com Drizzle ORM?
12:37 - 13:01 — É preciso de uma API tradicional mesmo com Local First?
13:52 - 15:34 — Estrutura do front, collections no Electric e uso de filtros personalizados
15:57 - 16:21 — Segurança com JWT e controle de acesso
16:22 - 17:11 — Como fazer validação com Zod e Standard Schema?
17:12 - 18:24 — Como consultar em tempo real com useLiveQuery + join, limit e keyBy?
18:25 - 19:16 — Criação de nova issue e requisição POST tradicional
19:17 - 20:08 — Como resolver erro com ID duplicado no Drizzle ?
20:09 - 20:58 — Latência em produção e conceito de interface otimista (ex: Instagram)
20:59 - 21:25 — Tentativa com useOptimisticMutation, bugs e limitações
-----

Conecte-se a 500mil devs e avance para o próximo nível com a nossa plataforma: https://rseat.in/rocketseat_

Cadastre-se na nossa plataforma: https://rseat.in/rocketseat_

Junte-se a mais de 392mil devs em nossa comunidade no Discord: https://discord.gg/rocketseat

Acompanhe a Rocketseat nas redes sociais:
TikTok: @rocketseat
Facebook: @rocketseat
Instagram: @rocketseat

Видео Criei meu primeiro app local-first com ElectricSQL e Tanstack DB канала Rocketseat