Build a Node.js-powered Chatroom Web App: Debugging Remotely

Originally published at: http://www.sitepoint.com/build-node-js-powered-chatroom-web-app-debugging-remotely/

This article is part of a web dev tech series from Microsoft. Thank you for supporting the partners who make SitePoint possible.

This Node.js tutorial series will help you build a Node.js-powered real-time chatroom web app fully deployed in the cloud. In this series, you will learn how to setup Node.js on your Windows machine (or just learn the concepts if you’re on Mac), how to develop a web frontend with Express, how to deploy a Node.js Express app to Azure, how to use Socket.IO to add a real-time layer, and how to deploy it all together.

The tutorial will use the optional Visual Studio and the Node.js Tools for Visual Studio plug-in as a development environment. I have provided links to free downloads of both tools. This is a beginner to intermediate-level article—you’re expected to know HTML5 and JavaScript.

Part 1 – Introduction to Node.js

Part 2 – Welcome to Express with Node.js and Azure

Part 3 – Building a Backend with Node.js, Mongo and Socket.IO

Part 4 – Building a Chatroom UI with Bootstrap

Part 5 – Connecting the Chatroom with WebSockets

Part 6 – The Finale and Debugging Remote Node.js Apps

Part 6 – The Finale and Debugging Remote Node Apps!

Welcome to Part 6 of the hands-on Node.js tutorial series: Build a Node.js-powered chatroom web app.

In this final installment, I will show you how to do a final deployment of your chatroom and how to perform remote debugging.

Deploying to Azure!

Now that we’ve got our Node.js-powered anonymous chatroom app working, let’s deploy it to the cloud in a few clicks. You can deploy to any cloud that supports Node.js. I will be using Microsoft Azure as I can run a Node.js website on there for free.

You can sign up for a free trial of Microsoft Azure here. You will get trial credits to spend on all Azure services. For the service we are using, Azure Websites, you can actually run 10 websites without spending a dime.

  1. Once you have your Azure account set up, go back to the IDE, right click on the project and click Publish.

  2. Clicking Publish will open a wizard with a few options, select the target Microsoft Azure Websites.

  3. You will be asked to sign in at this step, please use the same Microsoft Account here as you did on the Azure sign up.

  4. Click New to create a new Azure website or, if you already have one created, you can select it from the dropdown.

  5. You will want to complete the fields in the wizard (just like below). Make sure to choose a unique site name, and then click Create.

  6. You will be presented with a pre-filled wizard. Click Publish.

We’ve deployed to the cloud but the work is not over yet!

Continue reading this article on SitePoint
1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.