diff --git a/_includes/samples_index.html b/_includes/samples_index.html index 6f6bb394..28f7d4e2 100644 --- a/_includes/samples_index.html +++ b/_includes/samples_index.html @@ -1042,10 +1042,10 @@
- + 🚀 Quick Start -
Hello World - Scan Your First Barcode
-
The simplest example to get started with barcode scanning in under 2 minutes
+
Hello World - Scan Multiple Barcodes
+
The simplest example to get started with barcode scanning. Continuously scans and collects multiple unique barcodes
+ +
+

+ Hello World Samples (3) +

+
+
+
+ Hello World (Scan Multiple Barcodes)Source +
+
+ Scan a Single BarcodeSource +
+
+ Read an ImageSource +
+
+

@@ -1278,7 +1320,7 @@

- Scenario Samples (17) + Scenario Samples (18) >

+
+ Tip and BeepSource +
Scan and Search - + Code in Github   @@ -92,7 +92,7 @@ The complete code of the "Hello World" example is shown below Run via JSFiddle   - + Run in Dynamsoft

@@ -137,7 +137,7 @@ The complete code of the "Hello World" example is shown below ### Run the example -You can run the example deployed to [the Dynamsoft Demo Server](https://demo.dynamsoft.com/Samples/DBR/JS/hello-world.html?ver=11.4.20&utm_source=guide) or test it with [JSFiddle code editor](https://jsfiddle.net/DynamsoftTeam/csm2f9wb/). +You can run the example deployed to [the Dynamsoft Demo Server](https://demo.dynamsoft.com/Samples/DBR/JS/basics/hello-world.html?ver=11.4.20&utm_source=guide) or test it with [JSFiddle code editor](https://jsfiddle.net/DynamsoftTeam/csm2f9wb/). You will be asked to allow access to your camera, after which the video will be displayed on the page. After that, you can point the camera at a barcode to read it. @@ -207,7 +207,7 @@ Besides using the public CDN, you can also download the SDK and host its files o [Download Dynamsoft Barcode Reader JavaScript Package](https://www.dynamsoft.com/barcode-reader/downloads/?ver=11.4.20&utm_source=guide&product=dbr&package=js) - The resources are located at path `dynamsoft/distributables/@`. + The resources are located at path `dynamsoft-barcode-reader-js-{version-number}/dist/`. - From npm diff --git a/programming/javascript/user-guide/zip-guide.md b/programming/javascript/user-guide/zip-guide.md index baf0f5b9..63949afe 100644 --- a/programming/javascript/user-guide/zip-guide.md +++ b/programming/javascript/user-guide/zip-guide.md @@ -43,7 +43,7 @@ Dynamsoft provides a complimentary trial license for the SDK. When you download ## Quick Start -Double-click `samples/hello-world.html` to instantly see a fully functional web application that scans barcodes using your device's camera! You can also try `samples/read-an-image.html` to decode barcodes from an image file. +Double-click `samples/basics/hello-world.html` to instantly see a fully functional web application that scans barcodes using your device's camera! You can also try `samples/basics/read-an-image.html` to decode barcodes from an image file. >[!NOTE] > These samples load the SDK from a CDN so they can be opened directly as local files without a web server. An internet connection is required. To serve everything from the local `dist/` folder, see [Deploying to Your Server](#deploying-to-your-server). @@ -57,7 +57,7 @@ Double-click `samples/hello-world.html` to instantly see a fully functional web After unzipping, you should see the following structure: - `dist/` — All Barcode Reader JavaScript SDK resources (`.js`, `.wasm`, worker files, etc.) -- `samples/` — Sample projects, including standalone examples (`hello-world.html`, `read-an-image.html`), framework integrations, and scenario demos +- `samples/` — Sample projects, including basic examples, framework integrations, and scenario demos - `LICENSE` — Dynamsoft license terms - `LEGAL.txt` — Third-party license notices @@ -95,7 +95,9 @@ Here are a couple of easy ways to start a local web server: ## Sample Folders -The package includes two main sample directories: +The package includes three main sample directories: + +- **`basics/`** - Simple standalone examples to get started quickly, including `hello-world.html` (scan multiple barcodes from a live camera), `scan-a-single-barcode.html`, and `read-an-image.html` (decode barcodes from an image file). - **`frameworks/`** - Framework-specific examples showing how to integrate the Dynamsoft Barcode Reader into common web and hybrid frameworks. Included frameworks: Angular, Blazor, Capacitor, Electron, ES6, Native TypeScript, Next.js, Nuxt, PWA, React, RequireJS, Svelte, Vue, and WebView. @@ -120,18 +122,7 @@ When you're ready to deploy your application to production, copy the `dist` fold @@ -141,6 +132,24 @@ When you're ready to deploy your application to production, copy the `dist` fold --- +## Vibe Coding with AI Agents + +This zip package ships an **AI coding skill** that gives GitHub Copilot, Claude, and Codex deep knowledge of the Dynamsoft Barcode Reader JavaScript SDK — so you can describe what you want and get working code instantly. + +### How It Works + +The skill lives in: + +``` +.github/skills/dbr-js-sample-creator/ ← GitHub Copilot (auto-discovered) +.claude/skills/dbr-js-sample-creator/ ← Claude Code (auto-discovered) +.codex/skills/dbr-js-sample-creator/ ← OpenAI Codex (auto-discovered) +``` + +No installation or configuration needed — just open this working directory in your AI-enabled editor. + +--- + ## Documentation For API reference and more advanced usage, visit: