title: require username and password
body: <p><em>Please guide me accordingly if this question is noobish or a kind of duplicate.</em></p>
  
  <p>I am wondering how to implement this kind of authentication?</p>
  
  <p><img src="https://i.stack.imgur.com/bkpu4.png" alt="enter image description here"></p>
  
  <p>I am asking because I'm quite lost and doesn't know which keywords to search for this. On my mind, I am planning to have this whenever a user wants to access my domain (eg. <a href="http://mysite.com" rel="nofollow noreferrer">http://mysite.com</a> and <a href="http://mysite.com/tools" rel="nofollow noreferrer">http://mysite.com/tools</a>).</p>