diff --git a/app/components/people-list.hbs b/app/components/people-list.hbs
new file mode 100644
index 0000000..b579a66
--- /dev/null
+++ b/app/components/people-list.hbs
@@ -0,0 +1,9 @@
+<h2>{{@title}}</h2>
+
+<ul>
+  {{#each @people as |person|}}
+    <li>
+      <button {{on "click" (fn this.showPerson person)}}>{{person}}</button>
+    </li>
+  {{/each}}
+</ul>
diff --git a/app/components/people-list.js b/app/components/people-list.js
new file mode 100644
index 0000000..4b48d1d
--- /dev/null
+++ b/app/components/people-list.js
@@ -0,0 +1,9 @@
+import Component from '@glimmer/component';
+import { action } from '@ember/object';
+
+export default class PeopleListComponent extends Component {
+  @action
+  showPerson(person) {
+    alert(`The person's name is ${person}!`);
+  }
+}
diff --git a/app/router.js b/app/router.js
index 224ca42..18517d6 100644
--- a/app/router.js
+++ b/app/router.js
@@ -7,4 +7,5 @@ export default class Router extends EmberRouter {
 }
 
 Router.map(function() {
+  this.route('scientists');
 });
diff --git a/app/routes/scientists.js b/app/routes/scientists.js
new file mode 100644
index 0000000..527e2b5
--- /dev/null
+++ b/app/routes/scientists.js
@@ -0,0 +1,7 @@
+import Route from '@ember/routing/route';
+
+export default class ScientistsRoute extends Route {
+  model() {
+    return ['Marie Curie', 'Mae Jemison', 'Albert Hofmann'];
+  }
+}
diff --git a/app/templates/application.hbs b/app/templates/application.hbs
index 72ba6f0..5fd20a6 100644
--- a/app/templates/application.hbs
+++ b/app/templates/application.hbs
@@ -1,6 +1,4 @@
-{{!-- The following component displays Ember's default welcome message. --}}
-<WelcomePage />
-{{!-- Feel free to remove this! --}}
+<h1>People Tracker</h1>
 
 {{outlet}}
 
diff --git a/app/templates/scientists.hbs b/app/templates/scientists.hbs
new file mode 100644
index 0000000..7573d22
--- /dev/null
+++ b/app/templates/scientists.hbs
@@ -0,0 +1 @@
+<PeopleList @title="List of Scientists" @people={{@model}} />
diff --git a/tests/integration/components/people-list-test.js b/tests/integration/components/people-list-test.js
new file mode 100644
index 0000000..90cf994
--- /dev/null
+++ b/tests/integration/components/people-list-test.js
@@ -0,0 +1,26 @@
+import { module, test } from 'qunit';
+import { setupRenderingTest } from 'ember-qunit';
+import { render } from '@ember/test-helpers';
+import { hbs } from 'ember-cli-htmlbars';
+
+module('Integration | Component | people-list', function(hooks) {
+  setupRenderingTest(hooks);
+
+  test('it renders', async function(assert) {
+    // Set any properties with this.set('myProperty', 'value');
+    // Handle any actions with this.set('myAction', function(val) { ... });
+
+    await render(hbs`<PeopleList />`);
+
+    assert.equal(this.element.textContent.trim(), '');
+
+    // Template block usage:
+    await render(hbs`
+      <PeopleList>
+        template block text
+      </PeopleList>
+    `);
+
+    assert.equal(this.element.textContent.trim(), 'template block text');
+  });
+});
diff --git a/tests/unit/routes/scientists-test.js b/tests/unit/routes/scientists-test.js
new file mode 100644
index 0000000..85a5203
--- /dev/null
+++ b/tests/unit/routes/scientists-test.js
@@ -0,0 +1,11 @@
+import { module, test } from 'qunit';
+import { setupTest } from 'ember-qunit';
+
+module('Unit | Route | scientists', function(hooks) {
+  setupTest(hooks);
+
+  test('it exists', function(assert) {
+    let route = this.owner.lookup('route:scientists');
+    assert.ok(route);
+  });
+});