React App using SAP Business Application Studio
Introduction
In this era of cloud computing, everything has moved to the cloud varying from storage, platform, infrastructure, and whatnot. IDE on cloud (like Codepen, Codesandbox, JSFiddle to name a few) has become a reliable tool for front end developers like me to use for on-the-go-code or to share code with people across forums like StackOverflow. Think of a future where you do not have to hassle with setting up a development environment on your system. I am talking about the possibility of something like the Visual Studio Code on the Web. You will get all the extensions and the GIT integrations and whatnot just by accessing an address on the browser. Actually, it is something that is already in the works as Codespaces — the instant dev environment as they call it. Well, the sad part is it is not yet live and it is still in beta as of the date of publication of this blog.
I have been developing my applications on cloud IDE for the past 3 years on the most popular IDE for SAP application development — SAP Web IDE. Well, it has a new elder brother in town- SAP Business Application Studio or SAP BAS in short. While exploring the capabilities of this tool for my own developments (SAP UI5 and Fiori apps), I gave a try to create a React project, and voila, it worked.
SAP Business Application Studio
You will need to register your free trial account here and then log in to your trial account and go to SAP Business Application Studio. This blog by SAP can be helpful if you face any difficulties.
You will need to create a dev space. Select the Basic section.
Once you are in, I mean just look at this IDE. Surprised! Yes, even I was when I first saw it. I found it conveniently easy to use due to the striking resemblance.
React Development using SAP BAS
- Open the Workspace.
2. Open terminal and use command >> npx create-react-app demoapp
3. Navigate to the folder and run command >> yarn start. Press Y to open in a new port and a new window will open up with the basic template app.
Note — Ports can also be accessed by using ctrl+shift+P and then searching for Ports.
4. Let me tweak the code and see if the changes are reflected and it works perfectly as in VSCode.
Further Capabilities include GIT integration. I was able to successfully clone my projects from GIT and seamlessly push to GIT after the initial GIT configuration. VS Code Extensions, Themes, and many similar features are well-integrated providing similar ease of use.
Conclusion
SAP BAS is not specifically designed keeping React development in mind but yes, it is a good tool to add to the arsenal. I am eagerly waiting to find out what GitHub Codespaces will be capable of once it is out of beta. Until next time!
