Node.js Express Sign-Up Site Tutorial on Azure Websites (Part 0)

Recently, I’ve started focusing more on node.js development. While being harder (imo) than developing Windows or Android Apps and not as exciting as working with hardware, there are a range of advantages that compelled me to start developing for web. The primary reason is the ease of disseminating content through the web. Although the initial cost for me to fire-up and distribute a Windows Phone app is probably lower, in the long run, it’s a lot harder to get people to try it out. People are lazy and generally won’t bother downloading your stuff unless they really like you or have a good deal to gain by downloading your app. With a website on the other hand, people are usually a mouse breadth away from clicking on your link in a Facebook chat window. Better yet, if they’re not on a PC, they can still access the same content as everyone else, using that same link, on any device.

Why this is extremely useful is because it helps you win with things like hackathons or anywhere where you might be obliged to sell a concept. For the price of a domain, you can get a room full of people to visit your site during a demo. The investor you’re pitching will actually bother looking at your site, as opposed to using some demeaning tactic like saying she doesn’t have time to download your app.

Some of the other benefits include being able to use SEO or social marketing. It’s a lot harder to influence where your app shows up in an app store, when every app is given the same amount of screen space between a million others. On the internet, how popular your site is depends on how well you can game Google, Bing, Facebook and Twitter (apps themselves have to compete with sites in this domain, but honestly how often do you come across an app as opposed to a hyperlink?) No doubt there are millions of more potential competitors on the internet, but it’s a lot easier to SEO your up to a search engine’s front page than an app store’s.

To document my own learning, I will be writing up tutorials to show how you can create and launch your own website on Azure Websites. There are a lot of good tutorials on making a simple sample site with Express and Node.js and some other ones on Azure, but there isn’t any comprehensive tutorial to show you how to combine them and make an actual, useable website. Some things I’ll cover are domains, databases and styling your website.

Why Node.js?

There are several web stacks I could’ve picked from, such as the ever present LAMP stack (PHP w/ SQL), the startup perennial Ruby on Rails, Django or flask for Python, or even C#/ASP.NET (C# is my favourite language, if you didn’t know already). Asking which is better is evidently a shark vs. gorilla question. Node.js currently fits my needs better than other frameworks and is more convenient for me to use.

I first considered using LAMP, but I wanted to take advantage of the perks of the newer stacks, such as easy prototyping and package managers. PHP itself is now getting many of these upgrades via frameworks such as Symfony and Laravel. I came close to using Laravel, but couldn’t get it configured due to some server issues and eventually stuck to what I had working already (which was node.js). As of now, PHP (especially with Laravel) is probably the easiest to pickup. Examples of large sites using LAMP are Facebook (largely because it was made in the early 2000s when PHP was all there was and a revamp would be a very costly procedure to pursue). It does get the job done. Also begging a mention is the fact that most development tasks can be fulfilled by writing a WordPress plugin rather than making an entire site, drastically reducing the time required to deploy a product

Ruby on Rails was my other option. The main reason I decided not to follow through was because of its steep learning curve. Ruby on its face is easy to learn, but RoR takes work. RoR probably has the largest community right now and this shows with the wealth of plugins they have, aptly titled gems. Ruby also has some other perks such as scaffolding and out of the box CSRF protection. I didn’t end up using RoR because I wanted to put less effort in learning the basics.

I don’t use the python stacks mainly because I’m not a python fan, though my friends have had good results with Django on Google App Engine. C# I stayed away from because I wanted to get experience with other languages and to make it easier for me to find younger developers/get hired in non-enterprise. ASP.NET development is somewhat stigmatized, but it’s actually pretty neat. I won’t go in to detail in this post.

After eliminating all the other options, I was left with node.js. My two main reasons for using node.js was the excellent support now available on Azure and Visual Studio (check out Node Tools for Visual Studio) for node and the fact that node.js uses javascript, permitting me to use one language for all my web development. It’s pretty easy to pick up coming from C# or Java (as opposed to PHP or Ruby). Node.js also has a glorious package manager, npm, which is akin to sudo apt-get on Ubuntu. Where node.js really shines is multiple concurrent connections to the server/high IO traffic, such as in a chat application or maybe even a 2D browser MMORPG. This isn’t currently too important for me, but I wanted to learn how to develop with it for when it will be important. For a quick tutorial on Javascript and node.js, check out learnyounode.

Why Azure Websites?

Azure Websites (and Azure in general) is great. After doing some mucking around, I found out that Azure supposedly initially had a very ugly GUI, but the Azure team (cloud was under Nadella at the time) fixed it and now, boy is it sexy! I never fathomed spinning up a server in mere seconds and this was probably the catalyst for me taking the leap to Web. The price is pretty competitive with Amazon Web Services (they’re both constantly dropping their rates, they’ll send you e-mails every week about it, literally) and although it’s not as cheap as hosting a dozen low traffic sites on a shared host (like I do with this blog), if you scale to a commercial load, the prices even out. Microsoft is also currently working to give students and startups a good deal of free hosting credits (Y Combinator companies for example, get 500k in Azure costs defrayed) so try to contact your local campus or startup Microsoft rep to hook you up.

The Goal: Proshno.com.bd

I wanted to start a site to offer a certain service in Bangladesh. Seeing as it’s going to take a while to launch the site, I wanted to put up a beta sign-up page on the domain so I could drum up some interest for the brand. The site is currently pretty basic, but it encompasses a host of technologies to carry out its objective. A user can sign-up with their e-mail and pick an option from a form. If they sign-up with a proper e-mail, their details are entered on a database and an e-mail is sent to my inbox. As opposed to redirecting, the page uses AJAX to confirm or deny the sign-up on the same page. The routing and closer to metal stuff is taken care by node.js and the Express(.js) web framework. Sendgrid deals with e-mails and Azure tables stores our database results. The site is responsive thanks to bootstrap, but currently has some graphical bugs on certain devices.

Initial pre-functional mockup of the Proshno Sign-Up Page.

Initial pre-functional mockup of the Proshno Sign-Up Page.

I’ll put the first tutorial up shortly. For now, it would be wise to download node.js and familiarize yourself with Jade (a cool way to write HTML) and Stylus (a cool way to write CSS) if you haven’t already.

EDIT: The next tutorial in the series can be found here.

1 Thought.

  1. Pingback: Setup Azure Websites & Add Domains

Leave a Reply

Your email address will not be published. Required fields are marked *