Build a Local First Trello Clone with React Native & Realm

2024 ж. 4 Мам.
30 545 Рет қаралды

Ever wanted to create an app that works seamlessly offline and syncs up the moment you're back online? We're doing just that in this video, where we'll show you how to build a project management app, just like Trello, but it's built local-first! This video is perfect to learn the ins and outs of React Native using Realm, including the Atlas Device SDK. You'll learn how to manage your data locally (so it works offline), and automatically sync everything to the cloud when you're connected. Let's get coding!
2️⃣ Watch the second part here: kzhead.infoHkRa2iWC-nI
✅ Project Page: www.notjust.dev/projects/trello
💻 Source Code: github.com/notJust-dev/Trello...
❗Try our FREE 2-day Masterclass on notJust.Academy: assets.notjust.dev/masterclas...
📚 This video includes a lot of tools and technologies, providing an excellent opportunity to learn about:
- Introduction to Local-First and Offline-First Concepts
- Setting Up Your React Native Environment
- Overview of Realm and Atlas Device SDK
- Designing Your Local-First Database Schema with Realm
- Building the UI: Cloning Trello's Layout
- Implementing CRUD Operations Locally with Realm
- Syncing Local Data with Cloud Automatically
📚 Enroll NOW in The Full-Stack Mobile Developer course and don’t miss out on your chance to become a 6-figure dev! Check out what our successful students are saying about their experience:
academy.notjust.dev/?...
💡 Have an idea for a future tutorial? Share it on our Idea Board: github.com/orgs/notJust-dev/d...
💬 Join the notJust Development gang and let's build together:
Twitter: / vadimnotjustdev
Instagram: / vadimnotjustdev
Facebook: / notjustdev
LinkedIn: / vadimsavin
Discord: / discord
Timecodes:
0:00 Intro and Project Overview
2:26 Setting up and Initialising a New Expo Project
7:56 Project Setup and Task List Component
29:13 Building the New Task Input
44:17 Adding a Background Gradient and Building the Task Board
52:42 App Overview
53:23 Setting up Expo Router
1:22:46 Setting up Realm as a local database
2:14:23 Implementing the Update Task Feature
2:24:34 Debugging Atlas App Services Error
2:49:31 Setting up App provider and Anonymous Sign in
3:11:27 Syncronizing the Realm Database with the Cloud
3:35:52 Adding an Authentication Screen
3:43:35 Building the Profile Page
3:56:03 App Demo and Outro
Disclaimer: This build is for educational purposes only. All views, opinions, and technology choices expressed in this video are my own and do not represent the views, opinions, or technology choices of any entity I have been, am now, or will be affiliated with.
#notjustdev #trello #reactnative

Пікірлер
  • Bravo bro ! Te urmaresc de mult, faci printre cele mai bune tutoriale de pe yt ! You the real MVP

    @user-ib3gj2qt2h@user-ib3gj2qt2h28 күн бұрын
    • Mulțumesc mult!

      @notjustdev@notjustdev24 күн бұрын
    • ​@@notjustdevHello Am building a react native app but am having a issue with flatlist please anyone should help me out . I render the video peacefully but each video are all playing, its like listening to 10 drummers at the same time .please what should or can i do to make the focus video to be the only one playing 🙏🙏🙏 🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🙏🏼🙏🏼🙏🏽🙏🏽🙏🏽🙏🏽🙏🏽🙏🏽🙏🏽🙏🏽🙏🏽🙏🏽🙏🏽🙏🏽🙏🏽🙏🏽🙏🏽🙏🏽🙏🏽🙏🏽🙏🏽🙏🏽🙏🏽🙏🏽

      @thebiguniverse9926@thebiguniverse992620 күн бұрын
  • Appreciate it man

    @Tacherasasi@Tacherasasi29 күн бұрын
  • Great tutorial, as always.Thank you!!

    @Flo-lq3gq@Flo-lq3gq20 күн бұрын
    • My pleasure!🙌

      @notjustdev@notjustdev15 күн бұрын
  • thank uu so much for ur effort , quality of the videos , simplicty

    @lahcenaouina@lahcenaouina29 күн бұрын
    • Thank you, will do!

      @notjustdev@notjustdev24 күн бұрын
  • Great tutorial! highly appreciated!!

    @rishirai8874@rishirai88749 күн бұрын
    • Glad it was helpful!🙌

      @notjustdev@notjustdev9 күн бұрын
  • Mix it up with plain js builds as well pls

    @mobinakhter7081@mobinakhter708129 күн бұрын
  • What type of camera are you using?(the quality is wow)

    @janiehebert@janiehebert10 күн бұрын
    • A Sony a6100 with a Sigma 30mm 1.4

      @notjustdev@notjustdev9 күн бұрын
  • sir expo background local notification is not working android phone

    @rabnawazali6061@rabnawazali606129 күн бұрын
  • good work..

    @AnilKumar-uf3vb@AnilKumar-uf3vb29 күн бұрын
    • Thank you! Cheers!

      @notjustdev@notjustdev24 күн бұрын
  • A very good video please continue uploading this type of videos, and may i ask for the love of god make a WaterMelonDb tutorial, is there a way of sincrinizing the data with another type of db, that is not MongoDB?

    @vitormesquita9733@vitormesquita973321 күн бұрын
    • Thanks! Will do 🙌 And to answer your question, yes it's possible

      @notjustdev@notjustdev15 күн бұрын
  • please wich vscode is it on the video ?

    @kingjune6685@kingjune668520 күн бұрын
  • Please dear, activate the subtitle translations

    @Necros_@Necros_26 күн бұрын
KZhead