sudeen / React-Barcode-Generator-Scanner

A simple ⚛️ React app to generate & scan barcode

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

simplinnovation

React Barcode Scanner & Generator

A simple React application to generate & scan barcode.

  • Demo:

    Click the following picture to see the demo video:

    Video

  • Clone this repo:

    $ git clone https://github.com/LintangWisesa/React-Barcode-Generator-Scanner.git
    $ npm i
    $ npm start
  • React UI Kit: Material UI

    Install Material UI core:

    $ npm i @material-ui/core @material-ui/icons
  • Icons: Material Design Icons

    Install Material Design Icons:

    $ npm i @mdi/react @mdi/js @mdi/font

    Add these lines on ./public/index.html head:

    <!-- Roboto fonts -->
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" />
    <!-- Material Icons fonts -->
    <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
  • Barcode Generator: react-barcode

    Install react-barcode:

    $ npm i react-barcode
  • Barcode Scanner: quagga

    Install quagga:

    $ npm i quagga
  • Preview

    Home Page

    ./img/Home.png

    Barcode Generator Page

    ./img/QRgenerator.png

    Barcode Scanner Page

    ./img/QRscanner.png


🍔 Lintang Wisesa


lintang ymail lintang facebook lintang twitter lintang youtube lintang linkedin lintang github lintang hackster lintang bio

About

A simple ⚛️ React app to generate & scan barcode


Languages

Language:JavaScript 79.5%Language:HTML 13.8%Language:CSS 6.7%