This template app can be used for real time object detection by leveraging the Tensorflow Object Detection API, React and Tensorflow JS. In order to leverage this template, first walk through the Tensorflow Object Detection Course available on YouTube. Complete the Notebook up to Step 11. Conversion to TFJS.
Step 1. Clone this repository: https://github.com/nicknochnack/TFODApp
Step 2. Install Node https://nodejs.org/en/
Step 3. Install App Depdendencies
npm install
Step 4. Create a new free object storage repository on IBM Cloud Create Cloud Object Storage Bucket
Step 5. Create a new bucket and store model.json and .bin files into the bucket.
Step 6. Enable public access policy.
Step 7. Download and install the Cloud Object Store plugin.
Step 8. Login to the IBM Cloud CLI, target the right region and run the following command from inside of the TFODApp folder.
ibmcloud cos bucket-cors-put --bucket livelong --cors-configuration file://corsconfig.json
Step 9. Update the following line with the link to your model.json file inside of the cloud bucket.
const net = await tf.loadGraphModel('YOUR MODEL.json file here')
// e.g. const net = await tf.loadGraphModel('https://livelong.s3.au-syd.cloud-object-storage.appdomain.cloud/model.json')
This URI is available from your bucket. Select the model.json file then choose object details and the link will be made available.
Step 10. Update the labelmap inside of utilities.js with your labels.
Step 11. Start the app by running npm start.
npm start
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent