Technology Blogs by Members
Explore a vibrant mix of technical expertise, industry insights, and tech buzz in member blogs covering SAP products, technology, and events. Get in the mix!
cancel
Showing results for 
Search instead for 
Did you mean: 
former_member9941
Discoverer
In this blog post, I would like to share with you, that how we can leverage GitHub copilot, for UI5 code generation.

GitHub Copilot harnesses the power of Open AI Codex, a machine learning model that translates natural language into code. It powers GitHub Copilot to draw context from comments and code to suggest individual lines and whole functions as you type.

The steps for the installation of GitHub copilot including SAP Fiori extension are explained below.

1. Installation of VS code: We can download the VS code using the below mentioned link & install it in our machine.

Download VS code link: https://code.visualstudio.com/


 

2. Subscribe to GitHub copilot & install its extension for VS code, using the below mentioned links.

Subscription link: GitHub Copilot for Business sign up page.

GitHub extension for VS code: https://marketplace.visualstudio.com/items?itemName=GitHub.copilot


 

You can cross check if the GitHub is installed properly or not, by validating the installed extensions in VS code.


 

3. Now, we’ll proceed with the installation of SAP Fiori tools – Extension released by SAP, using the below mentioned link.

SAP Fiori Tools extension for VS code: SAP Fiori Tools - Extension Pack - Visual Studio Marketplace


 

4. After the installation of Fiori tools extension, navigate to Command Palette -> Fiori: open Application Generator.


5. Using template wizard, you can choose either a Basic (freestyle) or Custom page floor plan and complete the remaining wizard steps as shown in the below screenshots.




 

6. Once the Fiori app setup is done, you can open the view, to start off the development leveraging GitHub Copilot and you can start writing the prompts in plain English. The copilot will start giving you code recommendations, for accepting the code recommendations, either you can press TAB button from your keyboard or just click on Accept as shown in the below screenshot. In the same way, you can write functions in controller with help from copilot.


 

7. Below are some of the screenshots, showing some simple code generation examples.



 

The test app output, generated using code suggestions by GitHub co-pilot.


 

There is one important point to consider here is the accuracy of the code generated, not always copilot will generate the accurate code, its accuracy depends on several factors, as it’s trained on natural language text and source code from several publicly available sources, including GitHub's public repositories, you may have to adapt the code suggested by copilot. It means you are still the Pilot of your developments & co-pilot will be an assistant that will help you to speed up your code development.

In next part, we’ll explore the ABAP code generation using GitHub copilot.
6 Comments
Labels in this area