Building a Todo App
Time to build - 10 minutes
Last updated
Time to build - 10 minutes
Last updated
A Todo app is the most basic app that any developer can create to learn the basic concepts of the system. So let's try to create simple Todo app. The basic requirements are -
Add a new Todo in the system.
List all Todo's created in the system.
This tutorial assumes you have created a new Project in Cosmocloud and successfully connected your database to it. You can run a Free Tier Project for this tutorial.
The first thing while building an App on Cosmocloud is to identify the Data Models and create them. For starters, we have only 1 Data Model Todos which might have the following schema -
id - The Todo ID.
title - The title of the Todo.
description - The description of the Todo.
To create a new Database Collection model, just navigate to Application Layer -> DB Models and click on the Create button. Name your model Todos and click Create.
Once created, now let's start defining our schema as below -
You would realise that we have not added an ID field. This is because Cosmocloud is powered by MongoDB, and MongoDB automatically creates an _id field for you in your records. You would also see that we have marked these fields as required as of now.
You can also use the JSON to Schema widget to quickly pass a JSON sample record, and Cosmocloud will automatically create the schema for you.
When done, click on Save button.
Once done, now we can start creating our APIs. Navigate to Application Layer -> APIs and click on the Create button.
Yes, we can start creating the APIs from scratch and add our customisations as and when we would want that. But to quickly setup the CRUD backbone, we can start using the CRUD APIs template. Click on Browse Templates and select CRUD APIs inside it.
Next would be to select the Database Collection model we just created - Todos which will tell the system, which collection to create the CRUD APIs for. Selecting this model, click on Next.
Once on the last screen, you will be able to Review the APIs and Models Cosmocloud will automatically create for you using this template. For now, let's select all the APIs and Models.
As soon as you clicked on Create button, Cosmocloud automatically created these APIs as well as deployed the same on Development Environment instantly.
Now, let's start by creating our first Todo. Open the (POST) Create API api we just created. On the details page, you will find the Deployment endpoint along with it. Copy this and open Postman.
Before calling these APIs, you would need to find your projectId and environmentId to pass in the Headers. You can find the Project ID by clicking on the Organisation Name on top left, which will take you to Projects listing page. You can find the Environment ID by navigating to Application Layer -> Environments and finding the ID for the Development environment. Once done, pass them in Postman like -
Now, you can try out your API, you would need to pass the Request Body to this POST API which would accept the same schema as you defined in your Database Collection -
Once created, you can see that you have the newly created record's ID in the response. Now let's try to list the Todos in our system. Open the List Todos API and copy the Development endpoint and paste on Postman. Don't forget to miss the Headers or converting the request method to GET.
As you can see, we tried to create a basic CRUD app, for creating and listing TODOs. Similarly, you can also try out the PUT, PATCH, and DELETE APIs.
All this is powered using Cosmocloud's .
Learn more about of these APIs here.