〜家庭内DX〜 バーコードリーダーの作成
26卒予定のしがない学生エンジニアです。この記事では、日常のDX化としてちょっとしたバーコードリーダーを作成したので、ご紹介します。
リポジトリは以下に公開してますが、4時間程度で作ったものなので、クオリティは低いです。
https://github.com/ei-sugimoto/barcodeScan
背景
大学院のオンライン授業を受けたあと、昼飯を食べつつ母親の愚痴を聞く、というのが日課になっていました。ある時に、バーコードの写真を消すを見たのでなぜ消しているのか尋ねると、「箱のバーコードを読み取るのが面倒」とのことでした。
母は配達業をしており、配達終了時にバーコードを会社の端末で読み取るのですが、配達用の箱が大きいので、事前に自分の携帯で写真を撮って、それを読み取っていました。しかし、毎回バーコードの写真を消すのが大変でした。母親のフォルダがバーコードの写真ばかりになり、icloudの容量がなくなる未来を危惧した私は、早速バーコードを読み取るwebアプリを作成しようと思いました。
要件
- バーコード(code128)を読み取る
- 読み取ったバーコードからバーコードを新たに生成する
- 箱は1つじゃないので、複数のバーコードを読み取れるようにする
- iphoneのタブを削除されれば、初期化される
技術選定
-
言語
javascript -
フレームワーク
react.js -
OSS
- quaggaJS
- jsbarcode
-
Hosting
- github pages
フローチャート
![](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F3779682%2Fc39e40d3-8a5a-3e36-28d8-d7895ddd5cb7.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=20aac185128ee9e6aed548e9620c25d5)
動作画像
終わりに
バーコードを扱ったことがなかったので、とても新鮮でした。バーコードの種類を特定するのが、一番難しいまでありました。ぜひ、日常のちょっとしたこともDXしていきましょう〜