@tarik310Submitted almost 3 years ago
This is my first Javascript challenge, so PLEASE give me feedbacks to enhance my skills
Thomas Kressman
@tkressmaAll comments
- @tkressmaPosted almost 3 years ago
Hey there! Great solution - it works as it should. The web app is very responsive as well!
I have one general tip for you. In JavaScript, there is a concept called Event delegation.
Consider your code: on lines 52,56, 94-98 and 183-187, you create many separate event listeners to perform the same event upon being clicked: ActivatingReset(), erasevalueoncustom(), makeCalculations().
Using Event delegation, you can apply a single event listener to the parent container (class="percent") and have whatever child you click on "bubble" up towards the event listener. This will allow your code to follow the D.R.Y. principle.
For example, you can replace all of those repetitive lines of code with this:
document.querySelector(".percent") .addEventListener('click', event => { if (event.target.className === 'percentBtn') { //Assign inputs a class of "percentBtn" makecalculations(); } });
You can read more here: https://dmitripavlutin.com/javascript-event-delegation/, but certaintly watch some YouTube videos on this powerful concept. Happy coding!
0 - @jesseburnSubmitted almost 3 years ago
Hi everyone! Could I please get some help with my local storage? I know I need to work on the responsive version of my output URL but I'm confused me as is to why my local storage does not work correctly.
@tkressmaPosted almost 3 years agoHey Jesse, good job.
I HIGHLY recommend you put your script in a seperate file (E.G. script.js) then import it at the end of your body - or, at the very beginning of the body tag using defer.
Similar to what Haybuka said, you first need to "fill" your localStorage with an item before trying to access it. You would want to do this upon successfully fetching some data from the API. You can do this by writing localStorage.setItem('<some name resembling the url data>', <the object recieved from the api call>). Then, when you want to retrieve the localStorage data, you would write localStorage.getItem('<name you decided on calling the item'>).
Check out more about localStorage on the docs: https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage
0
