TypeScriptを使用してQRCodeを作成します

#TypeScript

Charu Srivastava

2023.10.11

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

こんにちは、クラスメソッドからチャールです. このブログで、QRコードを簡単な手順で作成する方法について説明します。

始めましょう！

1. 始めるには、まず以下のコマンドを使用してコンピュータにディレクトリを作成しましょう、

mkdir qr-code-generator
cd qr-code-generator

2. 次に、プロジェクトのためにTypeScriptをインストールします。

npm init -y
npm install --save-dev typescript ts-node
npx tsc --init

3. QRコードを生成するためにqrcodeライブラリを使用します。次のコマンドでインストールします。

npm install qrcode

4. index.tsという名前のファイルを作成し、お気に入りのコードエディタで開きます。私はVSCodeを使っています。

import * as QRCode from "qrcode";

const generateQRCode = async (
  data: string,
  filename: string
): Promise<void> => {
  try {
    const qrCode = await QRCode.toFile(filename, data);
    console.log(`QR Code generated successfully at: ${filename}`);
  } catch (error) {
    console.error("Error generating QR Code:", error);
  }
};

const dataToEncode = "https://www.example.com";
const outputFileName = "example-qrcode.png";

generateQRCode(dataToEncode, outputFileName);

このコードは「generateQRCode」というファンクションを定義しており、qrcodeライブラリを使用してQRコードを生成します。これは、お選びのURLのQRコードを生成する方法です。「https://www.example.com」の代わりに、QRコードをスキャンしてアクセスしたいリンクを入力できます。

5. 以下のコマンドを使用してTypeScriptコードをコンパイルおよび実行します。