Comprehensive guide for installing barKoder's React Native Barcode Reader SDK

Accelerate your barcode scanning with ease using barKoder's React Native Plugin and the Installation Guide discussed in this article. With our step-by-step instructions, you can get started quickly and effortlessly. Simply follow the steps below to install the SDK and start experiencing the benefits of the best Barcode Scanner SDK in the market.

1. Get everything ready for the task at hand

Make sure to install all the necessary dependencies required for the system to function properly. Setup your environment

2. Add the "barkoder-react-native" package

If you want to add the 'barkoder-react-native' package to your project, you're in luck! You have two fantastic options to choose from. Get started on your project today by selecting the option that works best for you! You can either use the barkoder-react-native package from npm or from a local path.

To use the package from npm run the following command:

 yarn add barkoder-react-native

→ Keep the above in mind if you are using YARN in your project

 npm install barkoder-react-native

→ Keep the above in mind if you're working on a project that involves the use of NPM

If you prefer to use a local package, download the package from the barKoder Developer Portal's Repository. To add the package, first unzip the archive and afterwards set the following package path

 yarn add <path to barkoder-react-native package>

if you are using NPM in your project.

If you are experiencing issues with your iOS device, try reinstalling the dependencies by running the 'pod install' command located in the iOS folder.

 cd ios 
 pod install

3. Remember to import the package

To add the barkoder-react-native package to your project, you'll need to import it. Use the following command to import it successfully:


 import { Barkoder, BarkoderView } from 'barkoder-react-native';

4. BarkoderView

You have successfully imported and installed the 'barkoder-react-native' package. For adding the BarkoderView in your layout, you need to set the licenseKey parameter and onBarkoderViewCreated callback.

<SafeAreaView style={styles.container}> 
   ... 
    <BarkoderView 
    style={styles.barkoderView} 
    licenseKey="KEY" 
    onBarkoderViewCreated={(barkoder: Barkoder) => onBarkoderViewCreated(barkoder)} /> 
   ...

The barKoder license key is a string of alphanumeric characters that will grant you exclusive access to our advanced tools and functionalities. See Section 7 to learn how to get a valid license.

5. Ready to Scan Event

When the onBarkoderViewCreated callback function is called, it means that the SDK is fully initialized and ready for configuration or scanning.

async function onBarkoderViewCreated(_barkoder: Barkoder) {
 barkoder.setBarcodeTypeEnabled(Barkoder.BarcodeType.qr, true);
 barkoder.setRegionOfInterestVisible(true);
 ...
 setBarkoder(barkoder);
}
function scanPressed() {
 barkoder.startScanning((result) {
   // The result from successful scan is received here
 });
}

To fully understand how to use the barkoder-react-native package, please refer to our sample.

6. Grant permission to access the camera

To use the scanning features of the barKoder SDK, you'll need to grant camera permission. For Android devices, set the permission in the manifest from the package itself. For iOS devices, specify camera permission in the Info.plist file within your project.

<key>NSCameraUsageDescription</key>
<string>Camera permission</string>

7. Licensing

The barKoder SDK will scan barcodes even without a valid license, with the caveat that all results returned upon successful scans will be randomly masked with Asterisks (*). By using our software you automatically agree to uphold our End User License Agreement.

If you want to obtain a valid license, one should create an account on the barKoder Portal and either get a completely free trial license or subscribe to a paid plan which will grant a production license that can be used within a live app.