updated process.env name

src/components/Header.js

-import React from "react";
+import React from 'react';
 
-import LoginForm from "./LoginForm";
-import RegisterForm from "./RegisterForm";
-import GameList from "./GameList";
-import NewGameForm from "./NewGameForm";
+import LoginForm from './LoginForm';
+import RegisterForm from './RegisterForm';
+import GameList from './GameList';
+import NewGameForm from './NewGameForm';
 
 class Header extends React.Component {
   constructor(props) {
@@ -11,7 +11,7 @@ class Header extends React.Component {
   }
 
   state = {
-    form: "", // Popup form (login, register etc.)
+    form: '', // Popup form (login, register etc.)
     username: null,
     token: null
   };
@@ -24,23 +24,23 @@ class Header extends React.Component {
   };
 
   handleState = data => {
-    sessionStorage.setItem("name", data.name);
-    sessionStorage.setItem("token", data.token);
+    sessionStorage.setItem('name', data.name);
+    sessionStorage.setItem('token', data.token);
     this.setState({ username: data.name, token: data.token });
   };
 
   handleLogout = () => {
     this.setState({ username: null, token: null });
-    sessionStorage.removeItem("token");
+    sessionStorage.removeItem('token');
   };
 
   // verifies the token (if it exists) on element mount with backend server
   componentDidMount() {
-    let token = sessionStorage.getItem("token");
+    let token = sessionStorage.getItem('token');
     if (token) {
-      fetch(`${process.env.REACT_APP_URL}/user/verify`, {
+      fetch(`${process.env.REACT_APP_API_URL}/user/verify`, {
         headers: {
-          Authorization: "Bearer " + token
+          Authorization: 'Bearer ' + token
         }
       })
         .then(res => res.json())
@@ -49,7 +49,7 @@ class Header extends React.Component {
             // if token is still valid, login user
             if (result === true) {
               this.setState({
-                username: sessionStorage.getItem("name"),
+                username: sessionStorage.getItem('name'),
                 token: token
               });
               // logout user if token has expired / is invalid
@@ -67,56 +67,56 @@ class Header extends React.Component {
   render() {
     return (
       <div>
-        <div className="header">
+        <div className='header'>
           {!this.state.username && (
             <button
-              id="registerButton"
-              onClick={() => this.toggleView("register")}
+              id='registerButton'
+              onClick={() => this.toggleView('register')}
             >
               register
             </button>
           )}
           {!this.state.username && (
-            <button id="loginButton" onClick={() => this.toggleView("login")}>
+            <button id='loginButton' onClick={() => this.toggleView('login')}>
               login
             </button>
           )}
           {this.state.username && (
             <button
-              id="newGameButton"
-              onClick={() => this.toggleView("newgame")}
+              id='newGameButton'
+              onClick={() => this.toggleView('newgame')}
             >
               New Game
             </button>
           )}
           {this.state.username && (
-            <button id="logoutButton" onClick={this.handleLogout}>
+            <button id='logoutButton' onClick={this.handleLogout}>
               logout
             </button>
           )}
           {this.state.username && <button>{this.state.username}</button>}
-          <button id="changeLayerButton" onClick={this.props.handleLayerChange}>
+          <button id='changeLayerButton' onClick={this.props.handleLayerChange}>
             change layer
           </button>
           <GameList handleGameChange={this.props.handleGameChange} />
         </div>
-        {this.state.form === "register" && (
+        {this.state.form === 'register' && (
           <RegisterForm
-            view=""
+            view=''
             handleState={this.handleState}
             toggleView={this.toggleView}
           />
         )}
-        {this.state.form === "login" && (
+        {this.state.form === 'login' && (
           <LoginForm
-            view=""
+            view=''
             handleState={this.handleState}
             toggleView={this.toggleView}
           />
         )}
-        {this.state.form === "newgame" && (
+        {this.state.form === 'newgame' && (
           <NewGameForm
-            view=""
+            view=''
             handleState={this.handleState}
             toggleView={this.toggleView}
           />

src/components/LoginForm.js

-import React from "react";
+import React from 'react';
 
 export class LoginForm extends React.Component {
   constructor(props) {
     super(props);
 
     this.state = {
-      errorMsg: "",
-      username: "",
-      password: ""
+      errorMsg: '',
+      username: '',
+      password: ''
     };
   }
 
@@ -38,11 +38,11 @@ export class LoginForm extends React.Component {
     e.preventDefault();
 
     // Send login info to the server
-    fetch(`${process.env.REACT_APP_URL}/user/login`, {
-      method: "POST",
+    fetch(`${process.env.REACT_APP_API_URL}/user/login`, {
+      method: 'POST',
       headers: {
-        Accept: "application/json",
-        "Content-Type": "application/json"
+        Accept: 'application/json',
+        'Content-Type': 'application/json'
       },
       body: JSON.stringify({
         name: name,
@@ -69,47 +69,47 @@ export class LoginForm extends React.Component {
   };
 
   componentDidMount() {
-    document.addEventListener("keyup", this.handleEsc);
+    document.addEventListener('keyup', this.handleEsc);
   }
 
   componentWillUnmount() {
-    document.removeEventListener("keyup", this.handleEsc);
+    document.removeEventListener('keyup', this.handleEsc);
   }
 
   render() {
     return (
-      <div className="fade-main">
-        <div className="sticky">
+      <div className='fade-main'>
+        <div className='sticky'>
           <span
-            id="closeLoginFormX"
-            className="close"
+            id='closeLoginFormX'
+            className='close'
             onClick={this.handleView}
           >
             ×
           </span>
         </div>
-        <div className="login">
+        <div className='login'>
           <form onSubmit={this.handleLogin}>
             <h1>demo login</h1>
             <br />
             <input
-              placeholder="Enter Username"
-              name="username"
+              placeholder='Enter Username'
+              name='username'
               value={this.state.username}
               onChange={this.handleChange}
-              id="loginUsernameInput"
+              id='loginUsernameInput'
             />
             <br />
             <input
-              placeholder="Enter password"
-              type="password"
-              name="password"
+              placeholder='Enter password'
+              type='password'
+              name='password'
               value={this.state.password}
               onChange={this.handleChange}
-              id="loginPasswordInput"
+              id='loginPasswordInput'
             />
             <br />
-            <button id="submitLoginButton" type="submit">
+            <button id='submitLoginButton' type='submit'>
               login
             </button>
             <h2>{this.state.errorMsg}</h2>