Barcode scanner for a react application

Question

I'm developing a reactjs application, there i need to read bar code values and scanned value should be popped up in a specific text box, any idea or at least i need to know if this is how feasible to do ..

I need to use a physical USB Barcode scanner.

Answer 1

This component helps to read the barcode from device into react application.

https://www.npmjs.com/package/react-barcode-reader

import React, { Component } from 'react'
import BarcodeReader from 'react-barcode-reader'


    class Test extends Component {
      constructor(props){
        super(props)
        this.state = {
          result: 'No result',
        }

        this.handleScan = this.handleScan.bind(this)
      }
      handleScan(data){
        this.setState({
          result: data,
        })
      }
      handleError(err){
        console.error(err)
      }
      render(){

        return(
          <div>
            <BarcodeReader
              onError={this.handleError}
              onScan={this.handleScan}
              />
            <p>{this.state.result}</p>
          </div>
        )
      }
    }

Answer 2

Doing a google search I found this https://lindell.me/JsBarcode/ it generates barcodes

This will read barcodes https://www.npmjs.com/package/barcode-js