3.7. Frontend User Interface
Frontend UI can be powered by one of the following technologies:
Your favorite framework (such as Angular or Vue): you can use a framework-agnostic TypeScript SDK for that
We provide several tools and libraries that you can use in order to build your Frontend UI application (or frontend client as we call it):
- Frontend Generator
The Frontend Generator is a scaffolding tool that can be used to speed up the process of developing a frontend client. It can be used from CUBA Studio or as a standalone CLI tool. It can generate a starter app and add the pieces you need such as entity browser and editor screens. It can also generate a TypeScript SDK.
- Component and utility libraries for React and React Native
There are two libraries for React and React Native powered frontend clients that are both used in the code generated by the Frontend Generator and can be utilized on its own. One is CUBA React Core which is responsible for core functionalities such as working with CUBA entities. It is used by both React and React Native clients. The other is CUBA React UI which contains the UI components. It uses Ant Design UI kit and is used by the React client.
- CUBA REST JS library
CUBA REST JS is a library that handles the interactions with Generic REST API. Frontend clients use Generic REST API to communicate with the Middleware. However, you don’t have to manually send the requests from your code. If your frontend client is based on React or React Native then CUBA React Core components will often handle this communication for you utilizing CUBA REST JS under the hood. If you are using a different framework or need more flexibility, you can use CUBA REST JS directly.
- TypeScript SDK
TypeScript SDK is generated by the Frontend Generator and is a TypeScript representation of project’s entities, views and facades to access REST services. The SDK can be used to develop a frontend client using your favorite framework (if it happens not to be one of the frameworks supported out of the box) as well as for Node.js-based BFF (Backend for Frontend) development.
To learn more about these tools and developing a frontend client see the Frontend UI manual.