https://github.com/seanvelasco/barcode-kit

<Barcode/> and <BarcodeReader/> components for React, Svelte, and Solid.js for reading and generating barcodes and QR codes
https://github.com/seanvelasco/barcode-kit

barcode barcode-generator barcode-reader barcode-scanner qrcode qrcode-generator qrcode-reader qrcode-scanner react reactjs svelte sveltejs sveltekit

Last synced: 3 months ago
JSON representation

<Barcode/> and <BarcodeReader/> components for React, Svelte, and Solid.js for reading and generating barcodes and QR codes

• Host: GitHub
• URL: https://github.com/seanvelasco/barcode-kit
• Owner: seanvelasco
• Created: 2023-09-26T19:30:56.000Z (about 1 year ago)
• Default Branch: main
• Last Pushed: 2024-04-17T16:51:21.000Z (8 months ago)
• Last Synced: 2024-10-03T03:07:20.653Z (3 months ago)
• Topics: barcode, barcode-generator, barcode-reader, barcode-scanner, qrcode, qrcode-generator, qrcode-reader, qrcode-scanner, react, reactjs, svelte, sveltejs, sveltekit
• Language: TypeScript
• Homepage:
• Size: 271 KB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 2
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# barcode-kit

Read and generate barcodes and QR codes in React and Svelte.

## Features

- Read barcodes and QR codes from a webcam or camera

- Generate barcodes and QR codes

- React and Svelte components

- Works on mobile

- JavaScript-native with TypeScript support

## Installation

### React

```bash

npm install react-barcode-kit

```

### Svelte

```

npm install svelte-barcode-kit

```

## Usage

### React

#### Barcode Reader

```tsx

import { useState } from "react"

import { BarcodeReader } from "react-barcode-kit"

function App() {

  const [barcode, setBarcode] = useState(null)

  return (

    


      

      
{barcode}

    

  )

}


export default App

```

#### Barcode Generator

```tsx

import { Barcode } from "react-barcode-kit"

function App() {

  return (

    


      Your data goes here

    

  )

}


export default App

```

### Svelte

#### Barcode Reader

```html

    import { BarcodeReader } from "svelte-barcode-kit"

    

    let barcode = null

    const handleBarcode = (data) => {

        barcode = data

    }

{barcode}

```


#### Barcode Generator

```html

    import { Barcode } from "svelte-barcode-kit"

Your data goes here

```

## Barcode Options

## Acknowledgements

- [zxing](https://github.com/zxing-js/library)

- [JsBarcode](https://github.com/lindell/JsBarcode)

## License