# Example App: Integrating with Reflex Platform

## Purpose

This repository contains an example Vue application demonstrating how to integrate with the Reflex Platform, a powerful tool developed by Hardis Group. This example app showcases how to leverage the Reflex Platform's APIs to build custom integrations and extend the capabilities of your warehouse management system using modern web technologies. It makes use of the [Reflex Platform NPM SDK](https://git.reflex-platform.com/reflex-platform/npm-core-sdk) to demonstrate how to fetch data, and perform key operations within the Reflex Platform ecosystem.

Whether you're a developer looking to understand how to interact with Reflex Platform's services or a business seeking to evaluate the integration potential, this example app provides a hands-on starting point.

## Features

- Demonstrates basic integration with Reflex Platform APIs
- Illustrates authentication flows and API request patterns
- Built with Vue 3 and Vite for modern web development
- Serves as a template for building more complex integrations

## Getting Started

To get started with this example Vue application, follow the steps below:

### 1. Clone the Repository

First, clone this repository to your local machine:

```bash
git clone https://git.reflex-platform.com/reflex-platform/vue-rp-example.git
cd vue-rp-example
```

### 2. Obtain a Reflex Platform Client ID

This example app requires a Reflex Platform client ID for authentication purposes. To obtain this, you need to get in contact with a Hardis representative. The representative will provide you with a unique `VITE_KEYCLOAK_CLIENT_ID` that you'll use to authenticate API requests.

### 3. Configure the Application

Once you have your `VITE_KEYCLOAK_CLIENT_ID`, you'll need to replace the placeholder value in the application with your actual client ID.

1. Create a .env file in the project root (use `.env.example` as a template)
2. Locate the line that defines `VITE_KEYCLOAK_CLIENT_ID`:

```dart
VITE_KEYCLOAK_CLIENT_ID='your_client_id_here';
```

3. Replace `'your_client_id_here'` with the client ID you received from Hardis.

### 3. Run the Application

With the configuration in place, you can now run the Vue application. Use the following commands:

1. Ensure you have all the necessary dependencies installed:

```bash
npm install
```

2. Run the application on your preferred device or emulator

```bash
npm run dev
```

### 4. Explore and Extend

Once the application is running, explore the provided features and examine the code to understand how the integration with Reflex Platform works. You can use this example as a foundation to build more complex and tailored integrations for your specific use case.

## Requirements

* Node.js 18+
* npm 9+
* Modern web browser (Chrome, Firefox, Edge)

## License
Distributed under the MIT [License](LICENSE). See `LICENSE` for more information.