title: JavaScript firebase "=>" in addEventListener
body: <p>I'm new to JS and Firebase so my question is probably very easy, but I couldn't find anything on the WEB that would answer my question.</p>
  
  <p>I'm working with the firebase tutorial available on youtube. The code I have to capture username and password and pass it to firebase looks like this:</p>
  
  <pre><code>btnLogin.addEventListener('click', e =&gt; {
      const email = txtEmail.value;
      const pass =txtPassword.value();
      const auth = firebase.auth();
      const promise = auth.signInWithEmailAndPassword(email,pass);
      promise.catch(e =&gt; console.log(e.message));
  </code></pre>
  
  <p>});</p>
  
  <p>I'm using webstorm and it getting errors on "=>" and first.</p>
  
  <p>When I try to run this anyway I'm getting </p>
  
  <pre><code>"app.js:19 Uncaught TypeError: Cannot read property 'addEventListener' of null"
  </code></pre>
  
  <p>which lead to the same "=>" </p>
  
  <p>can someone please explain what this is and how to use it? or point me in the right direction to where to look for more information. when I try to google it I'm always getting logic related topics (ass comparisons).</p>
  
  <p>I'm a real noob in JS so please take it easy on me...</p>
  
  <p>EDIT:</p>
  
  <p>I managed to get the webstorm to work - thanks!</p>
  
  <p>But I'm still getting the same error when the page loads:</p>
  
  <pre><code>"app.js:19 Uncaught TypeError: Cannot read property 'addEventListener' of null"
  </code></pre>
  
  <p>CODE:
  app.js:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>(function () {
  console.log("start");
      //get elements
      const txtEmail = document.getElementById("txtEmail");
      const txtPassword = document.getElementById("txtPassword");
      const btnLogin = document.getElementById("btnLogin");
      const btnSignUp = document.getElementById("btnSignUp");
      const btnLogOut = document.getElementById("btnLogOut");
  
      //add login event
      btnLogin.addEventListener("click", e =&gt; {
          const email = txtEmail.value;
          const pass =txtPassword.value;
          const auth = firebase.auth();
          const promise = auth.signInWithEmailAndPassword(email,pass);
          promise.catch(e =&gt; console.log(e.message));
  });
  }());
  index.html:</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="container"&gt;
  
      &lt;form class="form-signin"&gt;
          &lt;h2 class="form-signin-heading"&gt;Please sign in&lt;/h2&gt;
          &lt;input type="inputEmail" id="txtEmail" class="form-control" placeholder="Email address" required autofocus&gt;
          &lt;input type="inputPassword" id="txtPassword" class="form-control" placeholder="Password" required&gt;
          &lt;div class="checkbox"&gt;
              &lt;label&gt;
                  &lt;input type="checkbox" value="remember-me"&gt; Remember me
              &lt;/label&gt;
          &lt;/div&gt;
          &lt;button id="btnLogIn" class="btn btn-lg btn-primary btn-block" type="submit"&gt;Log in&lt;/button&gt;
          &lt;button id="btnSignUp" class="btn btn-lg btn-primary btn-block" type="submit"&gt;Sign Up&lt;/button&gt;
          &lt;button id="btnLogOut" class="btn btn-lg btn-primary btn-block hide" type="submit"&gt;Log Out&lt;/button&gt;
      &lt;/form&gt;
  &lt;/div&gt;
  &lt;script src="src/app.js"&gt;&lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>