[2023 Poc] Code Pilot Genius: Integration of OpenAI API & Outsystems Using Forge

Story Description:

• 1 Screen code transformator

• Dropdown with the current language java python C#

• Dropdown Target language

• Input Text field with existing code example

• Output Text field with the target language option

Button on click triggering chatgpt Api to deliver output

Project in Service Studio ↓

On Click Event Workflow ↓

On Click Event Workflow

How To ?

Considerations: While integrating the OpenAI API, developers should be mindful of potential ethical considerations and ensure that the AI systems they build are designed responsibly, with user privacy and data security in mind. Additionally, they should be aware of any rate limits or usage guidelines provided by OpenAI to ensure compliance and smooth functioning of their applications.

Key Features of OpenAI API:

• Language Understanding: OpenAI models have been trained on massive amounts of text data, enabling them to understand and interpret natural language inputs. Developers can leverage this capability to create chatbots, virtual assistants, and other applications that can interact with users in a conversational manner.

• Text Generation: With the OpenAI API, developers can generate coherent and contextually relevant text based on given prompts. This feature can be harnessed for content generation, creative writing, language translation, and much more.

• Question Answering: The API allows developers to build question-answering systems, where users can pose questions and receive accurate and informative responses based on the model’s knowledge.

• Text Completion: Developers can use the API to autocomplete text or assist users in completing sentences, making applications more user-friendly and efficient.

Hosting Different GPT Models in OutSystems

One of the key advantages of integrating ChatGPT with OutSystems is the flexibility it offers in choosing different AI models based on your application's needs. As seen in the screenshot above, you can select from various models such as GPT-3, GPT-3.5 Turbo, GPT-4, and even specific versions like GPT-3 Davinci or Babbage. Each model comes with its own strengths, which impacts performance, cost, and the complexity of tasks it can handle.

Choosing the Right Model for Your Use Case:

Depending on your project's needs, you can choose the appropriate model that aligns with your goals. For example:

  • Code Translation and Code Generation: If you are working on translating code between languages (e.g., Java to Python), models like GPT-3.5 Turbo or GPT-4 are preferable. These models offer better understanding of context and more accurate translations, especially when handling complex programming logic.

  • Basic Q&A and Simple Code Fixes: For simpler applications that don’t require intricate understanding, GPT-3 Curie or Babbage may be more than sufficient and offer cost savings.

Setting Up OpenAI API in OutSystems

To enable the component, you’ll need to get an API key from OpenAI. Here’s how:

To get started with the OpenAI API, developers need to sign up for access and obtain an API key.

Generate an API Key: Once your account is set up, generate an API key that will allow your OutSystems application to communicate with the ChatGPT model.

Configure the API in OutSystems: Go back to Service Studio and configure the API key in the ChatGPT Forge Component settings. This will ensure that the API calls to OpenAI can be successfully made from your OutSystems app.

The OpenAI API provides a free trial with an $18 credit limit, which allows developers to explore the service; once the limit is reached, you will need to upgrade to a paid plan to continue using the API.

Access the ChatGPT Forge Component

Before diving into the technical details, you need to install the ChatGPT Forge Component. You can find it in the OutSystems Forge.

Here’s the direct link to the component:

👉 https://www.outsystems.com/forge/component-overview/14627/chatgpt-o11

Simply follow the link, and you’ll be directed to the component page where you can review its documentation, read through user feedback, and download it for use in your application.

  • Login to your OutSystems Service Studio

  • Navigate to the Forge tab in Service Studio.

  • In the search bar, type "ChatGPT Forge Component".

  • Select the component and hit "Install".

  • Once installed, the component will be available in your list of dependencies, and you’ll be ready to start integrating it into your apps.

The ChatGPT Forge Component comes with a demo application that illustrates how to integrate and use ChatGPT within an OutSystems application. This demo app serves as a great starting point to understand the different use cases and features provided by the component.

This built-in demo is extremely useful as it gives you a practical example of how to set up API calls, structure prompts, and display responses within your custom applications.

Adding the ChatGPT Forge Component to Your Project in OutSystems Service Studio

To begin integrating ChatGPT into your OutSystems project, you'll first need to add the ChatGPT Forge Component to your project dependencies. This is a crucial step to enable API interaction and leverage the model selection features

  • Add the Component to Your Application's Dependencies:

    • Once installed, go to your application’s Dependencies panel.

    • Search for the ChatGPT Forge Component in the list of available modules.

    • Select it and add it to your application dependencies.

  • Publish Your Application:

    • After adding the component, make sure to publish your application so the new dependencies are included.
  • Using the Component:

    • Now that the ChatGPT Forge Component is integrated, you can start using it in your application. Add the appropriate server actions or API calls to your workflow, as needed for your use case.

Customizing the Integration

Once you've understood how the demo works, you can start building on top of it for your own use cases. For example, we're working on a code translation tool, you can customize the component to:

Tailor your prompts to elicit more accurate and detailed responses from ChatGPT.

When building something like a Code Pilot, the quality of the output you get from ChatGPT heavily depends on how well you craft your prompts.

To get precise code translations or code generation from ChatGPT, it's essential to make your prompts as clear as possible. For instance, instead of simply saying, "Translate this code to Python," you can refine it with more context.

Here is how we did it (the output needed was only code) To ensure consistency in the output, especially in code translation

Use case was Code Translation, Bug detetion, Code explanation

Used Prompt ↓ we made small changes for bug detection & code explanation

Once you start generating code using the ChatGPT Forge component, it's essential to test the outputs regularly. If the translations or code suggestions aren't perfect, refine the prompts accordingly

Tip: Utilize Temperature Settings Temperature is an adjustable setting in the ChatGPT API that controls the randomness of responses. Lowering the temperature will make the responses more focused and deterministic.

Tip: If you encounter a timeout error while using the ChatGPT Forge component, it typically indicates a delay in API response due to server or network issues; try adjusting the request settings or increasing the timeout limit to resolve it.

Incorporating Prompt Engineering into our OutSystems Code Pilot powered by ChatGPT ensures that the generated code is not only accurate but also tailored to your exact use case. Whether you're translating code across languages or generating functions from scratch, crafting well-defined prompts helps ChatGPT deliver highly relevant responses.

Conclusion

Thanks to the low-code nature of OutSystems and the flexibility of OpenAI's API, the entire process—from installing the Forge component to customizing the prompts for optimal code generation—can be completed in a relatively short time.

Running tests, debugging any issues, and making the necessary tweaks to both prompts and UI/UX for an optimal user experience.

Overall, the entire integration process can take between 2-4 hours depending on the complexity of your customizations and the depth of functionality you want. In just a short time, you can have a fully functional, AI-enhanced code translator integrated into your OutSystems application, providing immense value in terms of productivity and innovation.