React Native Bros
React Native Bros
  • 23
  • 6 339
React Native BLE - Part 2: Reading Characteristics from BLE Devices
In this video, we dive into reading characteristics from BLE (Bluetooth Low Energy) devices using React Native. Whether you're developing an IoT application or just curious about BLE technology, this tutorial will guide you through the essential steps to retrieve data from BLE characteristics.
What You'll Learn:
Setting up your React Native environment for BLE communication.
Scanning and connecting to BLE devices.
Reading characteristics from BLE devices.
Handling characteristic value updates in real-time.
We'll be using an ESP32 microcontroller paired with a DHT11 temperature and humidity sensor to demonstrate practical use cases. By the end of this video, you'll have a solid understanding of how to read data from BLE devices and integrate it into your React Native app.
Don't forget to:
👍 Like this video if you found it helpful
🔔 Subscribe to stay updated on our BLE series
💬 Comment below with any questions or topics you'd like us to cover next!
ESP32: robocraze.com/products/nodemcu-32-wifi-bluetooth-esp32-development-board30-pin?_pos=1&_sid=421881ef4&_ss=r
DHT11: Maison Up | Accurate Temperature... www.amazon.in/dp/B0C41NJSTP?ref=ppx_pop_mob_ap_share
Links:
Part 1: React Native Ble #1
th-cam.com/video/5kg08q4c4Tk/w-d-xo.html
Source Code: github.com/Jeopardous/HelloBros/tree/ble_manager
Reach Out To Me-
Linkedin: www.linkedin.com/in/adarsh-sharma-77191914a/
Instagram: _adarshboss_?igsh=dTBrZmVja2ZrOHJi&
Let's get started and unlock the potential of BLE in your React Native applications!
มุมมอง: 217

วีดีโอ

Netflix-Like Card Animation in React Native | Reanimated 3 (Motion Sensor)
มุมมอง 9721 วันที่ผ่านมา
Welcome to my channel! In this video, we'll be recreating the captivating card animation effect from Netflix's home page, where the cards move dynamically in response to your device's motion. 🔗 Resources: Source Code: github.com/Jeopardous/HelloBros/tree/gravity_sensor Reanimated Sensor Documentation: docs.swmansion.com/react-native-reanimated/docs/device/useAnimatedSensor/ 📺 Watch Next: th-cam...
Stunning Parallax Swipe Effect in React Native with FlatList & Reanimated 3
มุมมอง 371หลายเดือนก่อน
Welcome to my React Native tutorial! In this video, I'll walk you through the steps to create an eye-catching parallax swipe effect using FlatList and Reanimated. This effect is perfect for making your app's UI more engaging and dynamic. What You'll Learn: Setting up a FlatList with custom snap intervals for smooth scrolling. Utilizing Reanimated to achieve seamless animations. Fetching and dis...
Typing Indicator & Typewriter Effect (Reanimated 3)
มุมมอง 3312 หลายเดือนก่อน
📝 Description: Welcome to an exciting journey into the world of dynamic user interfaces with Reanimated 3! In this video, we dive deep into creating immersive typing indicators and captivating typewriter effects using the powerful Reanimated 3 library in React Native. 👀 What You'll Learn: Typing Indicator: Discover how to create a sleek and engaging typing indicator that brings life to your cha...
Ripple Effect In React Native (Reanimated 3)
มุมมอง 2963 หลายเดือนก่อน
In thins video Learn how to add captivating ripple effects to your React Native apps using Reanimated 3 and Gesture Handler. Elevate your user experience with sleek animations. Let's dive in! Other Animation Videos AnimatedBottomSheet : th-cam.com/video/yhN-R8B0fvM/w-d-xo.html Swipe To Start : th-cam.com/video/l69EcMjSFGg/w-d-xo.html Drag N Drop : th-cam.com/video/sI5ml-1H_Rc/w-d-xo.html Circle...
React Native BLE - Part 1: Scanning NearBy BLE Devices
มุมมอง 1.4K3 หลายเดือนก่อน
In this video, we scan nearby BLE (Bluetooth Low Energy) devices using React Native. Whether you're developing an IoT application or just curious about BLE technology, this tutorial will guide you through the essential steps to ble setup and scan nearby devices. What You'll Learn: Setting up your React Native environment for BLE communication. Scanning and connecting to BLE devices. Don't forge...
React Native #4 - Redux Toolkit
มุมมอง 873 หลายเดือนก่อน
This video would help you to setup redux with redux-toolkit, redux-thunk, redux-persist to your react native application smoothly. Github Link: github.com/Jeopardous/HelloBros/tree/organize_folders BottomSheet Animation: th-cam.com/video/yhN-R8B0fvM/w-d-xo.htmlsi=j6_15J8vr GXozh CustomTextInput: th-cam.com/video/s9HsLoT3GB8/w-d-xo.htmlsi=WZ9poX62czQTgOI3 #reactnative #redux #reduxtoolkit #javas...
Animated Bottom Sheet & Lottie Animation (Reanimated 3 & Lottie)
มุมมอง 2593 หลายเดือนก่อน
In this video we are creating customised bottom sheet with lottie animation using Reanimated & GestureHandler. Timecodes 0:00 - Introduction 0:46- LottieAnimation 12:24 - BottomSheet UI 26:55 - Gesture Animation Custom Textinput React Native (Reanimated) th-cam.com/video/s9HsLoT3GB8/w-d-xo.html Code Link: github.com/Jeopardous/HelloBros/tree/handshake_animation #reactnative #javascript #coding ...
React Native #3 - React Native Custom Fonts
มุมมอง 1143 หลายเดือนก่อน
This video would help you to import custom fonts to your react native smoothly. #reactnative #javascript #coding #customfonts #customfont #typescript #react #setup #beginners
React Native #2 - React Native Localization Setup
มุมมอง 1314 หลายเดือนก่อน
This is the 2nd video of our "React Native Project Setup Form Scratch" series where we have setup a localization service to change app language. It's a simpler way to handle change language throughout the app. CustomTextInput Video Link: th-cam.com/video/s9HsLoT3GB8/w-d-xo.htmlsi=vtx4OVAeVbQkNYIp CustomInput Code: github.com/Jeopardous/HelloBros/tree/custom_textinput #reactnative #javascript #c...
React Native #1 - Navigation Setup
มุมมอง 664 หลายเดือนก่อน
React Native #1 - Navigation Setup
React Native Drag and Drop (Reanimated & GestureHandler)
มุมมอง 5964 หลายเดือนก่อน
React Native Drag and Drop (Reanimated & GestureHandler)
Animated Loader In React Native Using Reanimated
มุมมอง 754 หลายเดือนก่อน
Animated Loader In React Native Using Reanimated
Ripple Effect In React Native (Reanimated 3)
มุมมอง 2444 หลายเดือนก่อน
Ripple Effect In React Native (Reanimated 3)
Custom Textinput React Native (Reanimated 3)
มุมมอง 794 หลายเดือนก่อน
Custom Textinput React Native (Reanimated 3)
React Native Swipe To Start Animation (Reanimated 3 & Gesture Handler)
มุมมอง 3235 หลายเดือนก่อน
React Native Swipe To Start Animation (Reanimated 3 & Gesture Handler)

ความคิดเห็น

  • @sunilyajamanam
    @sunilyajamanam 21 ชั่วโมงที่ผ่านมา

    Bro you are doing good job. Waiting for next topic

  • @kamal9650-z1w
    @kamal9650-z1w 6 วันที่ผ่านมา

    Hi bros please create tutorial like half pie chart showing progress with arrow indicator like speedometer

  • @sunilyajamanam
    @sunilyajamanam 11 วันที่ผ่านมา

    Hi Bro, i want to fetch MULTIPLE values FROM single characteristicuuid by map or array iterate in react native ble manager display in react native app

    • @reactnativebros
      @reactnativebros 12 ชั่วโมงที่ผ่านมา

      sry bro didn’t see your reply do you still need any help ??

  • @user-mq3ny1jm2z
    @user-mq3ny1jm2z 13 วันที่ผ่านมา

    Thanks man it was a great work. Helped me a lot! Keep doing....

    • @reactnativebros
      @reactnativebros 13 วันที่ผ่านมา

      Welcome and stay tuned😁

  • @gouravnainwaya5669
    @gouravnainwaya5669 20 วันที่ผ่านมา

    Main aapko zarur support karunga bhai bass hindi main bana na aur source code uploaad ksrte rahna aur mic use karoo aacha wala your sound havebtoo much low 🙌

    • @reactnativebros
      @reactnativebros 20 วันที่ผ่านมา

      Thanks bro, Phla video tha kuch pta nhi tha kya krna h 😅

  • @gouravnainwaya5669
    @gouravnainwaya5669 20 วันที่ผ่านมา

    Are you shying too communicate in Hindi

    • @reactnativebros
      @reactnativebros 20 วันที่ผ่านมา

      Nhi bhai tum bologe to marwadi me bhi bna dunga but hindi me jyada logo tk nhi jayega aur bitter truth yhi h ki corporate me aage kaam kroge to english me hi hoti h communication aur mujhe bhi itni hi aati h jitna me smjh pau aur dusro ko smjha pau 😅

  • @jalancarimakan507
    @jalancarimakan507 21 วันที่ผ่านมา

    hi, i'm noticing that you are using expo for this tutorial. mind if you explain to us how do you do when you first setup/initialize the project ? i'm new to this mobile development. thank you very much

    • @reactnativebros
      @reactnativebros 21 วันที่ผ่านมา

      No I am not using expo in this. Its React Native CLI. If you still need help with expo then I can help you.

    • @reactnativebros
      @reactnativebros 21 วันที่ผ่านมา

      I have my linkedIn link in description you can msg me there I will help you setting up with expo.

  • @hasnaingohar1286
    @hasnaingohar1286 26 วันที่ผ่านมา

    Nice work bro. Will you create a series of react native reanimated ? How to use it all

    • @reactnativebros
      @reactnativebros 26 วันที่ผ่านมา

      I am thinking about that one. 😃

    • @hasnaingohar1286
      @hasnaingohar1286 26 วันที่ผ่านมา

      @@reactnativebros that would be great 👍

    • @angerbadge773
      @angerbadge773 15 วันที่ผ่านมา

      @@reactnativebros yes i think you should it since there arent much videos in it to learn

  • @angerbadge773
    @angerbadge773 27 วันที่ผ่านมา

    bro this is sick 🔥🔥

  • @sunilyajamanam
    @sunilyajamanam หลายเดือนก่อน

    i try to read data using characteristics and i did it, but i got numbers what does it mean how to communicate with this numbers Read value from 34:85:18:94:14:B1 - 4fafc201-1fb5-459e-8fcc-c5c9c331914b - beb5483e-36e1-4688-b7f5-ea07361b26a8: 48,0,206,63,9,0,0,0,51,112 please do the needful i want to send instructions to the esp32 and receive data from esp32 as well using react native ble manager. please do the needful Thanks.

    • @reactnativebros
      @reactnativebros หลายเดือนก่อน

      Each digit represents different types of data or depends upon the manufacturer. You have to check docs of the ble sensor you are using.

    • @reactnativebros
      @reactnativebros หลายเดือนก่อน

      I want to create the video but My esp32 is not connecting with mac. Can you send me the esp32 controller link ???

  • @220syedrazamehdirizvi7
    @220syedrazamehdirizvi7 หลายเดือนก่อน

    Yeah bro thats cool !

  • @vitormesquita9733
    @vitormesquita9733 หลายเดือนก่อน

    very good man keep up the good work

  • @AnasSheikh-ck7mt
    @AnasSheikh-ck7mt หลายเดือนก่อน

    How to get Local own Bluetooth Ip Address

    • @reactnativebros
      @reactnativebros หลายเดือนก่อน

      Are you talking about esp32 or arduino? If it’s not Bluetooth low energy device then you have to use react-native-bluetooth-classic.

  • @Orkblockchain
    @Orkblockchain หลายเดือนก่อน

    Can we use the react-native-ble-manager to connect with bluetooth neckband

    • @reactnativebros
      @reactnativebros หลายเดือนก่อน

      Yes you can but you won’t be able to perform action other than connecting like tap to pause and play because we don’t have access to its characteristic and services

    • @Orkblockchain
      @Orkblockchain หลายเดือนก่อน

      @@reactnativebros Do you know how to communicate with drone transmitter and get information related to drone.

    • @reactnativebros
      @reactnativebros หลายเดือนก่อน

      I haven’t worked with the drone but we can do that by Implementing the SDK provided by the manufacturer. If it does not support react native then we can write native methods and export those to react native. I have done that with agora SDK.

  • @v.i.n.i.t968
    @v.i.n.i.t968 หลายเดือนก่อน

    please make it using ble-plx

    • @reactnativebros
      @reactnativebros หลายเดือนก่อน

      Ok I will update it.

    • @v.i.n.i.t968
      @v.i.n.i.t968 หลายเดือนก่อน

      @@reactnativebros thanks alot, but make changes in same code and techniques please.

  • @AnasSheikh-ck7mt
    @AnasSheikh-ck7mt หลายเดือนก่อน

    All is Fine but Mobile Device Bluetooth not access

    • @v.i.n.i.t968
      @v.i.n.i.t968 หลายเดือนก่อน

      same issue

    • @reactnativebros
      @reactnativebros หลายเดือนก่อน

      We can not search for Mobile devices because mobile devices comes under the classic Bluetooth not Low energy. This library only search for Bluetooth Low Energy devices like tracker,temperature,heart rate etc.

    • @AnasSheikh-ck7mt
      @AnasSheikh-ck7mt หลายเดือนก่อน

      @@reactnativebros i have install classic bluetooth library but throw gradle error

    • @reactnativebros
      @reactnativebros หลายเดือนก่อน

      Let me try it. I will give you update.

    • @priyanshusingh100
      @priyanshusingh100 19 วันที่ผ่านมา

      @@reactnativebros ??? have u tried?

  • @alexanderclay5847
    @alexanderclay5847 หลายเดือนก่อน

    Awesome video, just a heads up the audio is really quiet I had to listen on max volume ❤

    • @reactnativebros
      @reactnativebros หลายเดือนก่อน

      Sorry about that 😅 I forgot to connect the mic

  • @alexanderclay5847
    @alexanderclay5847 2 หลายเดือนก่อน

    Love the video, Keep them coming on reanimated!!

    • @reactnativebros
      @reactnativebros 2 หลายเดือนก่อน

      Thanks bro, They are coming 😁

  • @vincenteliezer
    @vincenteliezer 2 หลายเดือนก่อน

    Hey thank you for this. waiting for #2

    • @reactnativebros
      @reactnativebros 2 หลายเดือนก่อน

      Thanks bro I am finding the open source device so that we can do the proper ble communication with its services, read and write characteristics.😀

    • @vincenteliezer
      @vincenteliezer 2 หลายเดือนก่อน

      @@reactnativebrosAlright brother, I'm working with an ESP32 and I'm particularly interested in your upcoming videos on reading and writing characteristics to the device. I'm eager to learn more about this!

  • @BarakerZeonlist
    @BarakerZeonlist 2 หลายเดือนก่อน

    thanks

  • @nehat786
    @nehat786 2 หลายเดือนก่อน

    Love you so much bhai

  • @tuan1842
    @tuan1842 2 หลายเดือนก่อน

    bạn có thể cho tôi xin source code được không, cảm ơn bạn

    • @reactnativebros
      @reactnativebros 2 หลายเดือนก่อน

      github.com/Jeopardous/HelloBros/blob/button_ripple_animation/src/components/ButtonRipple.tsx

  • @atikshaikh6612
    @atikshaikh6612 2 หลายเดือนก่อน

    Really nice video. 8:47 Why you have added base width to 365? Is there any documentation or reference to get more details. Thanks

    • @reactnativebros
      @reactnativebros 2 หลายเดือนก่อน

      Thanks Bro, I have chosen 365 as base width by experience in creating apps for different devices. There is no such documentation.😄

  • @harshpal4689
    @harshpal4689 3 หลายเดือนก่อน

    this tutorial help me lot but can you explain me why its not working for scrollable list like I have 20+ images in list so now it is scrollable but I cant able to drag the images from outside the component ... so please can you help to fix this ?

    • @reactnativebros
      @reactnativebros 3 หลายเดือนก่อน

      Let me try it out and I’ll get back to you

    • @harshpal4689
      @harshpal4689 3 หลายเดือนก่อน

      @@reactnativebros Hey brother did you try it ? ,because I try it in your project but it drag under the scrollview so now cant able to drag it out from the list of images can you please tell me how can I solve this issue

    • @reactnativebros
      @reactnativebros 3 หลายเดือนก่อน

      Yes you are correct its not working. I tried many solutions but nothing is working but we can do workaround and make this work. I will share with you currently I am out of town for personal reasons once I am back we will find a way 👍

    • @harshpal4689
      @harshpal4689 3 หลายเดือนก่อน

      @@reactnativebros ok please find any solution

    • @harshpal4689
      @harshpal4689 3 หลายเดือนก่อน

      Did you find it?

  • @kamal9650-z1w
    @kamal9650-z1w 3 หลายเดือนก่อน

    Bro can you make tutorial for kanban board in react native

    • @reactnativebros
      @reactnativebros 3 หลายเดือนก่อน

      I will try. Its just drag and drop with scroll view 👍

    • @kamal9650-z1w
      @kamal9650-z1w 27 วันที่ผ่านมา

      Please make something like this

    • @reactnativebros
      @reactnativebros 27 วันที่ผ่านมา

      @@kamal9650-z1w I was trying to do it but mobile screen is very small for kanban board and there are certain limitations for mobile android and ios OS does not allow drag and drop from a scroll view to another view.

  • @shahrozatiq5312
    @shahrozatiq5312 3 หลายเดือนก่อน

    Very informative bro, thank you

    • @reactnativebros
      @reactnativebros 3 หลายเดือนก่อน

      Thanks bro 👍

    • @shahrozatiq5312
      @shahrozatiq5312 3 หลายเดือนก่อน

      @@reactnativebros bro can you make some videos on react native svg library, I'm a newbie and wanted to use this library to make a custom tab bar but can't find any tutorial on TH-cam that explain fundamentals of using svg in react native

    • @reactnativebros
      @reactnativebros 3 หลายเดือนก่อน

      svg is used for creating shapes that can not be done with simple views but for tab bar you should explore the reanimated library 😃

    • @shahrozatiq5312
      @shahrozatiq5312 3 หลายเดือนก่อน

      @@reactnativebros can i dm you the picture of tab bar that i wanted to create on Instagram? Maybe you can help me with something

    • @reactnativebros
      @reactnativebros 3 หลายเดือนก่อน

      sure bro instagram.com/_adarshboss_?igsh=dTBrZmVja2ZrOHJi&

  • @user-zk8yr6tj1x
    @user-zk8yr6tj1x 3 หลายเดือนก่อน

    Help me find solutions 6 days but not solved React native firebase firebase me collection user he user id bhi diya he data{ Item { mobile 📱 laptop } How to add items without any item delete }

    • @reactnativebros
      @reactnativebros 3 หลายเดือนก่อน

      No worries I will help you. Ping me on insta instagram.com/_adarshboss_?igsh=dTBrZmVja2ZrOHJi&

  • @Akashknow765
    @Akashknow765 3 หลายเดือนก่อน

    hello brother, what is your tech stack ? i want to learn react native .

    • @reactnativebros
      @reactnativebros 3 หลายเดือนก่อน

      I am proficient in React Native with 4.5 years of experience and have some familiarity with Node, React Js and native Android. 😁

    • @reactnativebros
      @reactnativebros 3 หลายเดือนก่อน

      This is my instagram you can contact me. I will help you 😄instagram.com/_adarshboss_?igsh=dTBrZmVja2ZrOHJi&

    • @Akashknow765
      @Akashknow765 3 หลายเดือนก่อน

      @@reactnativebros okey I'll ping you then.

  • @nehat786
    @nehat786 3 หลายเดือนก่อน

    Bhai you are hidden gem. Glad I found you.

    • @reactnativebros
      @reactnativebros 3 หลายเดือนก่อน

      Thanks 👊, Let me know if anything specific you need😬

    • @nehat786
      @nehat786 3 หลายเดือนก่อน

      @@reactnativebros bhai bluetooth or push notification with expo and app ki pyari awaz mein,

    • @reactnativebros
      @reactnativebros 3 หลายเดือนก่อน

      sure 👍

  • @nehat786
    @nehat786 3 หลายเดือนก่อน

    Shandar zabardast zindabad ❤

  • @himanshumishra3594
    @himanshumishra3594 4 หลายเดือนก่อน

    Nice and informative content

  • @himanshumishra3594
    @himanshumishra3594 4 หลายเดือนก่อน

    Thank you for making this video. Much needed 🙏

  • @TheDevBrigade
    @TheDevBrigade 4 หลายเดือนก่อน

    Good Tutorial.

  • @kamal9650-z1w
    @kamal9650-z1w 5 หลายเดือนก่อน

    Please create more animation videos like this and add source code please

    • @reactnativebros
      @reactnativebros 5 หลายเดือนก่อน

      Thank you for your response. While the description is pending verification, you can find the code on this GitHub repository: github.com/Jeopardous/HelloBros/tree/swipe_animation