simplinnovation

React QR Code Scanner & Generator

A simple React application to generate & scan Quick Response code (QR code).

Demo:

Click the following picture to see the demo video:

Clone this repo:

$ git clone https://github.com/LintangWisesa/React-QR-Scanner-Generator.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" />

QR Generator: qrcode.react

Install qrcode.react:
```
$ npm i qrcode.react
```
QR Scanner: react-qr-reader

Install react-qr-reader:
```
$ npm i react-qr-reader
```
Preview

Home Page

QR Generator Page

QR Scanner Page