Overview
To-Do applications are everywhere, but it's time to take them to the next level. In this blog post, we will do just that. There are 2 new technologies we will use. The first one is itty-router which is a lightweight router and the other one is Conserve Cloud (conserve.cloud). Conserve Cloud is a new cloud storage infrastructure, so you may not have heard of it. In a nutshell, Conserve Cloud exists to solve the 2 biggest problems of modern cloud storage service providers today. The first one is unpredictable cloud bills and the other one is the deep configurations that these services require. Conserve Cloud offers NoSQL database, Key-Value store and Logger services. You can use these services with zero configuration for a single fixed price per month. These features are a godsend for the growing number of indie developers today.
Installation
Let's start by installing the itty-router
and conserve-cloud-sdk
packages.
$ npm install itty-router conserve-cloud-sdk
Conserve Cloud Setup
As I mentioned before, Conserve Cloud is very easy to use. First of all, we need to create our account at (conserve.cloud) and verify our email with the email we receive.
After creating our account and verifying our email address with the incoming mail, we will go to the Datakeys
tab on the navigation bar that we will see on the left side of the Dashboard
. We should see the following screen.
Finally, we need to copy this Datakey
somewhere (the .env
file in our project is a good option here). That's all we need to do for the Conserve Cloud setup!
Coding Time!
Now, let's create an itty-router
HTTP server on the NodeJS runtime. Since itty-router
is specially designed on Bun runtime for serverless infrastructures like Cloudflare Workers, we need a little configuration like below and a few extra packages to use itty-router
in NodeJS runtime.
$ npm install @whatwg-node/server http isomorphic-fetch
Now let's write our HTTP server.
import 'isomorphic-fetch';
import { createServer } from 'http';
import { error, json, Router } from 'itty-router';
import { createServerAdapter } from '@whatwg-node/server';
const router = Router();
const ittyServer = createServerAdapter((request, ctx) =>
router.handle(request, ctx).then(json).catch(error)
);
const httpServer = createServer(ittyServer);
httpServer.listen(3001);
Adding Endpoints and Conserve Cloud
OK great, now we have our HTTP server. Next, we are going to create some endpoints to save and fetch to-dos. We need to save these to-do's somewhere, and this is where we will use Conserve Cloud. Let's take our Conserve Cloud Datakey
and create a ConserveCloud
instance with conserve-cloud-sdk
. Since Conserve Cloud is completely API-based and serverless, this instance does not create any consistent connection. It will only run whenever we run it.
import 'isomorphic-fetch';
import { createServer } from 'http';
import { error, json, Router } from 'itty-router';
import { createServerAdapter } from '@whatwg-node/server';
import { ConserveCloud } from 'conserve-cloud-sdk';
const router = Router();
const ccloud = new ConserveCloud('b0abc5f4-39bf-468f-a9ec-c9053dacb064');
const ittyServer = createServerAdapter((request, ctx) =>
router.handle(request, ctx).then(json).catch(error)
);
const httpServer = createServer(ittyServer);
httpServer.listen(3001);
Now let's create a NoSQL database from this ConserveCloud
instance. To do this, first we need to create a new NoSQL database resource by going to the NoSQL
tab on the Dashboard
. We can create this resource on the following screen. No configuration is required, just a name!
Our NoSQL database resource was created on the fly. We can see this created resource as below. To use this resource, we will need the unique id just below the name we gave it (as seen in the photo below: db4e92_my_todo_app
).
Now let's start using this resource by constructing it in our code.
import 'isomorphic-fetch';
import { createServer } from 'http';
import { error, json, Router } from 'itty-router';
import { createServerAdapter } from '@whatwg-node/server';
import { ConserveCloud } from 'conserve-cloud-sdk';
const router = Router();
const ccloud = new ConserveCloud('b0abc5f4-39bf-468f-a9ec-c9053dacb064');
// Here is our NoSQL database resource
const nosqlDB = ccloud.NoSQL('db4e92_my_todo_app');
const ittyServer = createServerAdapter((request, ctx) =>
router.handle(request, ctx).then(json).catch(error)
);
const httpServer = createServer(ittyServer);
httpServer.listen(3001);
Now we just need to create the endpoints required to "create new to-dos" and "fetch created to-dos". At this stage, we will use the put
method from the nosqlDB
object we constructed in our code to save the to-dos to our NoSQL database and the fetch
method from this object to fetch the saved to-dos.
import 'isomorphic-fetch';
import { createServer } from 'http';
import { error, json, Router, withContent } from 'itty-router';
import { createServerAdapter } from '@whatwg-node/server';
import { ConserveCloud } from 'conserve-cloud-sdk';
const router = Router();
const ccloud = new ConserveCloud('b0abc5f4-39bf-468f-a9ec-c9053dacb064');
// Here is our NoSQL database resource
const nosqlDB = ccloud.NoSQL('db4e92_my_todo_app');
router
.post('/todo', withContent, async (request) => {
const body = request.content;
// save new to-do to our NoSQL database
await nosqlDB.put(body);
return json({ status: 201, message: 'To-do created!' });
})
.get('/todo', async () => {
// fetch all to-dos from our NoSQL database
const { data } = await nosqlDB.fetch({});
return json({ status: 200, todos: data });
});
const ittyServer = createServerAdapter((request, ctx) =>
router.handle(request, ctx).then(json).catch(error)
);
const httpServer = createServer(ittyServer);
httpServer.listen(3001);
Conclusion
Yes, a new approach to To-Do applications with Conserve Cloud. By using Conserve Cloud (conserve.cloud), you can develop incredible things with the power offered by unlimited cloud storage infrastructure.
Top comments (0)