Building the Ultimate Workout Tracker with React Native & MongoDB

Ғылым және технология

Let's build a full-stack fitness app to track your workouts using React Native, Expo, MongoDB, IBM Stepzen, and GraphQL.
This tutorial is sponsored by ✨IBM StepZen✨ - a GraphQL server with a unique architecture that helps developers build APIs fast and with less code
❇️ Get your free account here: bit.ly/3RZtGNM
In this video, we'll dive deep into the world of app development, guiding you through the process of building a fitness app that is both highly interactive and easy to use. From configuring your development environment to building a fully functional fitness tracker, we'll guide you through every step. Learn how to use the power of IBM Stepzen, MongoDB, GraphQL, and React Native to revolutionise fitness tracking!
2️⃣ Watch part 2 here: kzread.info7MbFDnR_6HM
❗Try our FREE 4-day Masterclass on notJust.Academy:
assets.notjust.dev/masterclas...
✨ Asset Bundle: assets.notjust.dev/workouts
⌨️ Source code: github.com/notJust-dev/Workouts
This video includes a lot of tools and technologies, providing an excellent opportunity to learn about:
- Setting up the Development Environment
- Understanding the App Structure and Workflow
- Designing the User Interface with React Native
- Implementing Navigation between Screens
- Integrating MongoDB Database with a React Native App
- Creating and Managing User Workouts
- Visualizing Progress with Graphs and Charts
- Building a GraphQL API with IBM Stepzen
📚 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/?...
💬 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:58 Setting up and initialising the project
10:23 Styling in React Native
13:33 Importing and Displaying Data
30:41 FlatList and Custom Components
52:06 Setting up Expo Router for navigation
1:06:22 Exercise Details Implementation
1:42:31 Expo Router Slot Explanation
1:56:33 Backend Architecture Explained. StepZen Installation
2:00:30 Setting up the GraphQL API with IBM StepZen
2:13:21 Enhancing and Testing the GraphQL API
2:23:36 Using React Query to query the GraphQL API
3:06:21 Workout Logger Features
3:18:03 MongoDB setup and Integratio
3:58:56 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 #mongodb #reactnative

Пікірлер: 49

  • @notjustdev
    @notjustdev3 ай бұрын

    ❇ Get your free account on ✨IBM StepZen✨- a GraphQL server with a unique architecture that helps developers build APIs fast and with less code: bit.ly/3RZtGNM

  • @JoshuaCornelius-xo3sr

    @JoshuaCornelius-xo3sr

    8 күн бұрын

    Hello, stepzen stopped from april 10th, now theres api connect zssengia's, a new dashboard that doesn't log in, what to do..

  • @khalidshenlee

    @khalidshenlee

    Күн бұрын

    Kindly share another platform apart from StepZen

  • @darkborhen4962
    @darkborhen49623 ай бұрын

    I'm from algeria ......Thank you for do it with JavaScript...when i see typscript i will runway and close the video 😅...this channel deserve millions view

  • @erikaszvicevicius9191
    @erikaszvicevicius91913 ай бұрын

    Thank You. Thank you showing FROM SCRATCH. It`s very important for beginers.

  • @farouqseriki5942
    @farouqseriki59423 ай бұрын

    Im so excited for this. So many things I've been trying to learn in one Video.Awesome .

  • @damonturner1554
    @damonturner1554Ай бұрын

    thanks for a great live-stream tutorial ... it's the first time I've seen your videos, and this one really makes the "under the hood" happenings of expo-router simple and easy to understand (especially where you changed Stack to Slot and Tabs in the _layout.js file) I'm very much looking forward to more of your tutorials! thanks again :D :P

  • @navinkumarsahu1159
    @navinkumarsahu11593 ай бұрын

    Vadim is back with superPowers❤

  • @mayssamayssa4406
    @mayssamayssa44062 ай бұрын

    Hi ! I've just discovered your channel and I really loved it . Thank you for your efforts . Am a beginner and I learnt many things . Thank you again ❤🙏 when are u dropping part 3 ?

  • @notjustdev

    @notjustdev

    2 ай бұрын

    Thank you for your appreciation! 🙌 We are still thinking if there's going to be a part 3

  • @mijo3409
    @mijo34092 ай бұрын

    Thanks for this video, it gave me an idea for an app! I plan to make it for the next 3 months.

  • @notjustdev

    @notjustdev

    2 ай бұрын

    That's great to hear! Good luck 🙌🚀

  • @sagedev
    @sagedev2 ай бұрын

    It was one of the best explanations I've seen on the internet. Thank you very much. God let him open the way.

  • @notjustdev

    @notjustdev

    2 ай бұрын

    Thanks for your appreciation 🙌🚀

  • @AnthonyPietropaolo-kx6fb
    @AnthonyPietropaolo-kx6fb2 ай бұрын

    This video came at the perfect time - just what I needed to get back on track with my fitness goals

  • @empyrerhomann6743
    @empyrerhomann67437 күн бұрын

    Hey Vadim, thanks for this awesome tutorial. I followed along and unfrotunately, I think Stepzen behaves in a funny way, at least for me. I was not able to create an account to even try it out therefore I went the hard way :) I had to build my my own API server to convert api-ninjas REST endpoints to GraphQL (got me learning GraphQL at least so not bad), but then also had to host it and get a SSL certificate to make it HTTPS since Android API 34 doesn't support http connection even during local development

  • @CarlosCostaCarvalho
    @CarlosCostaCarvalho2 ай бұрын

    great video as always... idea: now a video creating a Tabata app that can be setup using time and/or distance! With distance we can cover the use of GPS, and also the app could speak, like "half way to finish" or something like that. Using react native, expo, supabase :D thanks for the video!!!

  • @notjustdev

    @notjustdev

    2 ай бұрын

    Thanks for the idea! 💡 Share it on our Idea Board and we'll consider it: github.com/orgs/notJust-dev/discussions

  • @alzearafat
    @alzearafat3 ай бұрын

    I love you man... 🔥

  • @amart653
    @amart65328 күн бұрын

    I strucked with stepzen api fetching with json format

  • @aymenbachiri-yh2hd
    @aymenbachiri-yh2hdКүн бұрын

    THank You

  • @user-ev9ju5dq5b
    @user-ev9ju5dq5b3 ай бұрын

    Vadim is back with super

  • @navinkumarsahu1159
    @navinkumarsahu11593 ай бұрын

    Please reveal the date or publish it ASAP because we want to be hero of React Native 😁

  • @DevTechCare
    @DevTechCareАй бұрын

    Responsive font sizes???

  • @russellthompson5181
    @russellthompson51816 күн бұрын

    I cannot get to IBM StepZen. When I click to create an account, it takes me to IBM API Connect. The account I create there will not work when trying to login to StepZen CLI. No matter what I enter at "stepzen login" it returns an error.😒

  • @scientifichuman5902
    @scientifichuman59023 ай бұрын

    Thank you for your efforts 😘This is not completed yet, right? The one in the presentation has a tracker in it. Please clarify.

  • @notjustdev

    @notjustdev

    3 ай бұрын

    Today we published part 2, with a complete tracker features

  • @gudduagrawal8523
    @gudduagrawal85232 ай бұрын

    found error while using curl on windows (JSON invalid character '}' looking for beginning of object key string) used WSL (same command in linux distribution) to solve the problem

  • @notjustdev

    @notjustdev

    2 ай бұрын

    So you managed to solve it?

  • @Mahdi-rw1px
    @Mahdi-rw1pxАй бұрын

    hello can you please tell me what is eas build people are talking about i already started my project like you with npx create after i learned about eas do i need to create my project another way or what does eas build even mean its very confusing in the internet

  • @notjustdev

    @notjustdev

    Ай бұрын

    Check out this video on the topic: kzread.infoPdHbBZvPyxI

  • @robintillotson-tv2ri
    @robintillotson-tv2ri14 күн бұрын

    I run npm start, I have Xcode installed. Terminal says I need Xcode installed completely for it to continue. As far as I know, it is completely installed. Newest version. The works. What am I missing? Yes, I'm 9 minutes into the video hahahahah.

  • @krishshah2867
    @krishshah28677 күн бұрын

    Did anybody else face errors while executing stepzen import curl command? If yes then please help me resolve it

  • @BibleVoiceEnglish
    @BibleVoiceEnglish2 ай бұрын

    If python uses other libraries such as opencv then how can it synchronize in the android studio project?

  • @TylerDerby

    @TylerDerby

    2 ай бұрын

    ARE U RETARDED?

  • @TylerDerby

    @TylerDerby

    2 ай бұрын

    Hey irs off unless it off

  • @BulamuNet
    @BulamuNet3 ай бұрын

    Nice nice nice

  • @BLBADVENTURES
    @BLBADVENTURES13 күн бұрын

    cool stuff

  • @user-ub8rn3mh5f
    @user-ub8rn3mh5f2 ай бұрын

    we need more in Javascript

  • @user-dn6zk9vz4y
    @user-dn6zk9vz4y15 күн бұрын

    سلام یه مقدار سهت بود درک این جلسه و جلسه قبل مهصوصا تو قسمت کالیته مردن کومو....

  • @plfmoura
    @plfmoura3 ай бұрын

    why not Typescript?

  • @notjustdev

    @notjustdev

    3 ай бұрын

    To keep it beginner friendly. If you feel comfortable with TS, go for it 🙌

  • @HusamAlzain
    @HusamAlzain16 күн бұрын

    I wish you haven't used IBM StepZen, IBM ruiend it.

  • @notjustdev

    @notjustdev

    15 күн бұрын

    Why do you think so?

  • @HusamAlzain

    @HusamAlzain

    15 күн бұрын

    ​@@notjustdev I can't every login to StepZen account, when I do so, I redicrets me to IBM's page, and I never could login to StepZen. Really awful. Also, I have used IBM Watson, and it has tons of problems, and many people are asking them to solve it, but no response..

  • @frq9293

    @frq9293

    12 күн бұрын

    @@HusamAlzain Ya same here. No matter what I do I can't seem to get to the dashboard..

  • @HusamAlzain

    @HusamAlzain

    10 күн бұрын

    @@frq9293 Exactly the same.

Келесі