Write test for listing Overheards as HTML

I almost always write a test describing how I want the application to
behave before I write the code that makes it work.

Here, I'm writing a "feature test" using
[`capybara`](https://github.com/jnicklas/capybara#capybara) and
[`minitest`](https://github.com/seattlerb/minitest).

Feature tests are useful for verifying the behavior of your application
from the UI all the way to the database. By writing these first, we can
define what we want our application to do from a human perspective; then
check it automatically by running `ruby test/all.rb`

New Syntax
==========

`class TestSomethingWorksRight < Minitest::Test` - This defines a test.
The `<` syntax says `TestSomethingWorksRight` "is a" `Minitest::Test`.
This means that `TestSomethingWorksRight` can use any methods
available on
[`Minitest::Test`](http://docs.seattlerb.org/minitest/Minitest/Test.html).
The most common of which are the
[`Minitest::Assertions`](http://docs.seattlerb.org/minitest/Minitest/Assertions.html)

`include Capybara::DSL` - This gives our test access to the methods
defined by
[`Capybara::DSL`](http://rubydoc.info/github/jnicklas/capybara/master#The_DSL)

`include Capybara::Assertions` - This gives our test access to the
[Capybara::Assertions](http://rubydoc.info/gems/minitest-capybara/0.7.1/Capybara/Assertions)
which we can use to check that the page has content (`assert_content`)
or certain elements (`assert_selector`)

New Libraries
=============
[Minitest](https://github.com/seattlerb/minitest) is a testing library
for checking your code works the way you believe it should. While not as
popular as [rspec](http://rspec.info); I prefer minitest for its small
size and fast execution speed.

[Capybara](https://github.com/jnicklas/capybara) lets you write code to
interact with a web application in a vaguely human fashion.

[Minitest-Capybara](https://github.com/wojtekmach/minitest-capybara)
brings the two together in a reasonably harmonious fashion; giving us
the power to check if our application works from a humans perspective.
Show overheards on the home page

We've done three things:
1. Defined an `Overheard`
   [model](https://github.com/codeunion/fundamentals-of-web-development/wiki/Glossary#model-mvc)
   for storing quotes in the database.
2. Provided a list of all the `Overheard`s stored in the database to the
   views using the `@overheards` instance variable in the `get "/"`
   route
3. Iterated over each of the `@overheards` and put them inside of a
   [`paragraph`
   tag](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/p)

This allows our test to pass; since we can now store Overheards and are
showing them on the screen.
Remove comments from previous commit
Automate loading of sample data into database

When working on a project it is useful to have sample data. We've
provided a `rake` task to populate our database with 10 gibberish
overheards.

New Libraries
=============

`rake` - This is a tool for running one-off ruby commands without
writing a ton of small scripts. You define `tasks`, then
run them with `rake <task-name>`. To get a list of available tasks, run
`rake -T -A`.

New Concepts
============

`Seeding` - We use the phrase "seeding" to mean "populating with sample
data"
Ensure HTML is Valid HTML5

Invalid HTML is the leading cause of rendering errors, cross-browser
frustration, and depression in front end developers.

To validate I:
1. Right clicked the page in my browser and clicked "view source"
2. Copied the source
3. Visited `http://html5.validator.nu`
4. Selected 'Text Field' from
5. Pasted in my page source
6. Clicked Validate
7. Fixed the errors it told me about
8. Goto 1

New Tags
========
`<!DOCTYPE html>` - Tells the browser that this is an HTML5 document.
[Reference](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Introduction_to_HTML5#Declaring_that_the_document_contains_HTML5_mark-up_with_the_HTML5_doctype)

`<head>` - Contains elements which provide
[metadata](https://github.com/codeunion/fundamentals-of-web-development/wiki/Glossary#metadata)
about the page.
[Reference](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/head)

`<title>` - Declares the title to be shown in the browsers title bar.
[Reference](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/title)

`<body>` - Contains the content of the web page.
[Reference](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/body)

`<header>` - Contains introduction and/or navigation.
[Reference](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/header)

`<main>` - Contains the main content of the page.
[Reference](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/main)

`<h1>` - The most important heading on the page.
[Reference](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements)
Merge pull request #6 from codeunion/1-user-may-see-overheards

User may see overheards