background preloader

Build a real-time polls application with Node.js, Express, AngularJS, and MongoDB

Build a real-time polls application with Node.js, Express, AngularJS, and MongoDB
Recently while lecturing on HTML5 to a large group of students, I wanted to poll them and display their voting results, updating in real-time. I decided to quickly build a polling app for this purpose. I wanted a simple architecture and not too many different languages and frameworks. So I decided to use JavaScript for everything — Node.js and Express for the server-side, MongoDB for the database, and AngularJS for the front-end user interface. “This MEAN stack (Mongo, Express, Angular, Node) may one day surpass the simplicity of the LAMP stack (Linux, Apache, MySQL, PHP) for web application development and deployment.” I chose to use DevOps Services (formerly JazzHub) to manage the source code for my project. What you'll need to build your app A basic familiarity with Node.js, and a Node.js development environmentThese Node.js modules: Express framework, Jade, Mongoose, and socket.ioAngularJS JavaScript frameworkMongoDB NoSQL databaseThe Eclipse IDE, with the Nodeclipse plug-in installed

Related:  live instant messagingangularjsMEAN Stack: Using with NodeNode.js

How to Use Faye as a Real-Time Push Server in Rails There are multiple ways to add push functionality to an application, including Pushr and Pub-Nub, which are quite elegant and simple solutions. There are also some more advanced options. In this article, I’m going to show you how to use Faye, a messaging system that runs on both Ruby and Node.js. Angular.js Tutorial - Part 2 Introduction With the many tools available to aid in developing AngularJS applications, many people have the impression that it’s an extremely complicated framework, which is not at all the case. That’s one of the main reasons I started this tutorial series. In part one we covered the basics of the AngularJS framework and started out by writing our first application. This post is designed for beginners.

Creating a Single Page Todo App with Node and Angular Today we will be creating a very simple Todo application using the MEAN (Mongo, Express, Angular, Node) stack. We will be creating: Single page application to create and finish todosStoring todos in a MongoDB using MongooseUsing the Express frameworkCreating a RESTful Node APIUsing Angular for the frontend and to access the API While the application is simple and beginner to intermediate level in its own right, the concepts here can apply to much more advanced apps. The biggest things we should focus on is using Node as an API and Angular as the frontend.

Build an Angular Todo App with a Node Backend Today we’ll be making a simple todo application based of the TodoMVC project, using the MEAN (Mongo, Express, Angular, Node) Stack. We will: Create a restful APIStore todos in a MongoDBUse AngularJS as a frontendInterface with our API through ng-resourceUse polling to sync todos across clients MultiUser Chat using XMPP and Orbited (Using Ruby-on-Rails) One of the things that I wanted to understand and build since I first learned to program was to build a chat client. Something that would allow people to communicate and I am extremely thankful to Rishav Rastogi for introducing me to XMPP. I never really understood all the moving parts very clearly during my first interaction with the technologies but with some time on my hands now I decided to revisit the entire process of building a web chat client.

AngularJS Tutorial: Learn to Build a Real-Time Reddit Clone - Thinkster There are a myriad of videos & blog posts available on the web that explain the different concepts that comprise AngularJS. However, there are few tutorials that actually show you how to manipulate these concepts for the purpose of building slick single-page apps. In this tutorial, we will show you how to build an entire production ready application with AngularJS. Our intention is to provide the AngularJS community with instructions on how to use AngularJS correctly and effectively, but also in its most modern form. The application you are building will go beyond basic use of AngularJS, and we will attempt to explore as much of the framework as possible. We also feel strongly about maintaining modernity in a tutorial, so we will keep it congruent with AngularJS as the framework and community matures.

Setting Up a MEAN Stack Single Page Application Beginning an application from scratch can sometimes be the hardest thing to do. Staring at an empty folder and a file with no code in it yet can be a very daunting thing. In today’s tutorial, we will be looking at the starting setup for a Node.js, AngularJS, MongoDB, and Express application (otherwise known as MEAN). AngularJS Tutorial for Beginners With NodeJS ExpressJS and MongoDB (Part I) - Adrian Mejia’s Blog This tutorial is meant to be as clear as possible while at the same time teach you how to connect AngularJS with back-end servers in Node.Js, Express.js and databases such as MongoDB, also known as the MEAN stack. Let’s start with angularJS! We are going to start building all the examples in a single HTML file, which has embedded javascript and NO styles/CSS for simplicity. In the next tutorials we will learn how to use angularJS modules to break down the code, add testing to it and styles.

WebRTC Signaling Chat How-to Making your own peer-to-peer chat application using WebRTC is incredibly simple thanks to DataChannel.js and the Pusher API. Let's take a look at how to get everything up and running. To complete your peer-to-peer chat app you'll need some credentials from Pusher. It's worth creating a free account now so you have them prepared for later on in the guide. It only takes a minute to do and it'll save you time later on. Preparation Ultimate guide to learning AngularJS in one day Mastered this? Try my Opinionated AngularJS styleguide for teams What is AngularJS? Angular is a client-side MVC/MVVM framework built in JavaScript, essential for modern single page web applications (and even websites). This post is a full end to end crash course from my experiences, advice and best practices I've picked up from using it.

Single Page Apps with AngularJS Routing and Templating Overview Single page apps are becoming increasingly popular. Sites that mimic the single page app behavior are able to provide the feel of a phone/tablet application. Angular helps to create applications like this easily. Our Simple App We’re just going to make a simple site with a home, about, and contact page. Building an Angular and Express App Part 1 This is somewhat of an update to one of my earlier posts, but delves into setting up a better front end workflow and also using Express 4.x. It will also continue into a series of posts on building out an actual app Note: This has been updated for generator-angular 0.9. Please tell me if you run into any problems! Part 2 - Here Part 3 - There AngularJS PubNub Chat Application The PubNub Angular API lives in the scripts/pubnub-angular.js file. Notice the dependency on the PubNub Angular library (pubnub.angular.service): angular.module('PubNubAngularApp', ["pubnub.angular.service"]) The code for the controllers lives in: Now, the PubNub service can be injected into the controller by name! .controller('JoinCtrl', function($scope, PubNub) { ... });