diff --git a/src/App.js b/src/App.js
index 6472345..5b0874a 100644
--- a/src/App.js
+++ b/src/App.js
@@ -4,19 +4,25 @@ import Header from './Header';
 import SectionMain from './SectionMain';
 import Aside from './Aside';
 import Footer from './Footer';
-
+//class based component for App - holds all of our app's components
 class App extends Component {
 
   render() {
     return (
       <div className="App">
         <Header backColor="green" width="50%"></Header>
+      //class based component for App - holds all of our app's components
         <SectionMain></SectionMain>
+      // plugs in SectionMain component
         <Aside></Aside>
+       // plugs in the Aside component
         <Footer></Footer>
+      // plugs in SectionMain component
       </div>
     );
   }
 }
 
 export default App;
+// allows App class to be used outside of this file
+
diff --git a/src/Header.js b/src/Header.js
index 5c9495c..dc24cf1 100644
--- a/src/Header.js
+++ b/src/Header.js
@@ -1,21 +1,26 @@
 import React, { Component } from 'react';
 import './Header.css';
+// imports the CSS file for use within this file
 
+// class-based component that controls how the Header behaves
 class Header extends Component {
   render() {
     const style = {
       width: this.props.width,
       backgroundColor: this.props.backColor
+      // App.js pulls props from here
     }
     return (
         <header style={style} className="Header-main">
         </header>
+  // gives us what the Header component class will return
 
     );
   }
 }
 
 export default Header;
+// allow access of Header outside this file
 
 
 //document.querySelector("header").style.backgroundColor = "red"
diff --git a/src/SectionMain.js b/src/SectionMain.js
index cc07a5e..73c4d37 100644
--- a/src/SectionMain.js
+++ b/src/SectionMain.js
@@ -1,6 +1,6 @@
 import React, { Component } from 'react';
 import './SectionMain.css';
-
+//class based component for SectionMain - holds all of our SectionMain's components
 class SectionMain extends Component {
   render() {
     return (
@@ -8,7 +8,10 @@ class SectionMain extends Component {
         </section>
 
     );
+    // this tells our App.js what to render when we plug SectionMain component in
   }
+  
 }
 
 export default SectionMain;
+// allow access of SectionMain outside this file
diff --git a/src/index.js b/src/index.js
index 726c418..64e27c4 100644
--- a/src/index.js
+++ b/src/index.js
@@ -4,6 +4,6 @@ import './index.css';
 import App from './App';
 import registerServiceWorker from './registerServiceWorker';
 
-
+// tells the DOM what to render - App.js renders to the root div of index.html
 ReactDOM.render(<App />, document.getElementById('root'));
 registerServiceWorker();