Connect to the SAP Web IDE (free for development use), and then get a simple project set up for our future tutorials.
Connect to SAP Web IDE
Open your SAP Cloud Platform account (if you have a free developer account, click HERE to open the console.)
Trouble logging in? If you have trouble logging in to your SAP Cloud Platform Cockpit, and you are using a company account (one provided by your employer), it is possible that the Cloud access has been locked. Create a new FREE trial account by clicking the link above, and use your personal email address to set up the new account.
You should now be in the SAP Cloud Platform Cockpit, as shown below. Click on the Services menu item on the left.
Next, click on the SAP Web IDE box. You may need to scroll down to find this box.
Enabled: If the box does NOT say Enabled, click the Not Enabled button to enable this feature. In the screen that appears, click the Enable button at the top of the page to confirm this feature is set up.
In the SAP Web IDE screen, you will see a paragraph called Service Description. At the bottom of the paragraph, there is a link called Open SAP Web IDE. Click this link
A new tab (or window) will open, and the Web IDE will load.
Bookmark this page in your browser. You will need this link later, to reopen the Web IDE.
Set up a new empty web project
Start by going to the File menu, and then choose New –> Project From Template.
Choose SAPUI5 Application, and then click Next.
HelloAngular as a project name, and then click Finish.
Finally, we will be removing all of the files from your application. Select the folder
webapp, and the files
neo-app.json, then right click and choose Delete.
Wait, what!! For this AngularJS application, we will not need the files to support SAPUI5. We will only be using the editor, and the built-in web server, for our application. Everything else is downloaded directly from the web.
In the dialog box, choose OK.
Now, select the folder
HelloAngular, right click, and select New –> File.
Name the file
index.html, and then click OK
The editor will open. Copy and paste the following HTML in to the editor, then click the Save button at the top.
Now try out your new web application! Click on the Run icon at the top of the page (or go to the Run menu, and choose
Why are we using Web IDE? Can I use another development tool?