Human Pose Detection in React Native: Develop a mobile application to count squats in real-time
Hey, beautiful people across the Internet. I’m Himanshu Saini, a full-stack developer, today going to integrate the capabilities of Machine Learning in a React Native project to develop a simple mobile application to count the squats of a person in real-time.
The NPM package we are going to use for our project is react-native-human-pose, which is a lightweight yet performative package that gives almost 20+ fps in modern mobile devices
Lets get started
First create a react native project using following command
npx react-native@latest init SquatsCounter
Next, lets add our package to the project using
yarn add react-native-human-pose react-native-webview
Or
npm i react-native-human-pose react-native-webview
Android
Go to android/app/src/main/AndroidManifest.xml and add this line
<uses-permission android:name="android.permission.CAMERA" />
iOS
cd ios && pod install
Then go to ios/SquatsCounter/Info.plist and these lines
<key>NSCameraUsageDescription</key>
<string>$(PRODUCT_NAME) needs access to your Camera.</string>
After installing and configuring the package, lets head over to the App.tsx and add this piece of code
Then run your project on a real Android Device and see your Squats Counter in effect.
Hooray!!
Reach me out
LinkedIn: https://www.linkedin.com/in/himanshu--saini/
Email: himanshu.saiini.91@gmail.com