Refactor: Create .env file and align table to top of container

Create `.env` file and align table to top of container
- Create `.env` file for environment variables pointing to Nasa URL's
- Align the meteorite table to the top of its contains. This prevents unwanted empty space being added before and after the table when it is filtered.

Resolves: N/a
See also: N/a

.env

@@ -0,0 +1,6 @@
+# Meteorite Explorer Environment Variables
+
+# Meteorite dataset from Nasa Open Data Portal
+REACT_APP_METEORITE_LANDING_HOMEPAGE="https://data.nasa.gov/Space-Science/Meteorite-Landings/gh4g-9sfh"
+REACT_APP_METEORITE_STRIKE_DATASET="https://data.nasa.gov/resource/y77d-th95.json"
+

src/App.css

@@ -33,9 +33,10 @@
   display: flex;
   flex-direction: column;
   align-items: center;
-  justify-content: center;
+  justify-content: flex-start;
   font-size: calc(10px + 2vmin);
   color: white;
+  margin: 0px auto;
 }
 
 .App-footer {

src/App.js

@@ -20,7 +20,7 @@ class App extends Component {
   }
 
   async componentDidMount() {
-    const response = await fetch("https://data.nasa.gov/resource/y77d-th95.json");
+    const response = await fetch(process.env.REACT_APP_METEORITE_STRIKE_DATASET);
     const json = await response.json();
     this.setState({ meteoriteStrikes: json });
     this.setState({ isDataLoaded: true});
@@ -45,16 +45,16 @@ class App extends Component {
         <section className="App-results">
           <div>
             {this.state.isDataLoaded ?
-              ( <MeteoriteTable meteoriteStrikes={ this.state.meteoriteStrikes } 
-                  searchTerms={ this.state.searchTerms } /> ) 
+              ( <MeteoriteTable meteoriteStrikes={ this.state.meteoriteStrikes }
+                  searchTerms={ this.state.searchTerms } /> )
               : (' ')
             }
           </div>
         </section>
 
         <footer className="App-footer">
           <BottomBar title="Data courtesy Nasa Open Data Portal"
-            href="https://data.nasa.gov/Space-Science/Meteorite-Landings/gh4g-9sfh" />
+            href={ process.env.REACT_APP_METEORITE_LANDING_HOMEPAGE } />
         </footer>
       </div>
     );

src/components/MeteoriteTable.js

@@ -58,7 +58,7 @@ const MeteoriteTable = (props) => {
         <TableBody>
           {meteoriteStrikes
             .filter(strike => {
-              return searchTerms === '' || 
+              return searchTerms === '' ||
                      (strike.name).toLowerCase().includes(searchTerms.toLowerCase())
             })
             .map(strike => {