How to consume remove.bg API in React Native and removing a background image

 

Remove.bg is an online application to remove image background, with just one click, we can also use Remove.bg API for personal.

Remove.bg has many services that we can use, namely Command Line Interface, remove.bg for Linux, mac, and windows, Android App, and many more. I will share How to consume (remove.bg) and How to consume remove.bg API in React Native and removing a background image, Here's how to do it

 

1. Siapkan alat yang pelu disapkan, seperti berikut ini:

• Visual studio code, is a code editor to develop applications for free and easy, download link.
• Android SDK, you can use the Android SDK available in the Android Studio app, if you installed it, download link.
• Android phones, phone are used to test the app, in this case, the app consumes the remove.bg API, if you don't have a phones you can use the Android Emulator belonging to the android studio, download link.

2. Install react-native and library packages

the following libraries are used:

• react-native-image-picker is used to take pictures from the file manager, to be uploaded to the remove.bg server.
• react-native-blob-util as an HTTP client to receive image media response from a remove.bg API.
• react-native-scoped-storage as storage permissions, since the start of 2021, Google is enforcing all apps to use Scoped Storage to store or read files on a user's device. This library provides an API for react-native to use scoped storage in their apps. Scoped storage allows you to prompt the user that you need access to some files/folders. The user can allow access to their desired location. It is your responsibility to store the URI you receive for later use.

3. Running application

• First, you will need to start Metro, the JavaScript bundler that ships with React Native. Metro "takes in an entry file and various options, and returns a single JavaScript file that includes all your code and its dependencies." 

To start Metro, run npx react-native start inside your React Native project folder:

• Start your applications, and let Metro Bundler run in its terminal. Open a new terminal inside your React Native project folder. Run the following:

4. Writing code

• Choose photo
• Handle uploading photo
• Save to gallery
• Full script

May be useful, thanks.