Simon Grimm
Simon Grimm
  • 656
  • 10 458 955
Building a Local-First React Native App with PowerSync and Supabase
⚡️ Try PowerSync for free today: dub.sh/powersync
Transform your React Native application into a faster, local-first app using PowerSync. I'll walk you through all the steps from using a Postgres database with Supabase to setting up PowerSync for offline-first access within your React Native app.
🔥 Learn React Native FAST: galaxies.dev
🔗 App Code: github.com/Galaxies-dev/react-native-local-first
🔗 Local-First is the Future, Here’s Why: ua-cam.com/video/SnhNHjqIbNw/v-deo.html
🔗 Powersync React Native: docs.powersync.com/client-sdk-references/react-native-and-expo
🔗 Powersync Supabase: docs.powersync.com/integration-guides/supabase-+-powersync
🔗 Kysely: kysely.dev/
#############################
❤️ You can also find me on:
Twitter: schlimmson
Instagram: simongrimm_
#############################
00:00 Why use Local-First in 2024?!
00:53 PowerSync
01:42 Setting Up the Initial Application and Superbase
04:01 Integrating PowerSync: Setup and Configuration
16:53 Implementing Local-First Schema and Sync Rules
29:10 Transitioning the Application Logic to PowerSync
45:51 Breakdown
46:31 Outro
Переглядів: 3 562

Відео

Every Way to Build your React Native App with Expo | Expo Go, Prebuild, Xcode, Android Studio & EAS
Переглядів 10 тис.День тому
Understand the different ways to build your React Native app with Expo including Expo Go, how prebuilds work, and how to use native tools like Xcode and Android Studio or the EAS cloud builds! 🔥 Learn React Native FAST: galaxies.dev ❤️ You can also find me on: Twitter: schlimmson Instagram: simongrimm_ 00:00 Basics with Expo Go 02:25 Expo Prebuild 10:23 Building with X...
10 Takeaways for React Native Devs from the App.js conference
Переглядів 11 тис.14 днів тому
One of the biggest React Native conferences took place in Krakow, and in this video, I'll share 10 takeaways so you don't have to watch the whole event! 🔥 Learn React Native FAST: galaxies.dev 🔗 React Native IDE: ua-cam.com/video/eOWxKkHakyY/v-deo.html 🔗 Podcast Fernando Rojo: ua-cam.com/video/k4HBH_UxKrE/v-deo.html 🔗 App.js Day 1: ua-cam.com/users/liveMdCn0Iq0ucU 🔗 App.js Day 2: ua-cam.com/use...
Build a ChatGPT Clone with React Native (Expo, SQLite, RevenueCat, Clerk, OpenAI)
Переглядів 13 тис.21 день тому
🔐 Try Clerk today: go.clerk.com/XBc9sOr 🤑 Get IAP with Revenuecat: dub.sh/revenuecat Join me as I build an epic ChatGPT Clone with React Native using Clerk & RevenueCat! In this exciting tutorial, you'll learn how to do the following: Key Features: 🚀 Use Expo to set up the app and enable custom native modules 💫 Create animated intro screens with custom components 📦 Implement Clerk for user auth...
Expo SDK 51: New Packages, Router, Architecture & Template
Переглядів 17 тис.Місяць тому
The Expo SDK 51 was released, which includes React Native 0.74 and many more small and big changes that we should talk about. 🔥 Learn React Native FAST: galaxies.dev 👨‍💻 Full tutorial: galaxies.dev/ 🔗 Expo SDK 51: expo.dev/changelog/2024/05-07-sdk-51 🔗 Podcast with Evan Bacon: ua-cam.com/video/qsRI8T5V99g/v-deo.html ❤️ You can also find me on: Twitter: schlimmson Instagram: instagra...
React Native IDE BETA 🔥
Переглядів 30 тис.Місяць тому
The React Native IDE is a VSC and Cursor extension, currently in beta. Let’s check out what Software Mansion has been working on and how it might change our entire React Native development flow. 🔥 Learn React Native FAST: galaxies.dev 🔗 Join the beta: ide.swmansion.com/ ❤️ You can also find me on: Twitter: schlimmson Instagram: simongrimm_ 00:00 Installing the React Na...
These React Native Apps are 🔥 | App Review
Переглядів 9 тис.Місяць тому
Get your AppJS Ticket today at appjs.co with code Galaxies10 Today I took a look at 3 UNIQUE React Native Apps. I analyzed and critiqued these apps showcasing the pros and cons of different components used in each app. 🔥 Build React Native apps FAST: galaxies.dev/ 🔗 The Lock - Game: apps.apple.com/do/app/the-lock-game/id6471700369 🔗 Turnstile: www.turnstile.city/ 🔗 Win The Square: apps.apple.co...
React Native Multiplayer with Supabase Realtime and Skia
Переглядів 7 тис.Місяць тому
Building a React Native multiplayer game might be easier than you think. Let's explore how by using Supabase Realtime and Skia! 🔥 Learn React Native FAST: galaxies.dev 👨‍💻 Code: github.com/Galaxies-dev/supabase-realtime-drawing 💫 Check out Supabase supabase.com 🔗 Initial Tutorial: spin.atomicobject.com/react-native-skia/ ❤️ You can also find me on: Twitter: schlimmson Instagram: ins...
10 EPIC React Native Animation Libraries
Переглядів 13 тис.2 місяці тому
Check out these epic React Native Animation and UI libraries and ship outstanding native apps! 🔥 Learn React Native FAST: galaxies.dev 🔗 Repo with code examples: github.com/Galaxies-dev/animation-examples The components: 1. Reanimated React Native Reanimated: docs.swmansion.com/react-native-reanimated/ 2. Moti: moti.fyi 3. Marquee: github.com/animate-react-native/marquee 4. Lottie lottie-react-...
React Native Security: Lock Screen, Face ID & Privacy Overlay
Переглядів 8 тис.2 місяці тому
Let's build a React Native Lock Screen with FaceID and privacy overlay that automatically shows when the user is inactive! 🔥 Learn React Native FAST: galaxies.dev 👨‍💻 Full tutorial: galaxies.dev/react-native-face-id-passcode ❤️ You can also find me on: Twitter: schlimmson Instagram: simongrimm_ 00:00 App Overview 00:43 App Setup and Expo Prebuild 05:02 User Inactivity ...
React Native with HTML?
Переглядів 4,7 тис.2 місяці тому
🔥Get your AppJS Ticket today at appjs.co Use code GALAXIES10 for a 10% discount 🔥 Meta open-sourced react-strict-dom, a library to build universal apps with React. Let's check out what this is, and what it means to the future of React and React Native! 🔥 Learn React Native FAST: galaxies.dev ❤️ You can also find me on: Twitter: schlimmson 00:00 Why React Strict DOM 01:00 AppJS 01:50...
Build a FinTech Clone with React Native (API Routes, Zustand, Tanstack Query, FaceID, Charts, Clerk)
Переглядів 65 тис.2 місяці тому
🔐 Try Clerk today: go.clerk.com/tQXLCe8 Join me as I build an epic Fintech Clone with React Native. You'll learn how to do the following in this tutorial: Key Features: 🌐 Use Expo file-based routing 🔐 Use Clerk for user authentication with OTP 📦 Use state management with Zustand and MMKV 💫 Add drag-and-drop with Reanimated and Gestures 🚀 Use API Routes with Expo Router ✌️ Build performant Chart...
The Best Stack for Universal React Apps
Переглядів 11 тис.2 місяці тому
What is the best stack for a universal app with React that works great on the web and as a native iOS and Android app? Let's find out. 🔥 Learn React Native FAST: galaxies.dev Links: - T3 Stack: github.com/t3-oss/create-t3-app - T3 Turbo: github.com/t3-oss/create-t3-turbo - Tamagui: tamagui.dev - Expo: expo.dev - Evan Bacon Blog: github.com/EvanBacon/evanbacon.dev ❤️ You can also find me on: Twi...
Role Based Navigation in React Native with Expo Router
Переглядів 8 тис.3 місяці тому
Let's implement a role-based authentication system for React Native with Expo Router! 🔥 Build React Native apps FAST: galaxies.dev/ 🔗 Tutorial on Galaxies: galaxies.dev/react-native-role-based-navigation ❤️ You can also find me on: Twitter: schlimmson Chapters: 00:00 About Role-Based Navigation 01:03 Stack and Auth Provider 08:43 Protecting Pages 14:40 Protecting Elements 23:02 Outr...
Build a Kids Drawing App with React Native
Переглядів 2,9 тис.3 місяці тому
Want to build a cool coloring game for your kids? Check out how easily you can color SVGs with React Native to build your own Kids Coloring game. 🔥 Learn React Native FAST: galaxies.dev 👨‍💻 Full tutorial: galaxies.dev/react-native-drawing ❤️ You can also find me on: Twitter: schlimmson 00:00 React Native App Setup 01:41 SVG Viewer Component 05:09 Coloring the SVG 10:39 Adding Zoom a...
Local-First is the Future, Here’s Why
Переглядів 16 тис.3 місяці тому
Local-First is the Future, Here’s Why
Build a WhatsApp Clone with React Native (Expo Router, Reanimated, Clerk, Gestures, Gifted Chat)
Переглядів 37 тис.3 місяці тому
Build a WhatsApp Clone with React Native (Expo Router, Reanimated, Clerk, Gestures, Gifted Chat)
Migrating from React Navigation to Expo Router
Переглядів 8 тис.4 місяці тому
Migrating from React Navigation to Expo Router
The Time for React Native is NOW
Переглядів 10 тис.4 місяці тому
The Time for React Native is NOW
Can this replace NextJS?
Переглядів 12 тис.4 місяці тому
Can this replace NextJS?
React Native just got better
Переглядів 30 тис.4 місяці тому
React Native just got better
The Worlds Best Apps use React Native
Переглядів 12 тис.4 місяці тому
The Worlds Best Apps use React Native
Better than React Native Stylesheet 💪
Переглядів 8 тис.5 місяців тому
Better than React Native Stylesheet 💪
THE React Native Tech Stack for 2024 😎
Переглядів 37 тис.5 місяців тому
THE React Native Tech Stack for 2024 😎
Twitter Top Tabs Navigation with Expo Router
Переглядів 13 тис.5 місяців тому
Twitter Top Tabs Navigation with Expo Router
I reviewed your apps... Here's what I found! | React Native Apps
Переглядів 8 тис.5 місяців тому
I reviewed your apps... Here's what I found! | React Native Apps
Expo Router Drawer Navigation with Custom Menu
Переглядів 14 тис.5 місяців тому
Expo Router Drawer Navigation with Custom Menu
Building Modern Angular 17 Apps with Ionic and Standalone Components
Переглядів 28 тис.6 місяців тому
Building Modern Angular 17 Apps with Ionic and Standalone Components
Easiest React Native Parallax Image Scroll EVER 😱
Переглядів 9 тис.6 місяців тому
Easiest React Native Parallax Image Scroll EVER 😱
Why I moved to React Native
Переглядів 41 тис.6 місяців тому
Why I moved to React Native

КОМЕНТАРІ

  • @affelay17
    @affelay17 6 годин тому

    Is there any way of getting a development build that i can debug and hot reload instantly to my iPhone without having a mac? @Simon Grimm

  • @PreyzPlayer
    @PreyzPlayer 8 годин тому

    Man hört den deutschen Akzent raus 😆 Super Tutorial!

  • @acandrescardenas
    @acandrescardenas 10 годин тому

    Does anyone know how to solve this error? TypeError: Cannot read properties of undefined (reading 'grantOfflineAccess')

  • @simons9693
    @simons9693 День тому

    HIGHHHHHH Energy 🙂

  • @pukarsharma8075
    @pukarsharma8075 День тому

    Please make a video on stylesheet libraries too.

  • @chauquang55
    @chauquang55 День тому

    where is the source code

  • @chenjus
    @chenjus День тому

    Btw expo-router version 3.5.16 causes gradle build to fail

  • @chrishernandez8914
    @chrishernandez8914 День тому

    I'm big fan this video 👌

  • @licokr
    @licokr День тому

    I have worked on React projects but not really gave attention to RN since my first RN project with Expo in 2020. Wow, a lot of things going on here. My first impression about Expo wasn't good. It was good regarding developer experience and provided features out of the box may be a bit tricky to implement in RN. But tbh, I didn't think Expo would be alive until now. But wow, their work is really awesome. I can't stop watching your videos. Thanks for making good videos.

  • @licokr
    @licokr День тому

    Thanks for the information. I've subsribed ur channel👍. It assures me to start RN

  • @7arkan
    @7arkan 2 дні тому

    Please stop saying ideaR.

  • @soner8780
    @soner8780 2 дні тому

    Great

  • @jeromeabbis
    @jeromeabbis 2 дні тому

    Great tutorial for a long awaiting topic :) I might switch from Ionic to React Native! I´m interested, why are you using different code than the supplied code from powersync/supabase docs? Are you going a different approach?

  • @Gangbuster74
    @Gangbuster74 2 дні тому

    I am facing this error Cannot find native module RNIContextMenuView' , on. Mac as well on Windows I am using a physical device through expo go can anyone pls help

  • @xregularxjohnx
    @xregularxjohnx 2 дні тому

    nitpick: offline-first is not equivalent to local-first. Offline-first will typically function offline but once the network is available the app will default to using that. Local-first will ALWAYS use the local store of choice first and sync to the network whether there is one available or not.

  • @mikemece
    @mikemece 2 дні тому

    I had a lot of problems trying to build the application using EAS with Expo 51, lots of graddle errors or different stuff, so i finally got it using the prebuild method and building it later as a standalone app. Thanks!

  • @karoxigaming604
    @karoxigaming604 3 дні тому

    Bro Go for gaming coding doesn’t make you groww subscriber its been too many days still not growing

  • @user-so2my4sv2s
    @user-so2my4sv2s 3 дні тому

    its been more then 3 weeks and it is still not fixed....im facing the same issue "not a valid base 64 encoded string" @1:04:25 .... i also cant find any solution :)

    • @Raghunadh9
      @Raghunadh9 2 дні тому

      BOR, SAME PROBELM HERE... DID YOU FIXED IT?? PLEASE REPLY

  • @saint1yusuf
    @saint1yusuf 3 дні тому

    Why can't I get a local build on my Macbook Pro M3 Pro? It throws some errors: The following build commands failed: PhaseScriptExecution [CP-User]\ Generate\ Specs /Users/{{mycomputername}}/Library/Developer/Xcode/DerivedData/{{myprojectname}}-cfidukweifishsglrzazonmjncac/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/React-Codegen.build/Script-46EB2E00020CC0.sh (in target 'React-Codegen' from project 'Pods') (1 failure)

  • @johnycache
    @johnycache 3 дні тому

    In terms of apple messing up with PWAs - are react native apps more future proof in this sense? i.e. Would react native apps suffer any of the same setbacks as PWAs? Thanks!

  • @kasiselvamk
    @kasiselvamk 3 дні тому

    Hi , how you are writing in web browser ?

  • @ikeodira4761
    @ikeodira4761 4 дні тому

    Please I can't connect to clerk, what could be the problem?

  • @sahiljaidka6657
    @sahiljaidka6657 4 дні тому

    settings page is amazing

  • @NavidMasahati
    @NavidMasahati 4 дні тому

    life saver

  • @efari
    @efari 4 дні тому

    When the faceID prompt shows up, the appstate changes to “background”. It’s why it was bugging since you took more than 3 seconds to have valid faceID

  • @El_ii
    @El_ii 4 дні тому

    I wish you also added the steps before react native like configuration with Xocde and Apple Connect. Your tutorial is not easy to understand...

  • @fallanstar
    @fallanstar 4 дні тому

    can you please make one full stack app with AI generation like image ,video audio or text gernation with unique UI with expo and many more things please sir please

  • @ExpoDevelopers
    @ExpoDevelopers 4 дні тому

    Nice tutorial Simon!

  • @Asylum377
    @Asylum377 4 дні тому

    how can i do this with expo ua-cam.com/video/lYpcJQImrGw/v-deo.html

  • @AGUNGKAYA
    @AGUNGKAYA 5 днів тому

    I am still in ionic. Is react native better than ionic sir? 🤔

  • @balabala9735
    @balabala9735 5 днів тому

    how to use expo clerk in production?

  • @HOW-bt3et
    @HOW-bt3et 5 днів тому

    I have some errors my friend

  • @gopalakrishnanbalasubraman2463
    @gopalakrishnanbalasubraman2463 5 днів тому

    The Live Hot Reload workaround I find it so fascinating as well.... Thanks to you for sharing 😄