Comments added to simple vomit

.vscode/settings.json

@@ -1,3 +1,5 @@
 {
     "terminal.integrated.fontSize": 60
-}
+}
+
+//terminal size has been increased 

src/App.js

@@ -1,10 +1,17 @@
+//import the react npm that was installed
 import React, { Component } from 'react';
+//import the app css styling into this js file
 import './App.css';
+//import the header js information
 import Header from './Header';
+//import the section main js information 
 import SectionMain from './SectionMain';
+//import the aside js information
 import Aside from './Aside';
+//import the footer js information 
 import Footer from './Footer';
 
+//this creates a class which holds an object which ends up rendering information via react coding 
 class App extends Component {
 
   render() {
@@ -19,4 +26,5 @@ class App extends Component {
   }
 }
 
+//you can export this whole thing to be used in other pages of js now 
 export default App;

src/App.test.js

@@ -1,7 +1,13 @@
+
+//import react & reactDOM npms into this file
 import React from 'react';
 import ReactDOM from 'react-dom';
+
+//import app js file into this one 
 import App from './App';
 
+//looks like this is jasmine testing framework to make sure that everything works I guess 
+
 it('renders without crashing', () => {
   const div = document.createElement('div');
   ReactDOM.render(<App />, div);

src/Aside.js

@@ -1,6 +1,9 @@
+//importing react npm and a component as well I think its in curly brackets because of a default state is required 
 import React, { Component } from 'react';
+//importing aside css styling into this file 
 import './Aside.css';
 
+//creating a class with the object inside which is rendering the aside page 
 class Aside extends Component {
   render() {
     return (
@@ -11,4 +14,5 @@ class Aside extends Component {
   }
 }
 
+//exporting the aside file so that it can be used in other files if needed 
 export default Aside;

src/Footer.js

@@ -1,6 +1,9 @@
+//importing react npm and a component as well I think its in curly brackets because of a default state is required 
 import React, { Component } from 'react';
+//import the footer styling into this file
 import './Footer.css';
 
+//creating the class footer with the object and rendering the footer via react 
 class Footer extends Component {
   render() {
     return (
@@ -11,4 +14,5 @@ class Footer extends Component {
   }
 }
 
+//exporting this file so that it can be used and imported in other files 
 export default Footer;

src/index.js

@@ -4,6 +4,6 @@ import './index.css';
 import App from './App';
 import registerServiceWorker from './registerServiceWorker';
 
-
+//renders the browser on this main file via react and gets the main root ID and also the registerServiceWorker runs as a function 
 ReactDOM.render(<App />, document.getElementById('root'));
 registerServiceWorker();

src/registerServiceWorker.js

@@ -8,6 +8,7 @@
 // To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
 // This link also includes instructions on opting out of this behavior.
 
+//this creates a variable about the local host and what to produce if it is being run locally 
 const isLocalhost = Boolean(
   window.location.hostname === 'localhost' ||
     // [::1] is the IPv6 localhost address.
@@ -18,6 +19,7 @@ const isLocalhost = Boolean(
     )
 );
 
+//this exports the function register() and its in line with the app being ran in produce and serviceWorker modes 
 export default function register() {
   if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
     // The URL constructor is available in all browsers that support SW.
@@ -28,7 +30,8 @@ export default function register() {
       // serve assets; see https://github.com/facebookincubator/create-react-app/issues/2374
       return;
     }
-
+
+    //there is an event listener and will load different files 
     window.addEventListener('load', () => {
       const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;