Image Recognition Widget:

It is a sophisticated image recognition widget that utilizes the Google Cloud Vision API to identify objects in images. This widget can be seamlessly integrated into any web project either as a standalone JavaScript library or as a component within a Svelte framework.

Installation

Setting Up the Demo Application

1. Clone the repository:

   git clone https://github.com/aresobus/image-recognition-widget.git
   cd image-recognition-widget
   npm ci

2. Configure your API key:

   • Complete the Google Cloud Vision API setup.
   • Acquire an API Key and enter it in demo/config.json.

3. Launch the demo application:

   npm start

Using a Library

To install Recog in your project:

npm install @aresobus/image-recognition-widget

Vanilla JavaScript Integration

import RecogWidget from '@aresobus/image-recognition-widget';

new RecogWidget({
  target: document.querySelector('.some-container'),
  props: {
    apiUrl: 'https://vision.googleapis.com/v1/images:annotate?key=<YOUR_VISION_API_KEY>'
  }
});

Svelte Component Integration

<script>
  import RecogWidget from '@aresobus/image-recognition-widget';
  const apiUrl = 'https://vision.googleapis.com/v1/images:annotate?key=<YOUR_VISION_API_KEY>'
</script>

<RecogWidget {apiUrl} />

Styling with TailwindCSS

Library is styled using TailwindCSS, ensuring a modern and clean look.

Development

• To run unit tests:

  npm test

• To start the development server:

  npm dev

• To lint the code:

  npm lint