A simple ⚛️ React app to generate & scan QR code
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