{"id":21880757,"url":"https://github.com/maslick/koder","last_synced_at":"2025-04-05T02:12:07.300Z","repository":{"id":41238744,"uuid":"234297857","full_name":"maslick/koder","owner":"maslick","description":"QR/bar code scanner for the Browser","archived":false,"fork":false,"pushed_at":"2023-11-09T17:24:30.000Z","size":3903,"stargazers_count":256,"open_issues_count":4,"forks_count":28,"subscribers_count":11,"default_branch":"master","last_synced_at":"2025-04-03T12:02:28.127Z","etag":null,"topics":["barcode","covid-19","covid-certificate","ean13","ean8","emscripten","i25","pwa","qr","qrcode","react","upca","upce","wasm","webassembly","zbar"],"latest_commit_sha":null,"homepage":"https://koder-prod.web.app","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/maslick.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"patreon":"maslick","custom":["buymeacoffee.com/maslick","paypal.me/maslick"]}},"created_at":"2020-01-16T10:44:33.000Z","updated_at":"2025-04-03T03:11:12.000Z","dependencies_parsed_at":"2023-02-17T09:30:42.934Z","dependency_job_id":"725d796d-28a3-4d89-93aa-ca5abb30e59b","html_url":"https://github.com/maslick/koder","commit_stats":{"total_commits":229,"total_committers":5,"mean_commits":45.8,"dds":"0.43231441048034935","last_synced_commit":"a2f3a9aa7c8781d74274950134ee08a1c88e5129"},"previous_names":[],"tags_count":21,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/maslick%2Fkoder","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/maslick%2Fkoder/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/maslick%2Fkoder/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/maslick%2Fkoder/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/maslick","download_url":"https://codeload.github.com/maslick/koder/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247276189,"owners_count":20912288,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["barcode","covid-19","covid-certificate","ean13","ean8","emscripten","i25","pwa","qr","qrcode","react","upca","upce","wasm","webassembly","zbar"],"created_at":"2024-11-28T09:15:53.020Z","updated_at":"2025-04-05T02:12:07.272Z","avatar_url":"https://github.com/maslick.png","language":"JavaScript","readme":"\u003cp align=\"right\"\u003e\n  \u003ckbd style=\"background-color:#f03c15; color: white; padding: 10px;\"\u003e\n    🚀 NEW: Check Out \u003ca style=\"text-decoration:none\" href=\"https://github.com/maslick/kameroon\"\u003eKameroon\u003c/a\u003e - QR/Bar Code Scanner as a Service 🚀 \n  \u003c/kbd\u003e\n\u003c/p\u003e\n\n\n# =koder=\nQR/bar code scanner for the Browser\n\n[![npm](https://img.shields.io/npm/v/@maslick/koder.svg)](https://www.npmjs.com/package/@maslick/koder)\n[![Build Status](https://github.com/maslick/koder-react/actions/workflows/prod.yml/badge.svg)](https://github.com/maslick/koder-react/actions?query=workflow%3Abuild)\n[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](./LICENSE)\n\n## :bulb: Demo\nhttps://koder-prod.web.app\n\n\n## 🚀 Features\n* QR/barcode module implemented in WebAssembly\n* Barcode support (ISBN, UPC-A, UPC-E, EAN-8, EAN-13, I25, ITF-14, CODE-128, CODE-39, CODE-93, CODABAR, DATABAR)\n* Uses Zbar C++ library (version [0.23.90](https://github.com/mchehab/zbar))\n* Packaged as PWA (caching files with Service Worker, Add to Home Screen)\n* Mobile first (can be used on a Laptop as well)\n* Multiplatform (iOS, Android, Desktop)\n* QR/bar code recognition logic is performed off the browser's Main thread (i.e. Web Worker)\n* *koder* React component supports a [jsqr](https://www.npmjs.com/package/jsqr) based Web Worker (see [jsQrWorker.js](./public/jsQrWorker.js))\n* Emscripten-zbar-sdk [Docker image](https://hub.docker.com/r/maslick/emscripten-zbar-sdk) based on `emscripten/emsdk`, [Dockerfile](./docker/Dockerfile)\n* ReactJS [component](./src/components/scan.js)\n* Vanilla JS [example](https://github.com/maslick/koder-vanilla-js)\n* :new: Turn on/off the beep sound\n* :new: Support for UPN QR (Slovenia only)\n* :new: EU Digital Covid Certificate validator (vaccination, test), works in ``offline`` mode!\n* :new: Emscripten v3.1.1\n* :new: npm package\n\n\n\u003cp align=\"center\" \u003e\n  \u003cimg src=\"./screenshots/app_1.png\" width=\"400px\" /\u003e\n  \u003cimg src=\"./screenshots/app_2.png\" width=\"400px\" /\u003e\n\u003c/p\u003e\n\n## ⚡ Usage\n\n### Install dependencies\n```shell\nnpm install --global yarn\nyarn install --frozen-lockfile\n```\n\n### Run React app\n```shell\nnpm run start\nopen https://locahost:8080\n```\n\n### Productionize\n```shell\nnpm run build                # -\u003e build React app into ./public\nnpm run prod                 # -\u003e serve static web app on port 8082\nopen http://localhost:8082\n```\n\n## ⚡ NPM module\n```\nnpm install @maslick/koder\n```\n\n```javascript\n// CommonJS\nconst Koder = require('@maslick/koder');\n\n// ES6 modules\nimport Koder from '@maslick/koder';\n```\n\n```javascript\nconst Koder = require('@maslick/koder');\nconst {loadImage, createCanvas} = require(\"canvas\");\n\nconst getImageData = async (src) =\u003e {\n  const img = await loadImage(src);\n  const canvas = createCanvas(img.width, img.height);\n  const ctx = canvas.getContext('2d');\n  ctx.drawImage(img, 0, 0);\n  return {\n    data: ctx.getImageData(0, 0, img.width, img.height).data,\n    width: img.width,\n    height: img.height\n  };\n};\n\n(async () =\u003e {\n  const url = 'https://raw.githubusercontent.com/maslick/koder/master/screenshots/app_1.png';\n  const koder = await new Koder().initialized;\n  const {data, width, height} = await getImageData(url);\n\n  const t0 = new Date().getTime();\n  const res = koder.decode(data, width, height);\n  const t1 = new Date().getTime();\n\n  console.log(`Scanned in ${t1-t0} ms`);  // Scanned in 7 ms\n  console.log(res);                       // http://en.m.wikipedia.org\n})();\n```\n\n## :spades: Development\n\n### Fetch or build the Builder image\n```shell\ndocker pull maslick/emscripten-zbar-sdk\ndocker build -t maslick/emscripten-zbar-sdk -f docker/Dockerfile docker\n```\n\n### Build WASM artifacts\n```shell\n# Linux, Mac Intel\ndocker run \\\n  -e INPUT_FILE=zbar/qr.cpp \\\n  -e OUTPUT_FILE=zbar \\\n  -e OUTPUT_DIR=public/wasm \\\n  -v $(pwd):/app \\\n  maslick/emscripten-zbar-sdk make -B\n  \n# Mac M1/M2\ndocker run \\\n  --platform linux/amd64 \\\n  -e INPUT_FILE=zbar/qr.cpp \\\n  -e OUTPUT_FILE=zbar \\\n  -e OUTPUT_DIR=public/wasm \\\n  -v $(pwd):/app \\\n  maslick/emscripten-zbar-sdk make -B\n```\n\n### Clean the build artifacts (if necessary):\n```shell\nOUTPUT_DIR=public/wasm OUTPUT_FILE=zbar make clean\n```\n\n\n## 🔭 References\n* [WebAssembly at Ebay](https://tech.ebayinc.com/engineering/webassembly-at-ebay-a-real-world-use-case/)\n* [Barcode Scanner WebAssembly](https://barkeywolf.consulting/posts/barcode-scanner-webassembly/)\n* [zbar.wasm](https://github.com/samsam2310/zbar.wasm)\n","funding_links":["https://patreon.com/maslick","buymeacoffee.com/maslick","paypal.me/maslick"],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmaslick%2Fkoder","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmaslick%2Fkoder","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmaslick%2Fkoder/lists"}