Build a “Serverless” Todo List in 5 Minutes with StdLib and MongoDB

Written by notoriaga | Published 2017/11/28
Tech Story Tags: nodejs | stdlib | serverless | javascript | mongodb

TLDRvia the TL;DR App

At StdLib, our developers often ask us about integrating persistent storage into StdLib functions. While building and shipping a StdLib function is as easy as opening a text editor and writing your Node.js function, it’s not always clear to developers how they’d integrate a persistence layer when trying to follow ExpressJS or other tutorials. We thought we’d make it easier and show you how you can build a todo list with StdLib and MongoDB in only five minutes — enjoy!

The finished product — a simple todo list

If you haven’t heard StdLib before, we’re the fastest way to build backend web services and ship real business value. Built on “serverless” architecture, you never have to worry about managing servers or allocating resources for scale. Write a function, deploy, and you’re ready to go! We also have a growing ecosystem of integrations contributed by other developers that are easy to use.

Minute 1: Sign Up for StdLib

Getting started with StdLib is easy — head over to our website, choose pick a username and hit “Claim Namespace”. Later on, you’ll go over getting our CLI and deploying services. But first, you need to set up the the database for this application.

Minute 2: Set Up MongoDB

If you don’t have an account with MongoDB already, create one now here. When you create a new account make sure to select MongoDB Atlas and not Cloud Manager.

Now that you have an account set up you need to create a cluster. Click “Build a New Cluster” and fill out the modal with the following info.

Note that in order to use the free tier, you need to have AWS as your cloud provider and you need to use N. Virginia as the region. And finally, before you deploy your cluster, you need to create an admin user.

It can take a few minutes for the cluster to deploy, so in the meantime there are few more steps we have to take to get MongoDB ready. Click on the “Security” tab and then “IP Whitelist” and add and IP address. For the purposes of this demo you can just whitelist all IP addresses, though it’s not a great idea for production applications.

Your cluster should be deployed by now. In order to connect your StdLib service to MongoDB, you need the URI connection string. Click “Connect” and choose “Connect Your Application”. Take note of the URI string, because you’ll need it later.

Minute 3: Fork the Todo List

In order to use StdLib, you’ll need to get the command line tools, available here on GitHub. First, if you don’t have Node.js installed you can download the latest version, along with npm, here. Now with Node installed you can get the StdLib CLI by opening up a terminal and running:

$ npm install lib.cli -g

Now create a workspace and navigate to it with:

$ mkdir stdlib-workspace$ cd stdlib-workspace$ lib init

Next, get the code for the todo list by running:

$ lib create -s @steve/todo-mongo

You’ll be prompted to give the new service a name, the rest of this tutorial assumes it’s still todo-mongo . Now you can navigate to the new service with:

$ cd <username>/todo-mongo

Now you can open the env.json file found in the root of the directory. There are three fields, all with the same key. Copy and paste the Mongo URI from above into all three fields. Remember to change <password> to the admin password you created above.

Now simply run:

$ lib up dev

With that command, your todo list is live in a mutable development environment. To see it, you can go to [https://<username>.api.stdlib.com/todo-mongo@dev/](https://notoriaga.lib.id/todo-mongo@dev/), where <username> is your StdLib username. To publish to an immutable release environment, run:

$ lib release

And from there you can see the service at [https://<username>.api.stdlib.com/todo-mongo/](https://notoriaga.lib.id/todo-mongo@dev/). And that’s how easy it is to get started with StdLib and MongoDB!

Understanding your Todo List

The sourcecode is designed to be extensible — you can tweak the provided templates or functions to add whatever functionality you would like. You can make changes locally, then run changes locally and run $ lib up dev to see your changes. You can also run $ lib http , which spins up a local version of our gateway so you can test on localhost.

In its current version, the service has five main endpoints.

  • __main__.js: This endpoint serves the HTML, CSS and Javascript for the application. It simply returns everything in the static folder as a buffer with ‘Content-Type’: ‘text/html’.
  • create.js: Adds a new entry to the MongoDB cluster. It takes a string (the todo) and returns the id of the new item in the cluster.
  • read.js: Takes no parameters and returns all the items in the cluster.
  • update.js: Takes a single ID or an array of IDs (the ones returned by create) and a boolean. Every todo in the database will have its completion status set to that boolean.
  • destroy.js: Takes a single ID or an array of IDs and removes those from the cluster.

Thank You

And that’s it, thanks for reading! Hopefully you were able to learn a little bit about StdLib and MongoDB. Building a todo list is just one of the many ways to use StdLib to power your web application. If you have a neat idea you’d like to share, reach out to me directly by e-mail: steven@stdlib.com, or follow me and the StdLib team on Twitter.

As always, we look forward to hearing from you and happy building!

Steve Meyer is a recent graduate of Oberlin College and Software Engineer at StdLib. When he’s not programming you can find him cooking, baking, or playing Breath of the Wild.


Published by HackerNoon on 2017/11/28