How QR code changes modern society

A QR code (quick-response code) is a type of two-dimensional matrix barcode. It is widely used today and has become a part of our modern life. This post will bring you a brief look about it.

History

The QR code system was invented at the Denso Wave automotive products company, in 1994, in Japan. The initial square design of QR code was presented by the team of researchers, headed by Masahiro Hara. QR code was used to keep track of the types and numbers of automobile parts. Because QR code is painted in black and white, it is easy to scan with an optical scanner or today’s smartphone.

Features

High Capacity

Can store a large amount of data, including numeric, alphanumeric, binary, and Kanji characters.
Capable of storing up to 7,089 characters.

Error Correction

Includes error correction capabilities, allowing data to be read even if part of the code is damaged.
Four levels of error correction (L, M, Q, H) to improve robustness.

Fast Reading

Designed for high-speed reading.
Can be read in any direction (360 degrees) for quick scanning.

Versatile

Can be used for various applications like URL sharing, contact information, payments, authentication, etc.

How it works

Black and white are presenting binary data 0 and 1. After decoding binary data, you will get the actual string that was encoded. The layout is fixed to make sure you can get correct data even if you scan with different orientations.
(1) Version information: The version of the QR code is being read (1 ~ 40)
(2) Format information: Correction level (L, M, Q, H), numeric mode, alphanumeric mode, byte mode, kanji mode.
(3) Data and error correction keys: actual data and correction.
(4) Required patterns: these blocks are required on every QR code.
(4.1) Position: The orientation of this QR code.
(4.2) Alignment: The alignment makes sure you can scan in different
angles.
(4.3) Timing: A L-shaped line that helps to identify individual squares. Squares will become smaller when you have more data to encode.
(5) Quiet zone: Optional. The empty area around the QR Code.

Applications

Mobile Payments: Today’s smartphones have the ability to scan QR by default. It is easy to pay when shopping or transferring money.

Marketing: Advertisements, brochures, and product packaging to provide additional information.

Authentication: It is used by two-factor authentication systems or scanning to login.

Logistics: Tracking shipments and inventory management.

Event Ticketing: Electronic tickets and check-ins at events.

Create your own QR code

I will use React and the QR library to generate my own QR code. You only need to add a QR library to your project. Install using npm or yarn .

npm install -S react-qr-code

or

yarn add react-qr-code

After installing you can import the QRCode component and use it. In this example I will create a 512×512 QR code. Value is the actual data.

import { FC } from "react";
import QRCode from "react-qr-code";

const QRCodeGenerator: FC = () => {
  return (
  <div style={{display: "flex", alignItems: "center", justifyContent: "center"}}>
    <QRCode
      size={512}
      style={{ height: "auto", maxWidth: 512, width: "100%" }}
      value={"https://josysnavi.jp"}
      viewBox={"0 0 512 512"}
    />
  </div>
  );
};

export default QRCodeGenerator;

The result is on the top of this post. If you want to encode/decode QR code you can use the qrcode library.

Summary

QR codes have become an integral part of modern technology, bridging the gap between physical and digital worlds, enabling seamless information transfer and interaction. People today don’t have to bring much money with them, just a smartphone with a linked bank account and are ready to go.

References:
QR code – Wikipedia
QR Code: What Is It And How Do You Scan It