Danial Khosravi's Blog

Entrepreneur in the making...

Express 4 Tutorial - Simple Server

| Comments

Express 4 was released a while ago and although the API is pretty much the same as version 3, there are some breaking changes which I recommend you to take a look at this page in case you want to move your express 3 application to express 4.

Version 4 changed to Express core and middleware system. Which means the dependency on Connect framework which was built-in Express is removed and you must separately download and add the middleware you want to your application. Also the routing system has changed and the new router has much more flexibility.

I’m planing to write a tutorial series on Express 4. In this tutorial we’re writing a very basic Express 4 app and connect it to a (dummy)Database and authenticate users.

Source Code

Arduino, ProcessingJS and SocketIO in Action

| Comments

So today I wanted to do something relatively cool(!!) with things that I had around me. There are a lot of examples out there that sends input values from Arduino to Processing and then draw something cool. I wanted to do something a bit cooler and as always I wanted to bring Javascript into the action. In this tutorial i’m showing you how I connected my Arduino to a local NodeJS server and with the use of SocketIO send the value of potentiometer to client side and draw a cool graph with ProcessingJS !!!

Arduino and NodeJS Communication With Serial Ports

| Comments

Hello everyone, 2 days ago I recieved my arduino kit that I had ordered and i’m really excited to tell you that I’ll be posting more arduino tutorials from now on.

One of the cool things that i discoved that i’m sharing with you here, is communication of Arduino and NodeJS using serial ports. Basically what we’re doing is sending some data(zeros and ones) from the arduino to the land of Javascript and NodeJS.

Cordova/PhoneGap Tutorial

| Comments

If you are a web app developer and you care about mobile, you definitely heard of PhoneGap

PhoneGap is a free and open source framework that allows you to create mobile apps using standardized web APIs for the platforms you care about.

Before we ger started let me clarify that PhoneGap and Cordova are same thing so don’t get confused !!!

I needed a small app to play with phonegap and last time I wrote the simple note application in AngularJS immediately I start converting it to a phonegap application, which wasn’t that hard.

AngularJS Note Application

| Comments

While ago after getting my head around angular, I wrote this application and I had some plans to make it even more interesting which because of exams period I didn’t get chance of implementing them. Now that I have some free time i’m trying to play a bit more with angular and maybe implement the things that I wanted to do for this little note application. But before doing so I want to share this application with our amazing community just to be an example for the people who are new to angular and this is my first angular application and I think I need your help to give me some feedback or send me pull request and tell me where I did something wrong or I could do better !! For storing the notes, I used PouchDB which is a really nice, easy to use and couchdb like database for inside of the browser. Also you can connect it to a couchdb client to sync the data with your online database if you wish !! Also I used Ratchet to make it a bit more ios like !!

Thank you so much !!

You can see the application Here

And the source code on GitHub

Advanced Security in Backbone Application

| Comments

Recently I was working on the security part of my application and I was experimenting lots of different ways for keeping the single page application secure and authorised. I saw an example of authentication in AngularJS which I found it really interesting and easy and as always(:D) started thinking how to do the same thing in my Backbone application. I tried to cover most of the advanced stuff that we need in most of web applications and usually in books and screencast about backbone there isn’t mush about it and it can be nightmare for beginners !!

For the rest of this article i’m going to explain this sample application that I wrote which I tried to demonstrate route filtering, session management and securing requests using CSRF-Token in a Backbone Application.

ReactJS and Socket.IO Chat Application

| Comments

Updated(13/7/2015)

A week ago I was playing with AngularJS and this little chat application which uses socket.io and nodejs for realtime communication. Yesterday I saw a post about ReactJS in EchoJS and started playing with this UI library. After playing a bit with React, I decided to write and chat application using React and I used Bran Ford’s Backend for server side of this little app.

Filtering in BackboneJS and AngularJS

| Comments

Hi everyone !!!

I’m working on a backbone project at the moment . I have an collection of data and i wanted to filter through them. Using a bit of backbone code I inject this function to my application. This wasn’t a pain at all. However after a bit of playing with AngularJS, I thought it would be cool to show you how filtering works both worlds!!

Backbone Tips: After and Before Methods for Router

| Comments

Hi everybody !!

If you remember my last backbone tip, we added a method called showView and used it to render all of our views in each route !!

Now we might want to do some operation before and after each route, so its nice to implement these two methods and by using a small hack make them called work !!

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
Backbone.Router.prototype.before = function () {};
Backbone.Router.prototype.after = function () {};

Backbone.Router.prototype.route = function (route, name, callback) {
  if (!_.isRegExp(route)) route = this._routeToRegExp(route);
  if (_.isFunction(name)) {
    callback = name;
    name = '';
  }
  if (!callback) callback = this[name];

  var router = this;

  Backbone.history.route(route, function(fragment) {
    var args = router._extractParameters(route, fragment);

    router.before.apply(router, arguments);
    callback && callback.apply(router, args);
    router.after.apply(router, arguments);

    router.trigger.apply(router, ['route:' + name].concat(args));
    router.trigger('route', name, args);
    Backbone.history.trigger('route', router, name, args);
  });
  return this;
};

So by this two line code , this.before would be execute before actual route callback and this.after after it !

So the router would be like this :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
var Router = Backbone.Router.extend({

    routes: {
        '': function(){
          console.log('INDEX ROUTE');
        }
    },
    before: function () {
        console.log('before');
    },
    after: function () {
        console.log('after');
    },


});

var router = new Router();

Backbone.history.start();

Backbone Tips - Managing Views and Memory Leaks

| Comments

Hi everyone,

As you may see in my previous post about backbone, I used a showView for rendering my views as well as keeping track of current view and closing it. One of the important things that you should consider in real world application is memory leaks. We always render the views and the next view comes and render it’s html on previous view and we think it’s gone. But it steel exist and it’s listening for it’s events and each new view that we render,takes our memory. So we need to somehow close our views before rendering the new one.

What we are going to do it something like this :

  1. Adding close method to views prototype
  2. Adding onClose method to views that have child views for closing child views
  3. Adding showView to our router and using it