IP Tracker - HTML/CSS/JS

Community feedback

• 

  Joran Minjon•610

  @DrKlonk

  Posted about 4 years ago

  Usually the way for me to hide an api key would be as an environment variable. You can get those in a Node server by installing the package dotenv, adding a .env file and accessing it in the server by using process.env.VARIABLE_NAME. More on it here.

  Do not include it in git though, if you really want it hidden.

  Btw, I didn't do this challenge yet and have never used Netlify, so I don't know if your way is even better.

  11
• 

  Bonrey•1,130

  @Bonrey

  Posted about 4 years ago

  Hello, Enayar! Great work on this challenge! 🥳 Everything works well on my laptop, although I have an adblocker turned on.

  Probably, just one little suggestion: I'd fix your html accessibility errors by adding aria-label attribute to your input field. It's a nice workaround when you don't have a label attached to the input field.

  As for the font size, I'd indeed dynamically adjust it depending on the screen width. It can be done in JavaScript like so:

  function updateFontSize() {
    let infoTexts = [dataElements.location, dataElements.isp];
    for (let i = 0; i < 2; i++) {
      if (infoTexts[i].innerText.length > 36 && window.outerWidth <= 1200) {
        infoTexts[i].style.fontSize = "0.8rem";
        infoTexts[i].style.lineHeight = "1rem";
      } else if (infoTexts[i].innerText.length > 36) {
        infoTexts[i].style.fontSize = "1.1rem";
      }
    }
  }
  

  (In fact, that's the exact snippet from my code. I recently completed this challenge myself. 😅)

  Have a nice day too! And good luck with your coding! 😉

  12