Over a million developers have joined DZone.

How to Go From Zero to Serverless, Conclusion

DZone's Guide to

How to Go From Zero to Serverless, Conclusion

In the conclusion to our series, we'll discuss a few ways we can improve upon the basic app we've built, such as UI, real-time behavior, and syncing it to the cloud.

· Web Dev Zone ·
Free Resource

Learn how error monitoring with Sentry closes the gap between the product team and your customers. With Sentry, you can focus on what you do best: building and scaling software that makes your users’ lives better.

Over the course of this series, we've built out a fully-functional serverless application using common web development tools. By using Backand to replace the server, we're able to deploy our to-do list application to any provider that can serve files, rather than having to restrict ourselves to hosting providers that support a particular tech stack. While our app is rudimentary and largely comprised of programmer art, the concepts it demonstrates are powerful and can be used at the base for larger and more complex web application suites. In this conclusion to the series, we'll discuss some of the improvements that we can make to our application. We'll also look at building real-time behavior, as well as some considerations for deployment and hosting.

Improving the UI

There are two major problems with our user interface. The first, without being too self-deprecating, is the quality of the UI. We have elements available for all of the ideas we've chosen to express in our design, but they're thrown together with an eye to demonstrating the concepts behind them, rather than with an eye to the usability of the end application. As the options here are literally endless, I will only call attention to the importance of spending a healthy amount of time designing your user interface prior to writing code, to ensure that the end product isn't doomed to failure through a poor user experience.

The other major problem is the chosen framework. jQuery is a powerful framework, and it was revolutionary upon its release. However, the world of dynamic HTML has moved on, and newer JavaScript frameworks have taken the crown. Take, for example, our dynamic HTML generation. We wrote the HTML directly in JavaScript, which essentially meant that every time we changed the UI, we were also forced to change the model layer code. Using template HTML, or some of the more modern features of HTML5, we can reduce a lot of this complexity and decouple the UI from our code more completely. From there we can leverage frameworks like AngularJS and React, which change the approach to rendering dynamic content in a way that allows you to maintain each portion of your application's architecture independently. If you're looking to continue to use Backand on your journey, they offer an SDK for several major JavaScript platforms. See more information in the documentation.

Adding Real-Time Behavior and AWS Lambda

We've covered a healthy set of dynamic server-based functionality in our demo app, but there's even more functionality available in Backand that we didn't have a chance to exercise. For example, Backand integrates with Socket.io to provide event-based communications for your application through their real-time database communications functionality. Using this feature, you can implement a chat system that keys off the database, sending events to connected clients upon receipt of a new message, or allowing for private communications by directing content toward specific users.

Backand also provides the capability to integrate with other functionality providers via custom actions. They support server-side code execution using AWS Lambda, which can be used to integrate with any provider that offers a Node SDK. They've built a wrapper around AWS Lambda that makes implementing a NodeJS Lambda function easy and painless. Once you've finished development, you can then use the Backand CLI to debug and deploy your AWS Lambda function, making it immediately available without having to manage the configuration of API Gateway or any other AWS Service.

Hosting and Storage

Backand also gives you the opportunity to deploy and host your code in Amazon S3, making it publicly available during development and production. Using their CLI, you can easily build a distribution for your web application, and then upload it to an S3 container. The application will then be available on a publicly-accessible URL. You can also use Backand to upload and manage file assets in your application. These are also stored in S3 and can allow you to provide your users with a fully-secured cloud storage environment. With these two tools at your disposal, you should be able to implement some powerful tools that rely upon ready access to custom content, such as a photo archive or an online video repository.


The small app we've built, while demonstrating the potential of - and the power behind - serverless architectures is still nonetheless a small application. It has a number of potential improvements, from UI design to core functionality, and needs some additional work to become a salable product. However, by having leveraged Backand as our serverless platform, we've sown the seeds for future success. By leveraging additional functionality available from Backand's SDK, and other features offered by the platform, we can build dynamic web applications that can meet any number of use cases.

In any case, thanks for taking the time to work through this series of articles. We've written a small application together from line 0, and hopefully, you've discovered some helpful tools along the way. If you'd like to discuss the project more thoroughly or want to explore concepts in serverless development, you can find me all around the web - from Twitter to Stack Overflow to LinkedIn. Thanks for your time!

See the Rest of the Series Here:

What’s the best way to boost the efficiency of your product team and ship with confidence? Check out this ebook to learn how Sentry's real-time error monitoring helps developers stay in their workflow to fix bugs before the user even knows there’s a problem.

serverless frameworks ,jquery ,angular ,react js ,web dev

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}