diff --git a/package.json b/package.json
index fe881b2..9357361 100644
--- a/package.json
+++ b/package.json
@@ -3,9 +3,16 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "highlight.js": "^9.12.0",
+    "prop-types": "^15.6.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
-    "react-scripts": "1.1.1"
+    "react-highlight": "briancappello/react-highlight#react-v16-compiled",
+    "react-redux": "^5.0.6",
+    "react-remarkable": "^1.1.3",
+    "react-scripts": "1.1.1",
+    "redux": "^3.7.2",
+    "reset-css": "^2.2.1"
   },
   "scripts": {
     "start": "NODE_PATH=src react-scripts start",
diff --git a/public/index.html b/public/index.html
index ed0ebaf..68a68fe 100644
--- a/public/index.html
+++ b/public/index.html
@@ -4,6 +4,9 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
     <meta name="theme-color" content="#000000">
+
+    <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
+
     <!--
       manifest.json provides metadata used when your web app is added to the
       homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
diff --git a/src/components/App/App.css b/src/components/App/App.css
index c5c6e8a..07210b7 100644
--- a/src/components/App/App.css
+++ b/src/components/App/App.css
@@ -1,28 +1,4 @@
 .App {
-  text-align: center;
-}
-
-.App-logo {
-  animation: App-logo-spin infinite 20s linear;
-  height: 80px;
-}
-
-.App-header {
-  background-color: #222;
-  height: 150px;
-  padding: 20px;
-  color: white;
-}
-
-.App-title {
-  font-size: 1.5em;
-}
-
-.App-intro {
-  font-size: large;
-}
-
-@keyframes App-logo-spin {
-  from { transform: rotate(0deg); }
-  to { transform: rotate(360deg); }
+  display: flex;
+  flex: 1;
 }
diff --git a/src/components/App/App.js b/src/components/App/App.js
index b335c22..5a94e0e 100644
--- a/src/components/App/App.js
+++ b/src/components/App/App.js
@@ -1,17 +1,15 @@
 import React, { Component } from 'react';
 import './App.css';
 
+import {
+    AssessmentQuiz
+} from 'components';
+
 class App extends Component {
     render() {
         return (
             <div className={`App`}>
-                <header className={`App-header`}>
-                    <h1 className={`App-title`}>Welcome to React</h1>
-                </header>
-                <p className={`App-intro`}>
-                    To get started, edit <code>src/App.js</code> and save to
-                    reload.
-                </p>
+                <AssessmentQuiz/>
             </div>
         );
     }
diff --git a/src/components/AssessmentQuiz/AssessmentQuiz/AssessmentQuiz.component.js b/src/components/AssessmentQuiz/AssessmentQuiz/AssessmentQuiz.component.js
new file mode 100644
index 0000000..1324e21
--- /dev/null
+++ b/src/components/AssessmentQuiz/AssessmentQuiz/AssessmentQuiz.component.js
@@ -0,0 +1,23 @@
+import React, { PureComponent } from 'react';
+
+import PropTypes from 'prop-types';
+
+import {
+    Quiz,
+    VariableDeclarationQuestion,
+} from 'components';
+
+
+export default class AssessmentQuiz extends PureComponent {
+    static propTypes = {};
+
+    render() {
+        const {} = this.props;
+
+        return (
+            <Quiz>
+                <VariableDeclarationQuestion/>
+            </Quiz>
+        );
+    }
+}
diff --git a/src/components/AssessmentQuiz/AssessmentQuiz/AssessmentQuiz.container.js b/src/components/AssessmentQuiz/AssessmentQuiz/AssessmentQuiz.container.js
new file mode 100644
index 0000000..f60cad2
--- /dev/null
+++ b/src/components/AssessmentQuiz/AssessmentQuiz/AssessmentQuiz.container.js
@@ -0,0 +1,5 @@
+import { connect } from 'react-redux';
+
+import AssessmentQuiz from './AssessmentQuiz.component';
+
+export default AssessmentQuiz;
diff --git a/src/components/AssessmentQuiz/AssessmentQuiz/index.js b/src/components/AssessmentQuiz/AssessmentQuiz/index.js
new file mode 100644
index 0000000..478fa71
--- /dev/null
+++ b/src/components/AssessmentQuiz/AssessmentQuiz/index.js
@@ -0,0 +1 @@
+export { default as AssessmentQuiz } from './AssessmentQuiz.container';
diff --git a/src/components/AssessmentQuiz/VariableDeclarationQuestion/VariableDeclarationQuestion.component.js b/src/components/AssessmentQuiz/VariableDeclarationQuestion/VariableDeclarationQuestion.component.js
new file mode 100644
index 0000000..e0d8469
--- /dev/null
+++ b/src/components/AssessmentQuiz/VariableDeclarationQuestion/VariableDeclarationQuestion.component.js
@@ -0,0 +1,63 @@
+import React, { PureComponent } from 'react';
+
+import PropTypes from 'prop-types';
+
+import {
+    QuizQuestion,
+} from 'components';
+
+const codeFigure = `var name = "Bill";
+
+function caller(func){
+  var myObject = {
+    name: "Joe"
+  };
+  
+  return func(myObject);
+}
+
+function callee(param) {
+  return param.name
+}
+
+var c = caller(callee);`;
+
+const question = `Select the answer below that would set a variable named \`myVariable\` to \`3\``;
+
+const answers = [
+    {
+        type: `code`,
+        text: `myVariable(3)`,
+    },
+    {
+        type: `code`,
+        text: `var myVariable = 3;`,
+    },
+    {
+        type: `code`,
+        text: `var myVariable[3]`,
+    },
+    {
+        type: `code`,
+        text: `var myVariable = {
+    3
+}`,
+    },
+];
+
+
+export default class VariableDeclarationQuestion extends PureComponent {
+    static propTypes = {};
+
+    render() {
+        const {} = this.props;
+
+        return (
+            <QuizQuestion
+                codeFigure={codeFigure}
+                question={question}
+                answers={answers}
+            />
+        );
+    }
+}
diff --git a/src/components/AssessmentQuiz/VariableDeclarationQuestion/VariableDeclarationQuestion.container.js b/src/components/AssessmentQuiz/VariableDeclarationQuestion/VariableDeclarationQuestion.container.js
new file mode 100644
index 0000000..5017c0f
--- /dev/null
+++ b/src/components/AssessmentQuiz/VariableDeclarationQuestion/VariableDeclarationQuestion.container.js
@@ -0,0 +1,5 @@
+import { connect } from 'react-redux';
+
+import VariableDeclarationQuestion from './VariableDeclarationQuestion.component';
+
+export default VariableDeclarationQuestion;
diff --git a/src/components/AssessmentQuiz/VariableDeclarationQuestion/index.js b/src/components/AssessmentQuiz/VariableDeclarationQuestion/index.js
new file mode 100644
index 0000000..462f431
--- /dev/null
+++ b/src/components/AssessmentQuiz/VariableDeclarationQuestion/index.js
@@ -0,0 +1 @@
+export { default as VariableDeclarationQuestion } from './VariableDeclarationQuestion.container';
diff --git a/src/components/AssessmentQuiz/index.js b/src/components/AssessmentQuiz/index.js
new file mode 100644
index 0000000..9777c0c
--- /dev/null
+++ b/src/components/AssessmentQuiz/index.js
@@ -0,0 +1,2 @@
+export * from './AssessmentQuiz';
+export * from './VariableDeclarationQuestion';
diff --git a/src/components/Quiz/Quiz.component.js b/src/components/Quiz/Quiz.component.js
new file mode 100644
index 0000000..0ac8c96
--- /dev/null
+++ b/src/components/Quiz/Quiz.component.js
@@ -0,0 +1,25 @@
+import React, { PureComponent } from 'react';
+
+import PropTypes from 'prop-types';
+
+import {
+    QuizQuestion
+} from 'components';
+
+import './Quiz.css';
+
+export default class Quiz extends PureComponent {
+    static propTypes = {
+        children: PropTypes.array,
+    };
+
+    render() {
+        const {children} = this.props;
+
+        return (
+            <div className={`Quiz`}>
+                {children}
+            </div>
+        );
+    }
+}
diff --git a/src/components/Quiz/Quiz.css b/src/components/Quiz/Quiz.css
new file mode 100644
index 0000000..4016d0c
--- /dev/null
+++ b/src/components/Quiz/Quiz.css
@@ -0,0 +1,6 @@
+.Quiz {
+    flex: 1;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
diff --git a/src/components/Quiz/index.js b/src/components/Quiz/index.js
new file mode 100644
index 0000000..575415a
--- /dev/null
+++ b/src/components/Quiz/index.js
@@ -0,0 +1 @@
+export { default as Quiz } from './Quiz.component';
diff --git a/src/components/QuizQuestion/QuizQuestion.component.js b/src/components/QuizQuestion/QuizQuestion.component.js
new file mode 100644
index 0000000..7726cf2
--- /dev/null
+++ b/src/components/QuizQuestion/QuizQuestion.component.js
@@ -0,0 +1,47 @@
+import React, { PureComponent } from 'react';
+
+import Highlight from 'react-highlight';
+
+import Markdown from 'react-remarkable';
+
+import 'highlight.js/styles/github-gist.css';
+
+import PropTypes from 'prop-types';
+
+import './QuizQuestion.css';
+
+export default class QuizQuestion extends PureComponent {
+    static propTypes = {
+        codeFigure: PropTypes.string,
+        question: PropTypes.string.isRequired,
+        answers: PropTypes.arrayOf(PropTypes.shape({
+            text: PropTypes.string.isRequired,
+        }))
+    };
+
+    render() {
+        const { codeFigure, question, answers } = this.props;
+
+        return (
+            <div className={`QuizQuestion`}>
+                {codeFigure && (
+                    <div className={`QuizQuestion__code-figure`}>
+                        <Highlight className={`javascript`}>{codeFigure}</Highlight>
+                    </div>
+                )}
+                <div className={`QuizQuestion__question`}>
+                    <Markdown>{question}</Markdown>
+                </div>
+                <ol className={`QuizQuestion__answers-list`}>
+                    {answers.map(({ text }, i) => {
+                        return (
+                            <li key={i}>
+                                <Highlight className={`javascript`}>{text}</Highlight>
+                            </li>
+                        );
+                    })}
+                </ol>
+            </div>
+        );
+    }
+}
diff --git a/src/components/QuizQuestion/QuizQuestion.css b/src/components/QuizQuestion/QuizQuestion.css
new file mode 100644
index 0000000..8d68f7c
--- /dev/null
+++ b/src/components/QuizQuestion/QuizQuestion.css
@@ -0,0 +1,32 @@
+.QuizQuestion {
+
+}
+
+.QuizQuestion__question p {
+    font-size: 2rem;
+}
+
+.QuizQuestion__question code {
+    color: #1b2733;
+    background-color: #f7f9fa;
+    border-color: #e6e8eb;
+    font-family: SourceCodePro,monospace;
+}
+
+.QuizQuestion__code-figure {
+    border: 1px solid #e6e8eb;
+    background-color: #f7f9fa;
+}
+
+.QuizQuestion__code-figure > pre {
+    margin: 0;
+}
+
+.QuizQuestion__code-figure .hljs {
+    background-color: transparent;
+    padding: 20px 15px;
+}
+
+.QuizQuestion__answers-list {
+
+}
diff --git a/src/components/QuizQuestion/index.js b/src/components/QuizQuestion/index.js
new file mode 100644
index 0000000..63ee166
--- /dev/null
+++ b/src/components/QuizQuestion/index.js
@@ -0,0 +1 @@
+export { default as QuizQuestion } from './QuizQuestion.component';
diff --git a/src/components/index.js b/src/components/index.js
index ac7ba3b..993f8f0 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -1 +1,4 @@
 export * from './App';
+export * from './AssessmentQuiz';
+export * from './Quiz';
+export * from './QuizQuestion';
diff --git a/src/index.css b/src/index.css
index b4cc725..0a0251e 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1,5 +1,38 @@
 body {
-  margin: 0;
-  padding: 0;
-  font-family: sans-serif;
+    margin: 0;
+    padding: 0;
+    font-family: 'Open Sans', sans-serif;
+    min-height: 100vh;
+    min-width: 100vw;
+    display: flex;
+}
+
+pre {
+    font-family: monospace;
+}
+
+p,
+ul,
+ol,
+pre {
+    line-height: 1.4;
+}
+
+ol {
+    list-style-type: decimal;
+}
+
+ul > li,
+ol > li {
+    margin-left: 20px;
+}
+
+pre > .hljs {
+    padding: 0
+}
+
+
+#root {
+    flex: 1;
+    display: flex;
 }
diff --git a/src/index.js b/src/index.js
index cb774da..a1d0182 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,5 +1,6 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
+import 'reset-css';
 import './index.css';
 
 import { App } from 'components';
diff --git a/yarn.lock b/yarn.lock
index 055348e..a9db610 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -153,6 +153,13 @@ argparse@^1.0.7:
   dependencies:
     sprintf-js "~1.0.2"
 
+argparse@~0.1.15:
+  version "0.1.16"
+  resolved "https://registry.yarnpkg.com/argparse/-/argparse-0.1.16.tgz#cfd01e0fbba3d6caed049fbd758d40f65196f57c"
+  dependencies:
+    underscore "~1.7.0"
+    underscore.string "~2.4.0"
+
 aria-query@^0.7.0:
   version "0.7.1"
   resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-0.7.1.tgz#26cbb5aff64144b0a825be1846e0b16cfa00b11e"
@@ -275,6 +282,10 @@ asynckit@^0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/asynckit/-/asynckit-0.4.0.tgz#c79ed97f7f34cb8f2ba1bc9790bcc366474b4b79"
 
+autolinker@~0.15.0:
+  version "0.15.3"
+  resolved "https://registry.yarnpkg.com/autolinker/-/autolinker-0.15.3.tgz#342417d8f2f3461b14cf09088d5edf8791dc9832"
+
 autoprefixer@7.1.6:
   version "7.1.6"
   resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-7.1.6.tgz#fb933039f74af74a83e71225ce78d9fd58ba84d7"
@@ -3016,6 +3027,10 @@ he@1.1.x:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/he/-/he-1.1.1.tgz#93410fd21b009735151f8868c2f271f3427e23fd"
 
+highlight.js@^9.11.0, highlight.js@^9.12.0:
+  version "9.12.0"
+  resolved "https://registry.yarnpkg.com/highlight.js/-/highlight.js-9.12.0.tgz#e6d9dbe57cbefe60751f02af336195870c90c01e"
+
 hmac-drbg@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/hmac-drbg/-/hmac-drbg-1.0.1.tgz#d2745701025a6c775a6c545793ed502fc0c649a1"
@@ -3032,6 +3047,10 @@ hoek@4.x.x:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/hoek/-/hoek-4.2.0.tgz#72d9d0754f7fe25ca2d01ad8f8f9a9449a89526d"
 
+hoist-non-react-statics@^2.2.1:
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-2.3.1.tgz#343db84c6018c650778898240135a1420ee22ce0"
+
 home-or-tmp@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/home-or-tmp/-/home-or-tmp-2.0.0.tgz#e36c3f2d2cae7d746a857e38d18d5f32a7882db8"
@@ -3261,7 +3280,7 @@ interpret@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.1.0.tgz#7ed1b1410c6a0e0f78cf95d3b8440c63f78b8614"
 
-invariant@^2.2.2:
+invariant@^2.0.0, invariant@^2.2.2:
   version "2.2.2"
   resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.2.tgz#9e1f56ac0acdb6bf303306f338be3b204ae60360"
   dependencies:
@@ -4015,6 +4034,10 @@ locate-path@^2.0.0:
     p-locate "^2.0.0"
     path-exists "^3.0.0"
 
+lodash-es@^4.2.0, lodash-es@^4.2.1:
+  version "4.17.5"
+  resolved "https://registry.yarnpkg.com/lodash-es/-/lodash-es-4.17.5.tgz#9fc6e737b1c4d151d8f9cae2247305d552ce748f"
+
 lodash._reinterpolate@~3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz#0ccf2d89166af03b3663c796538b75ac6e114d9d"
@@ -4060,7 +4083,7 @@ lodash.uniq@^4.5.0:
   version "4.5.0"
   resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773"
 
-"lodash@>=3.5 <5", lodash@^4.14.0, lodash@^4.15.0, lodash@^4.17.2, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.3.0:
+"lodash@>=3.5 <5", lodash@^4.14.0, lodash@^4.15.0, lodash@^4.17.2, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.2.0, lodash@^4.2.1, lodash@^4.3.0:
   version "4.17.5"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.5.tgz#99a92d65c0272debe8c96b6057bc8fbfa3bed511"
 
@@ -5343,6 +5366,29 @@ react-error-overlay@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-4.0.0.tgz#d198408a85b4070937a98667f500c832f86bd5d4"
 
+react-highlight@briancappello/react-highlight#react-v16-compiled:
+  version "0.10.0"
+  resolved "https://codeload.github.com/briancappello/react-highlight/tar.gz/ecf53ae1bb03deddb897515e7ed65b9e9f7af65b"
+  dependencies:
+    highlight.js "^9.11.0"
+
+react-redux@^5.0.6:
+  version "5.0.6"
+  resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-5.0.6.tgz#23ed3a4f986359d68b5212eaaa681e60d6574946"
+  dependencies:
+    hoist-non-react-statics "^2.2.1"
+    invariant "^2.0.0"
+    lodash "^4.2.0"
+    lodash-es "^4.2.0"
+    loose-envify "^1.1.0"
+    prop-types "^15.5.10"
+
+react-remarkable@^1.1.3:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/react-remarkable/-/react-remarkable-1.1.3.tgz#6ef3861812d806fbf747cc1d1e151ee3172130a6"
+  dependencies:
+    remarkable "^1.x"
+
 react-scripts@1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/react-scripts/-/react-scripts-1.1.1.tgz#279d449f7311fed910506987a1ade014027788a8"
@@ -5483,6 +5529,15 @@ reduce-function-call@^1.0.1:
   dependencies:
     balanced-match "^0.4.2"
 
+redux@^3.7.2:
+  version "3.7.2"
+  resolved "https://registry.yarnpkg.com/redux/-/redux-3.7.2.tgz#06b73123215901d25d065be342eb026bc1c8537b"
+  dependencies:
+    lodash "^4.2.1"
+    lodash-es "^4.2.1"
+    loose-envify "^1.1.0"
+    symbol-observable "^1.0.3"
+
 regenerate@^1.2.1:
   version "1.3.3"
   resolved "https://registry.yarnpkg.com/regenerate/-/regenerate-1.3.3.tgz#0c336d3980553d755c39b586ae3b20aa49c82b7f"
@@ -5548,6 +5603,13 @@ relateurl@0.2.x:
   version "0.2.7"
   resolved "https://registry.yarnpkg.com/relateurl/-/relateurl-0.2.7.tgz#54dbf377e51440aca90a4cd274600d3ff2d888a9"
 
+remarkable@^1.x:
+  version "1.7.1"
+  resolved "https://registry.yarnpkg.com/remarkable/-/remarkable-1.7.1.tgz#aaca4972100b66a642a63a1021ca4bac1be3bff6"
+  dependencies:
+    argparse "~0.1.15"
+    autolinker "~0.15.0"
+
 remove-trailing-separator@^1.0.1:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz#c24bce2a283adad5bc3f58e0d48249b92379d8ef"
@@ -5661,6 +5723,10 @@ reserved-words@^0.1.2:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/reserved-words/-/reserved-words-0.1.2.tgz#00a0940f98cd501aeaaac316411d9adc52b31ab1"
 
+reset-css@^2.2.1:
+  version "2.2.1"
+  resolved "https://registry.yarnpkg.com/reset-css/-/reset-css-2.2.1.tgz#fe3204c0c4831979fbb4967c90a992f0164635ed"
+
 resolve-cwd@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/resolve-cwd/-/resolve-cwd-2.0.0.tgz#00a9f7387556e27038eae232caa372a6a59b665a"
@@ -6187,6 +6253,10 @@ symbol-observable@1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-1.0.1.tgz#8340fc4702c3122df5d22288f88283f513d3fdd4"
 
+symbol-observable@^1.0.3:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-1.2.0.tgz#c22688aed4eab3cdc2dfeacbb561660560a00804"
+
 symbol-tree@^3.2.1:
   version "3.2.2"
   resolved "https://registry.yarnpkg.com/symbol-tree/-/symbol-tree-3.2.2.tgz#ae27db38f660a7ae2e1c3b7d1bc290819b8519e6"
@@ -6391,6 +6461,14 @@ uid-number@^0.0.6:
   version "0.0.6"
   resolved "https://registry.yarnpkg.com/uid-number/-/uid-number-0.0.6.tgz#0ea10e8035e8eb5b8e4449f06da1c730663baa81"
 
+underscore.string@~2.4.0:
+  version "2.4.0"
+  resolved "https://registry.yarnpkg.com/underscore.string/-/underscore.string-2.4.0.tgz#8cdd8fbac4e2d2ea1e7e2e8097c42f442280f85b"
+
+underscore@~1.7.0:
+  version "1.7.0"
+  resolved "https://registry.yarnpkg.com/underscore/-/underscore-1.7.0.tgz#6bbaf0877500d36be34ecaa584e0db9fef035209"
+
 uniq@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/uniq/-/uniq-1.0.1.tgz#b31c5ae8254844a3a8281541ce2b04b865a734ff"