Database Reference
In-Depth Information
rendering of the dashboard, and the next section hooks the streaming back
end to the front end.
Bootstrap Layouts
This dashboard useslayouts based onTwitter's Bootstrap 3framework. This
is a lightweight framework that integrates well with jQuery and provides
easy integration of mobile features. Because Bootstrap will be used in all of
the sections of the dashboard, it makes the most sense to add it directly to
the layout of the entire web application. The default express layout is called
layout.jade
, which is in the
views
directory. To incorporate Bootstrap,
add the appropriate style sheet and script links, highlighted in bold below:
doctype 5
html
head
title= title
meta(name='viewport',content='width=device-width,
initial-scale=1.0')
link(rel='stylesheet',href='/stylesheets/
bootstrap.min.css')
link(rel='styleshhet',
href='/stylesheets/bootstrap-theme.min.css')
block styles
body
block content
script(src='/javascripts/jquery.min.js')
script(src='/javascripts/bootstrap.min.js')
block scripts
In addition to the usual content block, this layout also incorporates
specialized blocks for customizing styles and adding specialized scripts to a
particular view.
A Dashboard View
This dashboard application has a single index view that renders all of the
metrics to be displayed in the dashboard. A typical dashboard consists of a
variety of small panels that contain metrics or visualizations. Visualizations
of the data are covered in the “Visualizing Data” section of this chapter. The
