diff --git a/client/.DS_Store b/client/.DS_Store
index ca50467..bed2ac0 100644
Binary files a/client/.DS_Store and b/client/.DS_Store differ
diff --git a/client/public/index.html b/client/public/index.html
index b8030b4..8e12115 100644
--- a/client/public/index.html
+++ b/client/public/index.html
@@ -7,7 +7,7 @@
     <meta name="theme-color" content="#000000" />
     <meta
       name="description"
-      content="Web site created using create-react-app"
+      content="Berkeley's online advising hub for computer science students."
     />
     <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
     <!--
@@ -24,10 +24,10 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-    <title>Berkeleyspace</title>
+    <title>EECS 101</title>
   </head>
   <body>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <noscript>Berkeley's online advising hub for computer science students.</noscript>
     <div id="root"></div>
     <!--
       This HTML file is a template.
diff --git a/client/public/logo192.png b/client/public/logo192.png
new file mode 100644
index 0000000..dceaf1a
Binary files /dev/null and b/client/public/logo192.png differ
diff --git a/client/public/manifest.json b/client/public/manifest.json
index 080d6c7..dfab091 100644
--- a/client/public/manifest.json
+++ b/client/public/manifest.json
@@ -1,6 +1,6 @@
 {
-  "short_name": "React App",
-  "name": "Create React App Sample",
+  "short_name": "EECS 101",
+  "name": "Berkeley's advising hub for EECS students.",
   "icons": [
     {
       "src": "favicon.ico",
diff --git a/client/src/components/home/detailview.js b/client/src/components/home/detailview.js
index 3ef6224..888fbf0 100644
--- a/client/src/components/home/detailview.js
+++ b/client/src/components/home/detailview.js
@@ -1,102 +1,160 @@
-import * as React from 'react';
-import { Navbar, Nav, Row, Col, Card, Badge, Container, Form, Button } from 'react-bootstrap';
-import Cell from './cell';
+import * as React from "react";
+import { Row, Col, Card, Badge } from "react-bootstrap";
 import { connect } from "react-redux";
-import { getSelectedPost } from "../../redux/selectors";
+import { getSelectedPost, isLoadingDetail } from "../../redux/selectors";
+import * as Spinner from "react-spinkit";
 
+/* The DetailView component is the component that displays detailed information about a post,
+    including the post content and followups. */
 class DetailView extends React.Component {
 
-    constructor(props) {
-        super(props);
-        this.selectedPost = null;
-    }
+  constructor(props) {
+    super(props);
+    this.selectedPost = null;
+    this.loadingDetail = true;
+  }
 
-    emptyPage = () => {
-        return 'Empty page.'
-    }
+  emptyPage = () => {
+    return "Empty page.";
+  };
 
-    postPage = () => {
-        return (
-            <div>
-                <Row className="m-1">
-                <h3 dangerouslySetInnerHTML={{__html: this.props.selectedPost.title}}></h3></Row>
+  postPage = () => {
+    return (
+      <div>
+        {this.props.loadingDetail ? (
+          <div style={{ height: "1005" }} className="justify-content-md-center">
+            <Spinner name="ball-beat" />
+          </div>
+        ) : (
+          <div>
             <Row className="m-1">
-                {this.props.selectedPost.courses ? this.props.selectedPost.courses.map((child) => {
+              <h3
+                dangerouslySetInnerHTML={{
+                  __html: this.props.selectedPost.title,
+                }}
+              ></h3>
+            </Row>
+            <Row className="m-1">
+              {this.props.selectedPost.courses
+                ? this.props.selectedPost.courses.map((child) => {
                     return (
-                        <Badge className="m-1" variant="info">{child}</Badge>
-                    )
-                }) : ''}
-                {this.props.selectedPost.professors ? this.props.selectedPost.professors.map((child) => {
+                      <Badge className="m-1" variant="info">
+                        {child}
+                      </Badge>
+                    );
+                  })
+                : ""}
+              {this.props.selectedPost.professors
+                ? this.props.selectedPost.professors.map((child) => {
                     return (
-                        <Badge className="m-1" variant="success">{child}</Badge>
-                    )
-                }) : ''}
-                {this.props.selectedPost.tags ? this.props.selectedPost.tags.map((child) => {
+                      <Badge className="m-1" variant="success">
+                        {child}
+                      </Badge>
+                    );
+                  })
+                : ""}
+              {this.props.selectedPost.tags
+                ? this.props.selectedPost.tags.map((child) => {
                     return (
-                        <Badge className="m-1" variant="warning">{child}</Badge>
-                    )
-                }) : ''}
+                      <Badge className="m-1" variant="warning">
+                        {child}
+                      </Badge>
+                    );
+                  })
+                : ""}
             </Row>
             <Row className="m-1">
-                {this.props.selectedPost.date ? <p className="m-1" style={{color: 'lightgray', fontSize: "14px"}}>Posted on {new Date(this.props.selectedPost.date).toLocaleDateString("en-US")}.</p> : ''}
+              {this.props.selectedPost.date ? (
+                <p
+                  className="m-1"
+                  style={{ color: "lightgray", fontSize: "14px" }}
+                >
+                  Posted on{" "}
+                  {new Date(this.props.selectedPost.date).toLocaleDateString(
+                    "en-US"
+                  )}
+                  .
+                </p>
+              ) : (
+                ""
+              )}
             </Row>
             <Row className="mt-4 m-2">
-                <p dangerouslySetInnerHTML={{__html: this.props.selectedPost.content}} style={{fontSize: "14px"}}>
-                    
-                </p>
+              <p
+                dangerouslySetInnerHTML={{
+                  __html: this.props.selectedPost.content,
+                }}
+                style={{ fontSize: "14px" }}
+              ></p>
             </Row>
-            
-            {
-                this.props.selectedPost.children ?
-                this.props.selectedPost.children.map((child) => {
-                    return (
-                        <Card className="my-2" style={{width: "100%", borderColor: "#ededed"}}>
-                            <div className="m-2">
-                                <p className="m-1" dangerouslySetInnerHTML={{__html: child.content}} style={{fontSize: "14px"}}>
-                                </p>
-                                <p className="mx-1 my-2" style={{fontSize: "10px", color: "gray"}}>
-                                    {child.date}
-                                </p>
-                                {child.children.map((followup) => {
-                                    return (
-                                        <Card className="my-2" style={{width: "100%", borderColor: "#ededed"}}>
-                                            <div className="m-2">
-                                                <p dangerouslySetInnerHTML={{__html: followup.content}} className="m-1" style={{fontSize: "14px"}}>
-                                                </p>
-                                                <p className="mx-1 my-2" style={{fontSize: "10px", color: "gray"}}>
-                                                    {followup.date}
-                                                </p>
-                                            </div>
-                                        </Card>
-                                    )
-                                })}
-                            </div>
-                        </Card>
-                    )
-                }) : ''
-            }
-            </div>
-        )
-    }
 
-    render() {
-        return (
-            <Col className="m-1" style={{overflowY: "auto", height: "90vh"}}>
-                {this.props.selectedPost ? this.postPage() : this.emptyPage()
-                }
-            </Col>
-        );
-    }
+            {this.props.selectedPost.children
+              ? this.props.selectedPost.children.map((child) => {
+                  return (
+                    <Card
+                      className="my-2"
+                      style={{ width: "100%", borderColor: "#ededed" }}
+                    >
+                      <div className="m-2">
+                        <p
+                          className="m-1"
+                          dangerouslySetInnerHTML={{ __html: child.content }}
+                          style={{ fontSize: "14px" }}
+                        ></p>
+                        <p
+                          className="mx-1 my-2"
+                          style={{ fontSize: "10px", color: "gray" }}
+                        >
+                          {child.date}
+                        </p>
+                        {child.children.map((followup) => {
+                          return (
+                            <Card
+                              className="my-2"
+                              style={{ width: "100%", borderColor: "#ededed" }}
+                            >
+                              <div className="m-2">
+                                <p
+                                  dangerouslySetInnerHTML={{
+                                    __html: followup.content,
+                                  }}
+                                  className="m-1"
+                                  style={{ fontSize: "14px" }}
+                                ></p>
+                                <p
+                                  className="mx-1 my-2"
+                                  style={{ fontSize: "10px", color: "gray" }}
+                                >
+                                  {followup.date}
+                                </p>
+                              </div>
+                            </Card>
+                          );
+                        })}
+                      </div>
+                    </Card>
+                  );
+                })
+              : ""}
+          </div>
+        )}
+      </div>
+    );
+  };
 
+  render() {
+    return (
+      <Col className="m-1" style={{ overflowY: "auto", height: "90vh" }}>
+        {this.props.selectedPost ? this.postPage() : this.emptyPage()}
+      </Col>
+    );
+  }
 }
 
-const mapStateToProps = state => {
-    // const posts = getPosts(state);
-    // return { posts };
-    const selectedPost = getSelectedPost(state);
-    return {selectedPost};
+const mapStateToProps = (state) => {
+  const selectedPost = getSelectedPost(state);
+  const loadingDetail = isLoadingDetail(state);
+  return { selectedPost: selectedPost, loadingDetail: loadingDetail };
 };
 
-export default connect(
-    mapStateToProps
-)(DetailView);
\ No newline at end of file
+export default connect(mapStateToProps)(DetailView);
diff --git a/client/src/components/home/navbar.js b/client/src/components/home/navbar.js
index 12d18ac..b80c338 100644
--- a/client/src/components/home/navbar.js
+++ b/client/src/components/home/navbar.js
@@ -4,7 +4,7 @@ import { Navbar, Nav, Row, Col, Card, Badge, Container, Form, Button } from 'rea
 export default function NavigationBar() {
     return (
         <Navbar bg="light" style={{maxHeight: "10vh"}}>
-            <Navbar.Brand className="bt-bold" href="/">Berkeleyspace</Navbar.Brand>
+            <Navbar.Brand className="bt-bold" href="/">EECS 101</Navbar.Brand>
             <Navbar.Collapse id="basic-navbar-nav">
             <Nav className="ml-auto">
                 <Nav.Link className="bt-bold nav-link" href="/">Home</Nav.Link>
diff --git a/client/src/middleware/monitorReducer.js b/client/src/middleware/monitorReducer.js
index c67ce0a..5266817 100644
--- a/client/src/middleware/monitorReducer.js
+++ b/client/src/middleware/monitorReducer.js
@@ -11,8 +11,6 @@ const monitorReducerEnhancer = createStore => (
     const end = performance.now()
     const diff = round(end - start)
 
-    console.log('reducer process time:', diff)
-
     return newState
   }
 
diff --git a/index.js b/index.js
index 5e6f694..80d0da9 100644
--- a/index.js
+++ b/index.js
@@ -122,7 +122,7 @@ app.post('/query', (req, res) => {
   var tags = req.body.tags || [];
   if (typeof tags == 'string' && tags != '') tags = [tags];
 
-  console.log('Question: ' + question + '; Mode: ' + mode + '; Sort: ' + sort + '; Courses: ' + courses + '; Professors: ' + professors + '; Tags: ' + tags);
+  // console.log('Question: ' + question + '; Mode: ' + mode + '; Sort: ' + sort + '; Courses: ' + courses + '; Professors: ' + professors + '; Tags: ' + tags);
   
   /* If no filters were applied and the search query is empty, return an empty dictionary. */
   if (question == '' && (courses.length + professors.length + tags.length == 0)) {
