how to hide js value from inspection on web

i am passing a secret code to the front end, from my backend. I want to store the value in my JS script, like so:

 <script>
        var code = '<%= code %>'
    </script>

then when the user types in the code, i want to run a check to make sure it matches with the code i passed through. I’m doing this so it eliminates the struggle of going to the backend and refreshing again.

However, when i right click, and inspect element, i can actually see the code in my web browser, which is a problem. Is there a better way to do this, or a way to hide it?

Answer

The browser works for the user not the site author.

You cannot give something to the browser and expect it to keep it a secret from the user.

Do the check server-side. Live with the extra HTTP request.