Rapid Node Prototyping for Hackathon projects with Webtask.io
From nothing to deployed server-less function in 30 seconds.
It’s Saturday evening… You are in the state of flow, adding new features to your awesome project. You are sure you will win this hackathon. The last thing you need to add is some simple backend logic….
So simple, you only need one file. A server-less function.
You start looking for a quick solution. Something that will let you build a prototype in 5 minutes. Something that doesn’t require paying, installing, configuring.
You just want to log-in and deploy.
I was in that exact situation. Just last weekend we were taking a part in a Hackathon for a bank, where we created a simple game. I wanted to add a nice feature, that would let users save their score. This would require a simple backend and storage (e.g. database).
Usually, it would go something like this:
- Create a new file
- Install needed npm packages e.g. express & mongo
- Start-up local mongo
- Write basic endpoint for saving and getting data
- Check locally if it works
- deploy to Heroku or other solution
I didn’t want to spend that much time on this task. I wanted to just deploy some backend somewhere.
After looking around for a few minutes i stumbled upon webtask.io, which is a solution from Auth0. It allows you to instantly deploy a function and provides you with a minimalistic IDE on their website.
I created my first function in 30 seconds. All it required me to do was:
- Sign in (with github it took 10 seconds)
- Create a hello world function from a template (20 seconds)
At first, I tried connecting it to MongoDB that I set-up on mLab, but it felt a bit like an overkill, since I only need to GET and POST user score. After looking around in Webtask docs, I found that they provide a simple JSON storage in the context of a function, so I tried using that, and it worked like a charm! All I did is update the JSON object and save it using provided asynchronous API.
It worked, and I had a simple user ranking in 40 lines of code and without any additional set-up, deployment process. It was all nice & easy.
Out-of-the-box Features
To allow for quicker prototyping Webtask gives a set of useful tools:
- JSON Storage
- Secrets
- Cron tasks
- Previewing requests (a bit like postman)
- CLI for local development
- Functions Middleware
Remember about limits
Webtask is a very specific tool. You have to keep in mind that it’s more of a code sandbox than a tool for production use.
This tool is for a very narrow use-case. If you want to actually build something that will work longer than a few days, then Webtask is probably not the best choice. Then maybe it’s better to play around with lambda functions on Netlify or directly on Amazon.
Only you have access to a function. You can’t share access to the code with other team members so it’s nearly impossible to collaborate effectively there.
There are some strict limits and you can’t pay to get more. This tool does not have any paid plans:
- 1 request per second soft limit
- 30 second execution limit
- 10 CRON Schedules
- 100 kb of code per task (not including npm modules)
- 500 kb of storage via the Storage API
Ron Swanson Slackbot in Five Steps
Theory is boring. Let’s just write a function that will post a random Ron Swanson Quote to a selected slack channel, every day.
Step One: Sign in
I did so with github, but you can choose whatever you prefer. After doing so go to webtask.io/make
Step Two: Setup Function
Create a new empty function. After doing so, on the top-left corner of the web editor press the config button (wrench icon), and add two npm modules. @slack/client and node-fetch.
const { WebClient } = require('@slack/client');
const fetch = require("node-fetch");Step Three: Add Slack Token
To generate slack token follow the instructions on @slack/client github page or on the official documentation page. After doing so, copy the token, and in the dropdown menu of the config button, go to secrets and add a secret called SLACK_TOKEN. It will be available inside the context of a function as context.secrets.SLACK_TOKEN.
Step Four: Add the logic
Here we have to fetch a random quote from an open API, and when we have it, post it to a selected slack channel or person. I won’t go deep into the implementation, below is the code I wrote for it.
Step Five: Set up a cron job
This is a no-brainer. Open the config menu and press Scheduler. Select time zone and schedule for the job, and it’s done! I’ve set up mine daily at 10a.m.
It’s that simple
Remember that the above example could be further simplified by using Slash Webtask app that comes with Webtask.io for free.
Conclusion
Usually, when I am using limiting tools, I get frustrated really fast. With webtask it wasn’t the case. I had only two requirements and they were fulfilled perfectly: Fast & Simple. Those are also the words I would use to describe this service.
If somebody has more experience in other tools like Serverless, they will probably be a lot better, but for others, Webtask should do just fine.
It’s fun to play around, manually test some code, or create a nano backend for a small project, but it probably would be a wrong choice for something more, as it lacks even as basic features as sharing files with other teammates.
Tap the 👏 button if you found this article useful!
About us
Applantic is a team of passionate Engineers and Designers. We write our stories on Medium ✍ but you can find us on Instagram 📷 or Facebook ✍ as well.
The author of this article is Maciej. Front-end Engineer, working on web applications in a software house. He is interested in many things, even some that are not related to computer science, such as sports and music. You can find him on GitHub or LinkedIn.
