-

diff --git a/LogIn.js b/LogIn.js
new file mode 100644
index 0000000..0105a3a
--- /dev/null
+++ b/LogIn.js
@@ -0,0 +1,6 @@
+import React, { Component } from 'react';
+import { CLIENT_ID } from './credentials.js';
+
+export default class LogInView extends Component {
+
+}
diff --git a/TutorsBreakdown.js b/TutorsBreakdown.js
new file mode 100644
index 0000000..61b0f15
--- /dev/null
+++ b/TutorsBreakdown.js
@@ -0,0 +1,5 @@
+import React, { Component } from 'react';
+
+export default class TutorsBreakdown extends Component {
+
+}
diff --git a/package-lock.json b/package-lock.json
index 4677692..aa2dbaa 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -741,6 +741,11 @@
       "resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
       "integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8="
     },
+    "bootstrap": {
+      "version": "3.3.7",
+      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-3.3.7.tgz",
+      "integrity": "sha1-WjiTlFSfIzMIdaOxUGVldPip63E="
+    },
     "boxen": {
       "version": "0.6.0",
       "resolved": "https://registry.npmjs.org/boxen/-/boxen-0.6.0.tgz",
@@ -976,6 +981,11 @@
       "resolved": "https://registry.npmjs.org/clap/-/clap-1.2.0.tgz",
       "integrity": "sha1-WckP4+E3EEdG/xlGmiemNP9oyFc="
     },
+    "classnames": {
+      "version": "2.2.5",
+      "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.5.tgz",
+      "integrity": "sha1-+zgB1FNGdknvNgPH1hoCvRKb3m0="
+    },
     "clean-css": {
       "version": "4.1.7",
       "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.1.7.tgz",
@@ -1472,6 +1482,11 @@
         }
       }
     },
+    "dom-helpers": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-3.2.1.tgz",
+      "integrity": "sha1-MgPgf+0he9H0JLAZc1WC/Deyglo="
+    },
     "dom-serializer": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.1.0.tgz",
@@ -3514,6 +3529,11 @@
       "resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-1.4.1.tgz",
       "integrity": "sha1-OGchPo3Xm/Ho8jAMDPwe+xgsDfE="
     },
+    "keycode": {
+      "version": "2.1.9",
+      "resolved": "https://registry.npmjs.org/keycode/-/keycode-2.1.9.tgz",
+      "integrity": "sha1-lkojxU5IiUBbSGGlyfBIDUUUHfo="
+    },
     "kind-of": {
       "version": "3.2.2",
       "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
@@ -4898,6 +4918,11 @@
       "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.5.10.tgz",
       "integrity": "sha1-J5ffwxJhguOpXj37suiT3ddFYVQ="
     },
+    "prop-types-extra": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/prop-types-extra/-/prop-types-extra-1.0.1.tgz",
+      "integrity": "sha1-pXvUgQ6C0no/9DF+zBtK0AX3moI="
+    },
     "proxy-addr": {
       "version": "1.1.5",
       "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-1.1.5.tgz",
@@ -5004,6 +5029,11 @@
       "resolved": "https://registry.npmjs.org/react/-/react-15.6.1.tgz",
       "integrity": "sha1-uqhDTsZ4C96ZfNw4C3nNM7ljk98="
     },
+    "react-bootstrap": {
+      "version": "0.31.2",
+      "resolved": "https://registry.npmjs.org/react-bootstrap/-/react-bootstrap-0.31.2.tgz",
+      "integrity": "sha512-6rEK6/Z0UStWkwROhNZ2RW+88AJ83d5i5nGJYoW88JoiAhkOd3MMKaJ4AQZKu+nZ3RWSNzHIKozuBb9N+ewOeA=="
+    },
     "react-dev-utils": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-4.0.0.tgz",
@@ -5060,6 +5090,16 @@
         }
       }
     },
+    "react-overlays": {
+      "version": "0.7.0",
+      "resolved": "https://registry.npmjs.org/react-overlays/-/react-overlays-0.7.0.tgz",
+      "integrity": "sha1-UxiY/1ZsflxyJurShjuM+fu1qYE="
+    },
+    "react-prop-types": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/react-prop-types/-/react-prop-types-0.4.0.tgz",
+      "integrity": "sha1-+ZsL+0AGkpya8gUefBQUpcdbk9A="
+    },
     "react-scripts": {
       "version": "1.0.12",
       "resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-1.0.12.tgz",
@@ -5845,6 +5885,11 @@
         }
       }
     },
+    "uncontrollable": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/uncontrollable/-/uncontrollable-4.1.0.tgz",
+      "integrity": "sha1-4DWCkSUuGGUiLZCTmxny9J+Bwak="
+    },
     "uniq": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/uniq/-/uniq-1.0.1.tgz",
@@ -5993,6 +6038,11 @@
       "resolved": "https://registry.npmjs.org/walker/-/walker-1.0.7.tgz",
       "integrity": "sha1-L3+bj9ENZ3JisYqITijRlhjgKPs="
     },
+    "warning": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/warning/-/warning-3.0.0.tgz",
+      "integrity": "sha1-MuU3fLVy3kqwR1O9+IIcAe1gW3w="
+    },
     "watch": {
       "version": "0.10.0",
       "resolved": "https://registry.npmjs.org/watch/-/watch-0.10.0.tgz",
diff --git a/package.json b/package.json
index f8f33fc..adb1f80 100644
--- a/package.json
+++ b/package.json
@@ -3,7 +3,9 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "bootstrap": "^3.3.7",
     "react": "^15.6.1",
+    "react-bootstrap": "^0.31.2",
     "react-dom": "^15.6.1",
     "react-scripts": "1.0.12"
   },
@@ -13,4 +15,4 @@
     "test": "react-scripts test --env=jsdom",
     "eject": "react-scripts eject"
   }
-}
\ No newline at end of file
+}
diff --git a/src/App.js b/src/App.js
index d7d52a7..4821c68 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,20 +1,19 @@
 import React, { Component } from 'react';
 import logo from './logo.svg';
+import LogInView from './LogIn.js'
 import './App.css';
 
 class App extends Component {
   render() {
-    return (
-      <div className="App">
-        <div className="App-header">
-          <img src={logo} className="App-logo" alt="logo" />
-          <h2>Welcome to React</h2>
-        </div>
-        <p className="App-intro">
-          To get started, edit <code>src/App.js</code> and save to reload.
-        </p>
-      </div>
-    );
+    if (this.state.authorized) {
+        return(
+            <p> youre authorized! </p>
+        );
+    } else {
+        return (
+            <LogInView />
+        )
+    }
   }
 }
 
diff --git a/src/index.js b/src/index.js
index fae3e35..f816ee9 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,3 +1,6 @@
+import 'bootstrap/dist/css/bootstrap.css';
+import 'bootstrap/dist/css/bootstrap-theme.css';
+
 import React from 'react';
 import ReactDOM from 'react-dom';
 import './index.css';