01
Loan Calcuator
Objective
My first DOM project was a loan calculator that utilized the getelementID method to retrieve the loan-form ID while also adding an addeventlistner method to listen for the submit request. This hides the results and displays a loading screen as calculations are completed.
I developed a calculateResults method by combining a getElementById method for each element. I then used the parsefloat function that accepts a string and converts it into a floating point number. To declare a principle variable that is the total loan amount. Total calculated interest and finally payments. I have created an if declaration that verifies if the number is an infinite number. If this is the case, the argument is converted to a number.
This is how the total monthly payment is calculated, the full payment ,and the full interest. I used the tofixed method to translate the number into a string. I used the getElementById method to display the result and hide the loader presenting the definitive figures on the user interface.An error function has been added to the software that will notify the user if there are any invalid fields entered.
02
Task List
Objective
The next project was to create a simple task list that helps me establish reminders about the tasks to be performed. The first step I took was to define my UI variables by selecting both ID and class names using the querySelector method. I have created a loadEventListener method which will give my task list functionality when adding a task for adding, deleting and filtering tasks. I used DOMContentLoaded event for accessing local storage space. To ensure that the code runs immediately after the page loads.
I created additional methods that will allow me to access tasks from the local storage. To enable the user to create a new task. I made use of JSON for my store task method. This allows each task to be stored locally until the user decides to delete. This task is intended to reflect this intention. Each task is removed individually, while the clear task removes the entire list. The filter method is a useful tool for users with a large list who want to quickly locate specific tasks.
03
Book List
Objective
The next project was called number guesser, and the objective was for the user to guess a number between 1 and 10. The user has only 3 attempts, but if they guess correctly, they will receive a notification advising them of their success. If they do not win, the response will be revealed allowing the user to retry if desired. Unfortunately, I was unable to make it work as expected, and I intend to do it again.
Book list is the final project. Books can be added by users through this feature. I used object orientated programming using the ES6 syntax. Java was the first language I explored from where I became familiar with OOP. I am interested in exploring the contrast between functional and OOP. Overall, I believe that the decision is largely determined by the project's requirements. There was no significant difference in my project, except for my familiarity with the OOP concept. I used the constructor to initialize the Book and UI properties. I developed methods to assist users in adding books to the list Every book needs a title, a writer and an isbn number. The second method will clear the fields. The Show alert method was developed to notify the user whether a book has been successfully added or removed from local storage.