Code clean up and adding comments

Femi236 · Feb 8, 2021 · 30e1fef · 30e1fef
1 parent d853a66
commit 30e1fef
Show file tree

Hide file tree

Showing 10 changed files with 60 additions and 372 deletions.
diff --git a/public/index.html b/public/index.html
@@ -25,29 +25,7 @@
       crossorigin="anonymous"
     />
 
-    <!--
-      Notice the use of %PUBLIC_URL% in the tags above.
-      It will be replaced with the URL of the `public` folder during the build.
-      Only files inside the `public` folder can be referenced from the HTML.
-
-      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
-      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>React App</title>
   </head>
-  <body id="root" class="d-flex h-100 text-center text-white mybg">
-    <noscript>You need to enable JavaScript to run this app.</noscript>
-
-    <!--
-      This HTML file is a template.
-      If you open it directly in the browser, you will see an empty page.
-
-      You can add webfonts, meta tags, or analytics to this file.
-      The build step will place the bundled scripts into the <body> tag.
-
-      To begin the development, run `npm start` or `yarn start`.
-      To create a production bundle, use `npm run build` or `yarn build`.
-    -->
-  </body>
+  <body id="root" class="d-flex h-100 text-center text-white mybg"></body>
 </html>
diff --git a/src/App.js b/src/App.js
@@ -1,9 +1,10 @@
 import React, { Component } from "react";
-//import "./App.css";
+
 import "./cover.css";
+import "weather-icons/css/weather-icons.css";
+
 import LoadPage from "./components/loadPage";
 import Clock from "./components/clock";
-import "weather-icons/css/weather-icons.css";
 import Weather from "./components/weather";
 import Spotify from "./components/spotify";
 import ImageSlideshow from "./components/imagelideshow";
@@ -13,15 +14,16 @@ class App extends Component {
   constructor() {
     super();
     this.state = {
-      render: false, //Set render state to false
+      // Initially set render state to false to allow loadPage component to show
+      render: false,
     };
   }
 
   componentDidMount() {
     setTimeout(
       function () {
-        //Start the timer
-        this.setState({ render: true }); //After 3 seconds, set render to true
+        //Start the timer, After 3 seconds, set render to true
+        this.setState({ render: true });
       }.bind(this),
       3000
     );
@@ -63,8 +65,6 @@ class App extends Component {
             <Quote />
           </div>
         </div>
-
-        {/* <div className="row container-fluid h1"></div> */}
       </React.Fragment>
     );
   }

diff --git a/src/components/clock.jsx b/src/components/clock.jsx
@@ -29,14 +29,15 @@ class Clock extends Component {
   };
 
   componentDidMount() {
-    this.tmerId = setInterval(() => this.tick(), 1000);
+    this.timerId = setInterval(() => this.tick(), 1000);
   }
 
   componentWillUnmount() {
-    clearInterval(this.tmerId);
+    clearInterval(this.timerId);
   }
 
   returnedTime = (props) => {
+    // Return different parts of the time depending on the type of component called
     if (this.props.type === 1) {
       return this.state.date.toLocaleTimeString();
     } else if (this.props.type === 2) {

diff --git a/src/components/exampleSpotifyObject b/src/components/exampleSpotifyObject