ErrorBoard – The last application you need to log client side errors

Logging client side errors is always beneficial as it gives you capability to analyse and fix errors occurring on different browsers and devices. It helps in making your web app compatible across all browsers where your application is being used.
I have been using Elmah to catch the JavaScript errors and it works but it is not the ideal tool for this job. Elmah is designed in a way to catch server side exceptions and show detailed trace for the same. It cannot provide you required analytics of a client side error.
Today I am going to introduce you to ErrorBoard, an application that I came across recently and became fan of it.

  1. It is a Node.js application
  2. Provides detailed analytics for client side errors
  3. Error reporting by various parameters
    • By browsers
    • By script files
    • By pages
  4. You can run multiple instances of this application

You can find more information about ErrorBoard at its github repository.
Lets see how to setup this application and start using it.
Prerequisites for ErrorBoard

Step by step procedure to setup ErrorBoard

  1. Clone latest github repository
    Just do

    git clone https://github.com/Lapple/ErrorBoard.git

    in github shell.
    ErrorBoard Git Clone

  2. Install package dependencies
    Open Node.js command prompt and do

    npm install

    npm install

  3. Change configuration settings if required
    You can change certain settings like port number etc. in package.json under ErrorBoard folder.
  4. Start the application
    Do

    npm start

    on Node.js command prompt and it will start and running
    Open your browser and go to http://localhost:3000 (or port number you assigned). You should see something like:
    eb

You are done!
Now put following lines in the head section of pages you want to track errors for:

window.onerror = function( message, url, line, column, error ) {
  var e = encodeURIComponent;
  ( new Image() ).src = 'http://127.0.0.1:3000/error?message=' + e( message ) +
                                                   '&url='     + e( url ) +
                                                   '&line='    + e( line ) +
                          ( error && error.stack ? '&stack='   + e( error.stack ) : '' ) +
                                        ( column ? '&column='  + e( column ) : '' );
};

Any error occurred on the page will be displayed in ErrorBoard as
ErrorBoard
That’s all. I would encourage you to install and explore this application. Feel free to discuss if you have any questions.

By default closing command window will stop ErrorBoard. If you want to make it run always then install forever node module and run following command to run ErrorBoard as daemon.

npm run browserify && forever start eb.js

If you liked this article then don’t forget to share it using links below.

You may also like...