Basic Operations
In this guide, you will learn how to use the Flutter plugin for Parse Server to manage Parse Objects at Back4App. Parse data storage works around the ParseObject, where each one contains key-value pairs of JSON-compatible data.
The Back4App Database supports the most common data types, including strings, numbers, booleans, DateTime, GeoPoints, Pointers, Relations, or even list and objects. In summary, it supports anything that can be JSON-encoded.
This guide contains the basic operations to manage objects. It’s a simple CRUD guide showing how to Create, Read, Update and Delete objects on Parse. In four steps, you will be able to perform the four basic functions of persistent storage.
To complete this tutorial, you will need:
- An Flutter app connected to Back4app.
- Note: Follow the Install Parse SDK on Flutter project to create an Flutter Project connected to Back4App.
- A device (or virtual device) running Android or iOS.
To better understand Parse on Flutter, you will see the CRUD operations implemented on a ToDo App. The application will have a simple interface, with a text field to register a task and a list of registered tasks. You can update each task as completed or even delete the task. We won’t explain the Flutter application code once this guide’s primary focus is using the Flutter with Parse. Following the next steps, you will build a Todo App that will store the tasks at Back4App Database.
Following the next steps you will be able to build a Todo App that will storage the tasks at Back4App Database.
Open your Flutter project from the previous guide Flutter plugin for Parse Server. Go to the main.dart file, clean up all the code, and replace it with:
Note: When debug parameter in function Parse().initialize is true, allows displaying Parse API calls on the console. This configuration can assist in debugging the code. It is advisable to disable debug in the release version.
Find your Application Id and Client Key credentials navigating to your app Dashboard at Back4App Website.
Update your code in main.dart with the values of your project’s ApplicationId and ClientKey in Back4app.
- keyApplicationId = App Id
- keyClientKey = Client Key
Run the project, and the app will load as shown in the image.
The create function will create a new Task with the title and done status equal to false.
Search function saveTodo in file main.dart.
Replace code inside saveTodo with:
To build this function, follow these steps:
- Make a new instance of the Parse Todo class with the command ParseObject('Todo').
- Use the set function to set the paramenters for this object.
- Call the save function, which will effectively register the task to your database in the Parse Dashboard.
The complete code should look like this:
To test it, click on the Run button in Android Studio/VSCode. Enter a task title and click on the ADD button. To confirm that the new object is in the database, you can access the Parse Dashboard or you can code the getTodo function.
The read function is responsible for querying the database and returning the list of objects. Search function getTodo in file main.dart. Replace code inside getTodo with:
To build this function, follow these steps:
- Create an instance of Parse’s Query class.
- Do a Query’s search method using query()method.
- If the operations succeed, a list of Todo objects will be returned. If no object is found, the sucess property is false, and the results are null.
The complete code should look like this:
Search the code below inside ListView.builder function:
Replace code with:
Using this code, we can access the values of our ParseObject using the get method. We use the get method to retrieve the title (string) and done (bool).
To test it, click on the Run button in Android Studio/VSCode. The list will display the previously registered Task. Add new tasks, and the screen will be updated with the new Task on the list.
The update function is responsible for updating a task as completed or not.
Search function updateTodo in file main.dart.
Replace code inside updateTodo with:
To build this function, follow these steps:
- Make a new instance of the Parse Todo class with the command ParseObject('Todo').
- Use the objectId property to set objectId of ParseObject that must be updated.
- Use the setfunction to modify the parameters doneyour Task.
- Call the save function, which will push the changes on the task to your database in the Parse Dashboard.
The complete code should look like this:
To test it, click on the Run button in Android Studio/VSCode. Choose a task, click on the checkbox for changed done value in Task. The screen will be reloaded and the task will have a new value for the done field.
The delete function is responsible for removed a task from database. It is an irreversible action, which means that you should be careful while using it.
Search function deleteTodo in file main.dart.
Replace code inside deleteTodo with:
To build this function, follow these steps:
- Make a new instance of the Parse Todo class with the command ParseObject('Todo').
- Use the objectId property to set objectId of ParseObject that must be removed.
- Call the deletefunction, which will remove theTaskto your database in the Parse Dashboard.
The complete code should look like this:
To test it, click on the Run button in Android Studio/VSCode. Choose a task, click on the Delete icon in Task. The screen will be reloaded and the removed task will not be listed.
At this point, you have learned how to do the basic CRUD operations with Flutter on Parse.