We are reviewed on Clutch!

Squash Apps Receives 5-star Ratings for Development Services!

We are proud to announce our partnership with Clutch, the leading B2B ratings, reviews and research platform. Clutch lists over 7,000 IT companies all around the world in over 500 industries. The ratings platform helps potential buyers find in-depth testimonials in order to find the best fit software developers, UI/UX designers, and web developers for their next projects.

We’re extremely happy to announce the amazing feedback that has been received by some of our most esteemed clients. With 4 reviews, Squash Apps has a close to perfect score. Our clients have been saying the most delightful things about our services on Clutch, commending Squash Apps for our outstanding communication skills, our flexibility and our superior technology skills.

Their team is extremely proactive in finding alternatives or solutions to obstacles….Squash Apps understood our direction and asked for clarification when needed”– CEO, StayLocal.co

They come highly recommended.” – Partner, 707 Ventures

I don’t know how many projects they have going on, but they give me the feeling as if my project is the only project they’re working on.” – CEO, Shelly Apps

Based on the feedback received, Squash Apps is listed amongst the top software development companies in India on Clutch’s sister site, The Manifest. Our team prides themselves on building the cleanest code possible while completely avoiding any and all shortcuts to ensure that our clients get the highest quality of work. Our top priority is keeping our clients happy with low costs and high quality service.

We like to develop a relationship with our clients so that we can help them maximize the potential in every project. When we work with our clients, communication is the most important tool. We place a strong emphasis on consistent and clear communication so that there is never any confusion at any time. I think you’ll see that commitment if you check out our extensive profile on Clutch.

If you’d like to learn more about our highly rated services, make sure to check out our website and contact us for any inquiries.

NodeJs Essentials: How to restart your nodeJs server programmatically in the event of a failure

You are excited about your new found love for NodeJs and you start creating an application. You have some REST apis wired up and you are all set to change the world! But for some reason, you have some unhandled error in your code and your nodeJs server crashes! Now you got to restart it to make sure it stays up. Ever crossed this scenario? If so, this is for you.

To demonstrate this, let’s look at the below scenario


http.createServer(function (request, response) {
console.log('Ready to accept request');
response.writeHead(200, {
'Content-Type': 'text/plain',
'Access-Control-Allow-Origin' : '*'
});
response.end('Hello World\n');
}).listen(1337);

This is a very simple http server that sends ‘Hello World’ as a response to the requester. To run this program,

  • Save the code above to a file (e.g. hello-world.js)
  • Go to terminal and locate the file. Run node hello-world.js
  • Access ‘http://localhost:1337’ to see the response on your browser/REST client like below
    NodeJs hello world http server

What a happy world!

Your nodeJs program worked!

Now all is fine, until there is an error in your code and your app crashes! Lets simulate this by the below code. Notice, how I am trying to access a property of variable ‘i’ which is not defined.

var http = require('http');
http.createServer(function (request, response) {
console.log('Ready to accept request');
// This line below is going to break your server!
var j = i.someProperty;
response.writeHead(200, {
'Content-Type': 'text/plain',
'Access-Control-Allow-Origin' : '*'
});
response.end('Hello World\n');
}).listen(1337);

Run this code, and hit the http://localhost:1337 url and you will see that the server fails with the below message.

ReferenceError: n is not defined
at Server. (/Users/srijithradhakrishnan/Desktop/httpServer.js:5:17)
at emitTwo (events.js:106:13)
at Server.emit (events.js:191:7)
at HTTPParser.parserOnIncoming [as onIncoming] (_http_server.js:543:12)
at HTTPParser.parserOnHeadersComplete (_http_common.js:105:23)

So, how do we recover from a failure like this and keep the server running? For this, we could use the cluster module from nodeJs. Here is how it could be used.


var http = require('http');
var cluster = require('cluster');
// The master's job to spawn workers initially and when they die
if (cluster.isMaster) {
// Get the number of processor cores
var cpuCount = require('os').cpus().length;

// Create a worker for each CPU
for (var i = 0; i < cpuCount; i += 1) { cluster.fork(); } // When a worker exits, fork a new one cluster.on('exit', function(worker) { console.log('Worker %d died', worker.id); cluster.fork(); }); } else if (cluster.isWorker) { // The real work here for the worker http.createServer(function (request, response) { console.log('Ready to accept request'); // This will cause the server to crash var i = n.start; response.writeHead(200, { 'Content-Type': 'text/plain', 'Access-Control-Allow-Origin' : '*' }); response.end('Hello World\n'); }).listen(1337); // Exit the process when there is an uncaught exception console.log('Worker %d running!', cluster.worker.id); process.on('uncaughtException', function() { console.log('Handled the exception here'); process.exit(1); }); }

  • Now, run the code.
  • See that the master has spawned as many workers are there are cores in your cpu. So if you have a four code CPU, you should see 4 workers spawned!
  • hit the 'hello world' api, you would see that one of the workers died but was respawned again by the master.

Thus your nodeJs server can live on for eternity!

(ok that was too much, but you get the point!)

How to implement SwiperJs slides with IONIC 1.x using ion-slides

With the release of V1.2, ionic announced the support for SwiperJs with the new directive ion-slides. The older ion-slidebox will be deprecated over the new ion-slides. As there was very less documentation and a lot of developers confused on how to get an instance of the swiper in your controller, I decided to write this blog post.

Here’s the forum where I posted the original answer

AngularJS Controller

 

How to use ion-slides in IONIC
AngularJS Controller


HTML

Screen Shot 2016-07-05 at 11.38.31 AM
HTML part

REFERENCES

  1. It can be made much more extensible. The different options available for
    the swiper like effect, speed ..etc is here (Look under Swiper parameters)
  2. Take a look at the api docs here
  3. Awesome Swiper Demos here
  4. Here’s an example gist

With IONIC 1.2 release’s support of swiper, the mobile hybrid developers could now unleash the power of SwiperJS!

Happy coding!

Top 9 mistakes to avoid for Angular v1 developers

AngularJs has seen a tremendous improvement over the last couple of years. With a strong core team, thousands of supporting modules in the ecosystem and backed by Google, AngularJs is the most favourite UI javascript library currently!

But ‘with great powers comes great responsibilities!‘ More and more developers are flocking to AngularJs everyday and it becomes more important to understand the nuances and code accordingly.  Here are some top mistakes developers make while coding in AngularJs and the steps to avoid them!

  1. Modularity

    Keeps angularjs code modular - By Srijith Radhakrishnan, SquashApps
    Keeps angularjs code modular

    Oh please! Please put stuff where they belong! We all have our tendencies to piece together a quick app for a client demo or something and put all stuff in the controllers. You wont believe me how many times I have seen a controller go beyond 500 lines of code!

    • Use Services/Factories wherever required
    • Directives are meant for DOM related stuff. Use them!
    • Keep a watch on the size of the file. Its sometimes as simple as that. If you think it is getting big, time to refactor!
  2. Overloading the RootScope
    Dont overload the rootscope
    Don’t overload the rootscope

    Lot of us think that rootScope in the angular world is some kind of a goods train and we could load all the stuff we want to on it and it would be delivered at the right spot! (Forgive my analogy!) Hope you get the point. When we want to share information between controllers or other modules, the first thing that comes to the mind is ‘Why not use rootscope!?

    • Well, at first, its all going to be fine
    • Then one day, rootScope is going to be a huge datastore on your client side application
    • This could overload angular’s digest cycle in watching these variables and cause a performance degradation
    • You could argue that the performance hit is going to take a while, but hey! It is going to happen!
    • Check out this wonderful explanation on SO about this
  3. Too many watchesDont have too many watches in AngularJSKind of relates to my previous point. Watch is usually used to ‘watch’ a variable and do operations when its value changes. The problem is that ‘watch expressions’ are run multiple (!) times during angular’s digest cycle. Boils down to a simple math. If 1 watch expression is triggered multiple times during a digest cycle, just imagine the performance hit that an app with 100 watch expressions takes!
  4. Broadcasting (events) like a radio station!
              There may be scenarios where broadcasting an event is the right way to go. But sometimes, we tend to solve the problems in the easiest way. After all, we are humans. (or are we??) . If there is a need to transfer data from modules within the app, you could use a factory, or a location parameter in the url or rootscope (sparingly!) or session/local storages or using controller inheritance (so in your child controller you would just do $scope.$parent.getSomeData())
  5. Cancelling Timeouts/IntervalsThere might be a scenario where you might need to add a $timeout to perform some actions after a stipulated time.
    Although timeouts could be totally avoided, if you really have to deal with them, cancel them after the controller is destroyed. You could listen to the controller’s destroy event like this and cancel the timeouts/intervals you created within the controller

    // Creating a timeout
    $scope.timer = $timeout(function() {
           doSomething();
    }, 1000 );

    // Cancel it when the controller is destroyed
    $scope.$on(‘$destroy’, function (){
        $timeout.cancel($scope.timer);
    });

     

  6. DOM manipulations

    DO NOT absolutely do DOM manipulations in controller. Why?

    • DOM manipulations are slow
    • Controllers are not meant for DOM manipulations!
    • Directives are meant for just that.
    • And if you have a directive for DOM manipulation you could reuse it in any other controller. But you cant reuse it if its within the controller itself
  7. Understanding callbacks
    Understand callbacks before you jump into Angular. A lot of times timeouts have been created for the lack of understanding on callbacks. Take for example this simple scenario

    • You want to call a REST api and get a response
    • Then print something on the html. Simple.WRONG: $http.get(some_URL, function(success){}, function(error){});
      $timeout(function(){
      #Hey it takes 5 secs for the above call to complete. Let me just do a timeout!
      $scope.message  = ‘Call success’;
      }, 5000);Btw, this does not exactly execute in 5 seconds. There will be a blog soon on why! (I know you know it already, but we still want to write about it!)RIGHT : 1)  $http.get(some_URL, function(success){$scope.message = ‘Call success’;}, function(error){$scope.message = ‘Call failed’;});(OR)2) var promise = $http.get(some_URL);
      promise.then(function(success){$scope.message = ‘Call success’;}, function(error){$scope.message = ‘Call failed’;});Read more about promises here and about callbacks here
  8. Dependency Injection
    • We found this the hard way but dont inject dependencies for your angular module like thisBAD app.controller(‘MyController’, function(Dep1, Dep2){
      });GOOD app.controller(‘MyController’, [‘Dep1’, ‘Dep2’, function(Dep1, Dep2){
      }]);ok Why do I have this redundancy? Why are my dependencies first injected as inline array annotations and then as parameters to the controller?
      Simple answer
      : Minification
      Detailed: JS minifiers rename the arguments before minification and then  Angular has no absolute idea of what those arguments are! There are two solutions to this
    • Either follow the implementation in the ‘Good’ section above (or)
    • Use tools like ng-annotate which would automatically do the inline array annotations for you.Read more here
  9. JSHINT (static code anaylis) and Tests!

    JS Linting and TESTS are your friends!
    JS Linting and TESTS are your friends!


    Often times, we ignore these guys as we need to meet that one deadline or go to the market before the other guy does! So much that we forget the good stuff that they bring. I am just going to jot down the advantages

    • JSHINT has caught more bugs than all the fish ever caught in human history (Crazy Analogy again. Forgive!)
    • If you had a friend who would sit with you all day while you code and test all your stuff, would you be happy?
      1. If the answer is YES, Karma is the name! Not the literal meaning, but this awesome test runner
      2. If the answer is NO, you need some socializing 😉(Note: if you have a large inherited codebase with no absolutely no tests, dont go about making that your priority! Of course tests are important but not more than the core business! Allocate may be 20% of your time weekly to write tests for the old code and dont write any new code without tests. Eventually you would be boasting a decent test coverage!)I am planning to do a blog later on how Panitr maintains near perfect test coverage

Following good coding practices not only enriches your knowledge but also helps the future app maintainer to not go mad and file a lawsuit against you 😉