{"id":2737,"date":"2018-02-10T13:47:54","date_gmt":"2018-02-10T19:47:54","guid":{"rendered":"http:\/\/www.mooreds.com\/wordpress\/?p=2737"},"modified":"2018-02-10T13:47:54","modified_gmt":"2018-02-10T19:47:54","slug":"smashing-a-quick-dashboard-solution","status":"publish","type":"post","link":"https:\/\/www.mooreds.com\/wordpress\/archives\/2737","title":{"rendered":"Smashing: A Quick Dashboard Solution"},"content":{"rendered":"<p>I&#8217;m putting together a business metrics dashboard for The Food Corridor (what is old is new again, I remember a project at XOR, my first job out of school, that was all about creating a dashboard). I could have just thrown together some rails views, but I looked around and saw <a href=\"https:\/\/github.com\/Smashing\/smashing\/\">Smashing<\/a>, which is a fork of <a href=\"http:\/\/dashing.io\/\">Dashing<\/a>, a dashboard project that came out of shopify.<\/p>\n<p>Smashing is a sinatra app and is fairly simple to set up. It looks gorgeous, a lot better than anything I could hack together. I could install it on a free heroku dyno. Even though it will take a bit of time to spin up, it is now running for free. Smashing has nice MVC separation&#8211;you have dashboards which assemble widgets, and then jobs which push data to widgets on a schedule. Sending data looks something like this: <code>send_event('val', { current: current })<\/code> where <code>val<\/code> is referenced in the widget.<\/p>\n<p>You can create more than one dashboard (I did only one). They aren&#8217;t customizable by non developers, but once the widgets are written, they can be created by someone with a modicum of experience editing HTML.<\/p>\n<p>Some tips:<\/p>\n<ul>\n<li>Smashing stores its state in a file. If you are running on heroku, the <a href=\"https:\/\/devcenter.heroku.com\/articles\/dynos#ephemeral-filesystem\">filesystem is ephemeral<\/a>. You have two options. You can store the state in an external data store like redis (<a href=\"https:\/\/github.com\/Smashing\/smashing\/wiki\/How-to%3A-Deploy-to-Heroku#free-dyno-usage-notice\">patch mentioned here<\/a>, I didn&#8217;t try it). Or you can rely on the systems you are polling for metrics to maintain the state. That&#8217;s the path I took.<\/li>\n<li>The number widget has the ability to display percentage changed since last updated: <code>send_event('val', { current: current, last: last })<\/code>. Make sure that val is an integer&#8211;I sent a string like &#8220;100000&#8221; and that was treated as a zero for purposes of calculation.<\/li>\n<li>If you are accessing any external systems, make sure you inject any secrets via environment variables.\u00a0 For local development, I used <a href=\"https:\/\/github.com\/bkeepers\/dotenv\">dotenv<\/a>.<\/li>\n<li>You&#8217;ll want some kind of <a href=\"https:\/\/github.com\/Smashing\/smashing\/wiki\/How-to%3A-Add-authentication\">authentication system<\/a>.<\/li>\n<li>The widgets that come with Smashing aren&#8217;t complicated, but neither are they documented, so prepare to spend some time understanding what they expect.<\/li>\n<li>I grouped jobs, which gather the data, by data source.\u00a0 You can send multiple events per job, and I thought that made it clearer.\u00a0 Connections to APIs or databases only needed to happen once as well.<\/li>\n<li>The business metrics which I was displaying really only change on a monthly basis.\u00a0 So I wanted to run the data gathering immediately, then in a week or two weeks.\u00a0 Because of the ephemeral state, I expect the second run will never happy, but wanted to be prepared for it.\u00a0 I did so by creating a function and calling it once on job load and then in the scheduler.<\/li>\n<\/ul>\n<p>Here&#8217;s pseudo code for the job that pulls data from stripe:<\/p>\n<pre>\r\n\r\nStripe.api_key = ENV['STRIPE_SECRET_KEY']\r\n\r\ndef stripe\r\n  # pull data from stripe...\r\n  send_event('stripeval', { current: current })\r\nend\r\n\r\nstripe\r\n\r\nSCHEDULER.interval '1w' do\r\n  stripe\r\nend\r\n<\/pre>\n<p>Smashing is no full on technical metrics solution (like Scout or New Relic), but can be useful for displaying limited data in a beautiful format with a minimum of developmetn effort. If you&#8217;re looking for a dead simple dashboard, Smashing will work for you.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>I&#8217;m putting together a business metrics dashboard for The Food Corridor (what is old is new again, I remember a project at XOR, my first job out of school, that [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[81,33,20],"tags":[],"class_list":["post-2737","post","type-post","status-publish","format-standard","hentry","category-the-food-corridor","category-useful-tools","category-web-applications"],"_links":{"self":[{"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/posts\/2737","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/comments?post=2737"}],"version-history":[{"count":2,"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/posts\/2737\/revisions"}],"predecessor-version":[{"id":2739,"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/posts\/2737\/revisions\/2739"}],"wp:attachment":[{"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/media?parent=2737"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/categories?post=2737"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.mooreds.com\/wordpress\/wp-json\/wp\/v2\/tags?post=2737"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}