Skip to Content
Technical Articles

How to Develop Simple UI5 programming in VS Code

In this blog, I have expanded how to develop the Simple UI5 programming in VS (Visual Studio) Code.


Scenario:– Build a Simple Login & Password Application in Visual Studio.

Step 1: Open Microsoft Visual Studio.

Step 2: Create WebApp Folder in Computer System, then add in the VS Code.

(Note: we can create a folder by any name.)







Step 3: Create an index.html file.


Step 4: Create subfolder under webapp by name View & Controller.

To create a layout for User Id & Password, create an XML file under View subfolder.ย 

Step: 5ย Create Js View in the View subfolder.

Step 6:ย Create Js File in the Controller subfolder.

As per standard, we have followed the MVC (Model View Controller) Structure.

Now we can run the application in VS Code via Go live Server, then the system will take you automatically to the new screen as shown below




Congratulation!!! Our First UI5 Application has been created in the VS Code.


I would like to thanks Mahesh Kumar Palavalli for his guidance.


























You must be Logged on to comment or reply to a post.
  • Hi Sanjay, it’s nice to see that you are sharing your experience with vscode and ui5 in the community ๐Ÿ™‚

    You can also check ui5 tooling & yeoman generator for ui5 templates to further your learning ๐Ÿ™‚ hope they are already on your list!


  • Hi Sanjay, how are you ? I hope all good at your end. It’s great to see your work and the amount of clearity in it. Seriously hats off for this blog ๐Ÿ™ . Hope to see many such blogs from you in future and it will be really helpful to learn from you ๐Ÿ™