Developer Tutorial: Getting to Your First Scan

| Developers

SparkScan

If you haven’t already signed up for Scandit’s free trial, go ahead and do that now before reading on. And if you have – congratulations and let’s get started with the industry leading barcode scanning and smart data capture solution!

By now you’ve probably been to the Dashboard and created your first license key:

Scandit Dashboard

At this point you may have been left staring at the screen thinking “Now what?” That’s OK! This post will guide you through using that new license key with one of our many sample applications to get you scanning your first barcodes or IDs in just a few minutes.

Before We Begin

Before diving in, there are a few minimum requirements that you’ll need to be able to proceed:

  • GitHub account (and Git installed)
  • Suitable development environment for your chosen framework (e.g. XCode for iOS)

If you don’t have or don’t want to deal with the above requirements, have a look at Scandit Express, the no-code solution to quickly integrate Scandit Smart Data Capture into any application. Alternatively, download one of our demo apps.

Getting Started

Let’s start with a general overview of the steps regardless of which framework you’re working in, and at the end we’ll go through a complete example using the Web SDK.

Clone the Samples Repository

We maintain a comprehensive set of sample applications on GitHub for all SDK capabilities and industry use cases, for each of our supported frameworks.

The sample applications are hosted together according to framework, so you only need to clone the repository for the framework you’re working in. For example:

git clone https://github.com/Scandit/datacapture-web-samples.git

Open the Sample Application

You probably noticed several different sample applications in the repository cloned above. For this post we’ll focus on the BarcodeCaptureSimpleSample, but you can use these same steps to try out the rest.

In your preferred IDE, open the BarcodeCaptureSimpleSample directory from the cloned repository.

Navigate to the directory and file where you’ll insert the license key created earlier. This will vary depending on the framework, for example:

// Android
BarcodeCaptureSimpleSample/src/main/java/com/scandit/datacapture/barcodecapturesimplesample/BarcodeScanActivity.java

// iOS Swift
BarcodeCaptureSimpleSampleSwift/BarcodeCaptureSimpleSampleSwift/ViewController.swift

// Web
BarcodeCaptureSimpleSample/index.ts

// Cordova
BarcodeCaptureSimpleSample/template_src/www/index.js

//React Native
BarcodeCaptureSimpleSample/app/App.tsx

Insert Your License Key

Jump back to the Scandit Dashboard and copy the license key you created earlier. Now just return to the directory and file we located above, and paste the license key where indicated. For example:

// Android
public static final String SCANDIT_LICENSE_KEY = “”

// iOS Swift
private static let licenseKey = “”

// Web
await configure({
    licenseKey: “”
    ...
});

// Cordova
const context = Scandit.DataCaptureContext.forLicenseKey(“”);

//React Native
return DataCaptureContext.forLicenseKey(“”);

Save the changes to this file once you have pasted your license key.

Compile and Run

You’re nearly done, all that’s left now is to run the sample application from your chosen IDE. Once compiled and launched, you can scan away on any barcode in sight! You can also use our barcodes sample sheet.

Full Web SDK Sample

Up to this point we’ve tried to provide a general guide in a platform agnostic manner, but in this section we’ll go step-by-step using the Web SDK samples for a complete example getting to your barcode scan with Scandit.

Along with the preparations at the beginning of this post, be sure you have installed the latest version of Node. Once done, we can get started!

  1. Clone the datacapture-web-samples repository as detailed above.
  2. Open the folder where you cloned the repository and navigate to the
    /BarcodeCaptureSimpleSample directory.
  3. Open the /.index.ts file your desired text editor or IDE.
  4. Return to the Scandit Dashboard and copy the license key you created earlier.
  5. Paste the license key in the corresponding field of the /.index.ts file.
  6. Save the updated /.index.ts file.
  7. Open a terminal window and set the simple barcode capture example as your working directory:
    cd datacapture-web-samples/BarcodeCaptureSimpleSample
    (the exact path will vary depending on where you cloned the repository)
  8. Run the following command to install are the required dependencies: npm install
  9. Start the sample application: npm run start
  10. Finally serve the application: npm run serve

Following the last command, the sample app should have launched automatically in your browser, but if not, simply navigate to http://localhost:8888 in your browser and scan away!

Next Steps

Now that you have your first scan out of the way, you can play around with the other sample applications to see some of the more advanced features in action, dive into our documentation to start integrating the SDK into your own application, or contact us if you’re ready to get started.