Meteron Logo

Building AI app

With Meteron you get core APIs that are required to build an app that can work at scale.

News single

As an example we will be using roomfix.ai app which source code is available on GitHub here github.com/meteron-ai/roomfix. It is based on the github.com/Nutlope/roomGPT example. The main difference is that by using Meteron we greatly simplify the stack. No need for Postgres, Prisma, Redis, etc. We also add a few features like prioritization and ordering.

You can focus on things that matter here - choosing the AI model, prompt and the UI design.

What is needed for an AI app?

Typical AI app consists of these components:

  • Fronted - is what we show to the users (HTML, CSS, javascript).
  • Backend - where your business logic resides.
  • AI model - generates text, images, etc.

We will look into the roomfix app and see how it is built so you can build yours! 🥳🥳🥳

Frontend

Frontend in a typical Next.js app is a combination of HTML, CSS and javascript. In this particular example CSS is mostly TailwindCSS so we can ignore it. Pages can be found here: https://github.com/meteron-ai/roomfix/tree/main/pages.

Backend

Backend ins Next.js apps is really convenient. You can find the image generation call here https://github.com/meteron-ai/roomfix/blob/main/pages/api/generate.ts. If you wish to use a different model, just modify the payload and the model version hash.

Meteron here expects the X-Model and X-User headers to enforce rate limits and to make sure that you are using the right model.

AI model

For image generation we use a ControlNet model, hosted on https://replicate.com. They have came up with an interesting packaging format called "cog" (https://github.com/replicate/cog) which promises that you don't have to worry to much about running your models 😅

Combining things together

Once we have the individual parts, Meteron allows to combine them painlessly. Add your Replicate model to Meteron and set the Meteron API key for the Next.js app. You are ready to go.

As a next step try playing with the prompt here (https://github.com/meteron-ai/roomfix/blob/main/pages/api/generate.ts#L29-L56) or pick a different model altogether, here are some more examples: https://replicate.com/collections/control-net