Implement Sentry Logging Into Node.js App

Sentry Logging For Nodejs App In Express

Sentry Logging For Nodejs App In Express

ade great use of Sentry for it’s unhandled error tracking as well as it’s capabilities for capturing custom messages. Here is a simple implementation to get Sentry up and running in a Node.js app running on Express.

const { sentry } = config;
if (sentry) {
  if (sentry.dsn) {
    // Configure Raven
    Raven.config(sentry.dsn).install();
    // The request handler must be the first middleware on the app
    app.use(Raven.requestHandler());
    // The error handler must be before any other error middleware
    app.use(Raven.errorHandler());
  }
}

We opt to store our dsn values in a config file specific to environment.

An example of a config file might look like (Values found in your Sentry Account):

module.exports = {
  env: 'dev',
  http: 8080,
  sentry: {
    clientDsn: 'https://1111111@sentry.io/22222',
    dsn: 'https://11111:2222222@sentry.io/33333333'
  }
};

This should be done as early in the process as possible, essentially as soon as you initialize

app

you should be initializing Sentry to ensure you capture exceptions at all levels.

Reference: Sentry Implementation Notes

Angular Directive Escape Key Function

Here is a quick angular directive escape key function on a div that I found somewhere (if you know the source let me know so I can give credit. It is quite a simple directive that allows you to apply it to a div or any element and assign a function for it to call.

The Directive:

app.directive('ngEsc', function () {
    return function (scope, element, attrs) {
        element.bind("keydown keypress keyup", function (event) {
            if(event.which === 27) {
                scope.$apply(function (){
                    scope.$eval(attrs.ngEsc);
                });

                event.preventDefault();
            }
        });
    };
});

Now applying the directive to an element looks like this:

//Note the tabindex="0" gives the div focus.
<div ng-esc="closeLightBoxWithEsc()" tabindex="0"></div>

Finally, the function we are calling:

$scope.closeLightBoxWithEsc = function(){
    //Anything your heart desires.
};

Simple AngularJs Countdown Timer

A Simple AngularJs Countdown Timer has come in handy a few times while making new products and slowly removing the dependency on jQuery. I originally wrote a countdown timer using jQuery, but with AngularJs that isn’t considered best practices. This is what the previous javascript looked like.

OLD WAY:

//Countdown timer starting at 3, then closes current window.
var _startCountdown = function(){
	var count = 3;
	var counter = setInterval(function () {
	count = count - 1;
	if (count <= 0) {
	  clearInterval(counter);
	  $('#timer').hide();
	  $('#success').show();
	  //Wait just a second then close tab.
	  setTimeout(function () {
		$window.close();
	  }, 1000);
	  return;
	}
	$('#timer').text(count);
	}, 900);
}

This worked fine and served its purpose. However, with wanting to removed jQuery from within the angular controller, I decided to find a way to do this solely in AngularJs. It turned out to be quite easy.

NEW WAY:

var _startCountdown = function(){
	var timerCount = 3;

	var countDown = function () {
		if (timerCount < 0) {
		  //Any desired function upon countdown end.
		  $window.close();
		} else {
		  $scope.countDownLeft = timerCount;
		  timerCount--;
		  $timeout(countDown, 1000);
		}
	};
	$scope.countDownLeft = timerCount;
	countDown();
}

Now, within your html you have access to a scope variable called {{ countDownLeft }}. Make sure to pass in $timeout into your controller.

Dynamically Center Div Within Div

Dynamically Center Div Within Div turned out to be a bit harder to accomplish with CSS than I wanted. I had to handle a case with internationalization where a div with text was contained in a div and need to be centered vertically. The catch was that the text could be from one line to multiple lines. This was the solution I found.

Html Code:

<div id="page">
 <div id="content_container">
   <div id="content">
     <p>your contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour contentyour content</p>
   </div>
 </div>
</div>

Css Code:

#content-outer {
 display:table;
 overflow:hidden;
 margin:0px auto; 
 height:100%;
 width:465px;
}

#content-inner {
 display:table-cell;
 vertical-align: middle;
}

html, body {
 height:100%;
}

Jsfiddle Here

If anyone has a better solution for dynamically vertically centering a div within a div I would love to hear it.