# Secured AI Backend Proxy

### Publish Server (3 min setup)

1. Login on render.com with your Github account
2. Create a new Web Service

<figure><img src="https://955745581-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5zo7QvF2Wko9f29upL6y%2Fuploads%2FkLq83pXVGbfKZUBNqIsS%2FCleanShot%202024-04-25%20at%2013.19.39%402x.png?alt=media&#x26;token=08ad5e27-c70f-419a-b123-cac69fe9532f" alt=""><figcaption><p>Create a new Web Service in Render.com </p></figcaption></figure>

3. Download the code on <https://github.com/AppKickstarter/backend-ai>
4. In this repository you'll find a KMP ai client and a NodeJS backend server. Create a Github repository and push the node js part on it.&#x20;
5. Connect your new NodeJS repository to render and the web service you created before.&#x20;
6. On every push the render web service will be updated
7. Add your environement variables: HMAC\_SECRET\_KEY, OPENAI\_API\_KEY and REPLICATE\_API\_TOKEN

<figure><img src="https://955745581-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F5zo7QvF2Wko9f29upL6y%2Fuploads%2Fw9keKWnGS8sdy0KNvfEb%2FCleanShot%202024-04-25%20at%2013.24.00%402x.png?alt=media&#x26;token=0ac1388a-5da7-464d-aa8a-9d36fd5c1210" alt=""><figcaption><p>Environment variables in Render.com</p></figcaption></figure>

### Use AI module in a KMP Project (Android, iOS, Desktop, Web) (3 min setup)

1. Download AI module on <https://github.com/AppKickstarter/AI>
2. Copy paste AI module in your project
3. Add module in settings.gradle:&#x20;

```
include(":ai")
```

4. Add dependency in your build.gradle:

```
kotlin {
    ...

    sourceSets {
        commonMain.dependencies { 
            implementation(projects.ai)
        }
    }
}
```

5. Add environement variables in local.properties : mobile\_ai\_api\_hmac\_secret\_key and mobile\_ai\_url.&#x20;

{% hint style="info" %}
mobile\_ai\_api\_hmac\_secret\_key should be the same the Render HMAC\_SECRET\_KEY and mobile\_ai\_url is the url given by render when you publish your web service.
{% endhint %}

6. Add BuildKonfig in your project:&#x20;

```
import com.codingfeline.buildkonfig.compiler.FieldSpec.Type.STRING

plugins {
    ...
    id("com.codingfeline.buildkonfig")
}

buildkonfig {
    packageName = "your.package.app"

    val props = Properties()

    try {
        props.load(file("../local.properties").inputStream())
    } catch (e: Exception) {
        // keys are private and can not be committed to git
    }

    defaultConfigs {
        buildConfigField(
            STRING,
            "MOBILE_AI_API_HMAC_SECRET_KEY",
            props["mobile_ai_api_hmac_secret_key"]?.toString() ?: ""
        )

        buildConfigField(
            STRING,
            "MOBILE_AI_URL",
            props["mobile_ai_url"]?.toString() ?: ""
        )
    }
}
```

6. Now you can call ChatGpt, Dall-e, Whisper, OpenAI Vision and more :&#x20;

Create the service :&#x20;

```
val aIService = AIService(
    BuildKonfig.MOBILE_AI_URL,
    BuildKonfig.MOBILE_AI_API_HMAC_SECRET_KEY,
)
```

Inject it in Koin:&#x20;

```
module {
    singleOf { 
        AIService(
            BuildKonfig.MOBILE_AI_URL,
            BuildKonfig.MOBILE_AI_API_HMAC_SECRET_KEY,
        )
    } 
}
```

Call ChatGpt:&#x20;

```
scope.launch {
    aiService
        .chatgpt(
            model = model, // support gpt3.5 turbo, gpt4, etc
            messages = listOf(
                Message(
                    role = "system",
                    content = "Marv is a factual chatbot that is also sarcastic."
                ),
                Message(
                    role = "user",
                    content = userContent
                ),
            )
        )
        .onFailure {
            result = "We found an error ${it.message}"
        }
        .onSuccess {
            result = it
        }
}
```

Call Dall-e 3

```
scope.launch {
    aiService
        .dallee(prompt) // only dall-e 3 for now but you can easily change it
        .onFailure { error = "We found an erorr ${it.message}" }
        .onSuccess { resultUrl = it.data.firstOrNull()?.url }
        .also { loading = false }
}
```

Call OpenAI Vision&#x20;

```
scope.launch {
    aiService
        .vision(
            prompt = prompt,
            url = url // image url to analyze
        )
        .onFailure {
            result = "We found an error ${it.message}"
        }
        .onSuccess {
            result = it
        }
}
```

### Add AI module in a iOS Swift only Project

{% hint style="info" %}
You can add the module in a iOS Swift only project the same way you add a KMP library to a iOS Swift only app. If you want more informations please ask at <hey@appkickstarter.com>
{% endhint %}

### Add AI module in a Flutter Project

{% hint style="info" %}
You can add the module in a Flutter project the same way you add a KMP library to a Flutter app. If you want more informations please ask at <hey@appkickstarter.com>
{% endhint %}