AI Integration in Wappler

What I usually do is request plain HTML or JavaScript and then integrate Server Connect or App Connect within Wappler itself. I don’t expect to solve everything with a single prompt, but I’m often surprised by the capabilities of ChatGPT, especially with the GPT-4 model. If you ask it to perform specific tasks in Wappler, it can handle a lot, guiding you through API creation and other complex processes.

1 Like

I integrated copilot very easily and it is really fantastic how it creates entire sections in a short time
By the way, I don't know if it's just a coincidence, but out of pure curiosity I tried to give instructions in Italian and amazingly it seems to work. Of course it's just a test

2 Likes

Of course Wappler AI assistant knows all the languages of the world :slight_smile:

3 Likes

Fantastic

Does it only work with Copilot?
Please consider adding your own Base API URL / API Key / Model
To integrate third-party AI vendors compatible with the OpenAI API - OpenRouter etc.

2 Likes

Yes it works with Copilot, as shown in the tutorial above. You can use the free version of Copilot and it offers multiple models. The paid version is just $10/month and it includes more advanced models such as Claude 3.7

This is just the initial AI integration and we’re collecting feedback, more advanced features are coming in the future.

This is great news :beer:

If this AI is going to continue, it will make the creation of video tutorials too easy. Have a look at this latest version where the form is created while I watch on.

7 Likes

As discussed in this thread Using AI To Create Consistent Styles respected @Cheese advised to use Cline - Visual Studio Marketplace. It may also be possible to enable it for integration, I tried it for MS VSC yesterday and it's very easy to set up and work. He has such a thing as MCP Server MCP Quickstart | Cline, hypothetically, this can help centrally manage Cline's behavior in the context of @Wappler's projects and gradually centrally increase his knowledge of the Wappler environment.

2 Likes

Would be really good to have something like these server connect AI interactions. Would be a huge time saver, do this so many times.

  1. Create Crud server actions for the table xxxxxx

  2. Create crud actions for the table xxxx which has subtable(s) yyy, zzz

  3. Create a multi image upload creating multiple images scaled to the following pixel sizes (list of sizes here) using the prefixes/foldernames (list here)

  4. A file upload equivilent (no scaling obviously) of (3)

2 Likes

Yes that is exactly what we plan to do.

Each editor has its own AI with the right capabilities.

  • in design view - the AI is generating html and css
  • in the database manager - it is generating schema
  • in server connect editor - it generates server connect actions

So basically we have different specialized AI Agents for each type of work.

6 Likes

So my "CRUD in 25 mins" will be beaten by around 24 minutes and 55 seconds?!

3 Likes

I beat that long before you even did your video :rofl::rofl::rofl::rofl: but i get your point.

4 Likes

Would these need to be in each prompt, or can I train my copilot to know about them? Having continuous history will be very useful and effective for the integration. Like (Windsurf Editor by Codeium). Really hope to see this happen soon in Wappler

Of course, charges for token need to be incurred for such features, but that is up to individual to decide they want to use the paid or free plan depending on individual own needs.

1 Like

Wappler strikes again, wow team, do you ever sleep, or do you have 1000 employees to get all this stuff done, amazing, thank you.

1 Like

In the latest Update - Wappler 7 Beta 23 the AI is now available as Chat panel in the sidebar in the page editor, next to the App Structure.
In addition to GitHub Copilot, we have added support for Open Router and Ollama providers. You can now use Open Router in the Wappler AI Assistant and chat panel. An Open Router API key is required, and for cost-effective usage, we recommend sticking to the free models.

With Ollama, you can run AI models entirely on your local machine. However, keep in mind that powerful hardware is needed, and a decent GPU is required for larger models.

You can enable them in the Options, under the Chat Provider option:

Enter your API key here, for Open Router:

You can find the AI assistant in the sidebar:

And then you can select a model to use:

4 Likes

How to change Base URL for OpenAI/Open Router API сompatible proxy servers?

Which OpenAI compatible proxy servers are you referring to?

We currently support Open Router that acts as a proxy to all LLM providers.

There are many of them, please give an opportunity * Api Base Url: The URL of your Openai Compatible API
For example: GitHub - PublicAffairs/openai-gemini: Gemini ➜ OpenAI API proxy. Serverless! ,
OpenAI fault tolerant proxy server - a Lightning Studio by aniket
Or Ollama with API key

UNDO? how does that work? I can't just hit the undo button if it makes multiple changes? I have to use github to roll the changes back?

Well as you apply the changes in the current file you should be able to undo them with couple of undo clicks, but I agree that we should improve this to be more as a single undo and maybe have a undo button available at the same place as apply button when this is clicked @patrick

2 Likes