Go to Project Page
To establish the linkage between your pages, simply choose the link or button on your page that you want to direct users to the next page. Then, select the option 'Go to project page' and pick the specific page that you intend to guide the user towards. This straightforward process ensures seamless navigation within your application.
Additionally, you have the choice to enable users to return to the previous page. This can be achieved by selecting the appropriate checkbox.
When establishing links between pages, it's crucial to factor in the data you intend to transfer to the next page. If the subsequent page involves a "get" function – which can be explored in the Annotations section – or simply put, if it's going to display data related to a specific object like a user or a post, you should select the 'pass by id' option. This ensures that the relevant data is effectively carried forward for a seamless user experience.
Before saving your annotation, it's important to understand the concept of an entity.
An "entity" is like something you want to remember and talk about. In a database, it could be a user, a blog post, or anything else you want to keep track of. It has specific qualities called attributes, like a user's name or a post's title.
So, when you annotate, you're defining the attributes for that entity. For instance, if you select a user's name and want to annotate it, you would choose the "user" entity and assign a name attribute, like "username." This process helps organize and structure the information you're working with in the database that WABLI will create for you.
As it has already been discussed, an "attribute" is a specific piece of information that describes an entity within a database. It provides details about the entity's characteristics or properties. Here are the attribute types available to choose:
- Text: Represents textual data like names, descriptions, or alphanumeric information.
- Image: Holds URLs or references to image files associated with an entity.
- Number: Deals with numerical data such as quantities, ages, or ratings.
- Password: Used to securely store sensitive information like user passwords.
- Email: Stores email addresses while ensuring correct formatting.
- Entity: Represents relationships with other entities, creating associations within the database.
- Date: Used for storing specific dates or date-time information.
- Checkbox: Represents binary choices, often used for yes/no or true/false scenarios.
- Radiobox: Similar to a checkbox, used when only one option can be selected from a group.
- Service: Refers to external services or APIs linked to an entity.
When creating a new entity, WABLI automatically creates all the possible methods you might need in your project. This includes CRUD Operations.
CRUD stands for Create, Read, Update, and Delete, which are the fundamental operations used to manage data in a database or any kind of data storage system. These operations are the core functionalities for interacting with data and maintaining its integrity. Here's a brief description of each CRUD operation:
- Create: Adding new data or records to the database.
- Read: Retrieving or accessing data from the database.
- Update: Modifying existing data in the database.
- Delete: Removing data from the database.
Once you've defined all the attributes for your entities, the next step involves annotating all the buttons responsible for creating, updating, or deleting objects of an entity when the user interacts with them. Additionally, you should utilize the "get" methods in the blocks that contain information. Annotate these blocks and select the "getAll" method to retrieve all objects of that entity, and use the "get" method to retrieve a specific one.
This annotation process ensures that your application seamlessly interacts with the data you've defined in your entities, enabling users to perform actions and retrieve information as intended.
Get By Params
In addition, WABLI also provides a "getByParams" method. This functionality allows you to retrieve objects of an entity that meet specific conditions. For instance, when fetching posts, you can use this method to only retrieve posts where the attribute "category" is equal to "sports."
This feature empowers you to retrieve targeted data based on customized criteria, enhancing the precision and relevance of the information you access from your database.
To create a new service, navigate to the 'Data' Tab located in the left-side menu. Click on 'New Service', and then provide a name and link for the service. Afterward, click 'Send' to confirm. With the service established, you can select the specific data you wish to retain from this service. Click 'Save' to proceed, subsequently enabling you to showcase the chosen data to your users. This process ensures that you can seamlessly integrate external data sources into your application.
Present data to user
To display data from the service to users, simply employ the annotation method. This involves annotating each text block that will exhibit the results. Assign an annotation type of "attribute," attribute type of "service," and select the specific data you wish to display. Following this, choose the parent block containing these text blocks and apply an annotation type of "method" along with the service method. Consequently, the service will execute each time the user accesses the page, ensuring that the most up-to-date data is consistently presented to users.
Lastly, an important capability is the ability to include parameters in a service, which can be added to headers, query parameters, or body parameters. To accomplish this, while adding or editing a service, select the type of parameters you intend to incorporate. Then, click on "Add New Key" to include a key along with its corresponding value. This feature facilitates the customization and interaction with external services, allowing you to send specific information and retrieve tailored data as needed.
To download your code, simply click on the rocket icon located in the upper right menu. This action will navigate you to the deployment page, where you can choose to download specific sections of your code or opt for the complete project download.
Sync to Github
As mentioned earlier, to deploy your project to a server, you must first upload it to your GitHub account. Follow these steps: Begin by accessing the deployment page through the rocket icon in the upper right menu. Once the settings load, choose the desired deployment server, and then click 'Synchronize'. With this straightforward process, your project will be successfully uploaded to GitHub, ready for further deployment.
Deploy to server
Once you have synchronized your project with GitHub, you'll notice the presence of the 'Deploy' button. Click on this button, and your project will now be live and accessible on the server you've chosen for deployment. This streamlined procedure ensures that your project is swiftly brought to life and available for users to interact with. Visit the displayed address or share it with others to allow them to access and explore your project.
To evaluate the quality of your backend code, click on the star icon located in the upper right menu and choose the "Quality of Backend" option. If you've already synchronized your project with GitHub, the results will be displayed shortly. Take the time to navigate through the results to identify potential warnings and suggested fixes. This process enables you to enhance the reliability and efficiency of your backend code by addressing any issues that may arise.
To assess the quality of your frontend code, click on the star icon located in the upper right menu and choose the "Quality of Frontend" option. If you've previously synchronized your project with GitHub, the results will be promptly displayed. Take the time to explore the results and navigate through any potential warnings and suggested solutions. This process empowers you to optimize the performance and reliability of your frontend code by addressing any issues that may arise.