Front-end Code Refactor, Bug Fix & Optimize

I'm seeking a skilled front-end developer to thoroughly review my website, identify and fix bugs, and optimise performance. The site is built using HTML, CSS, and JavaScript. Key tasks include: - Debugging: Identify and resolve any existing bugs on the site. - Code Update: Refactor the code to eliminate redundancies and improve overall code quality. - Performance Optimization: Make necessary enhancements to boost site performance. Skills & Experience Required: - Proficiency in HTML, CSS, and JavaScript. - Extensive experience in front-end web development. - Strong debugging and problem-solving skills. - Ability to refactor code for improved quality and performance. Here is a list of functionality that the website already does, the existing functionality just needs to be optimised, the bugs removed. Attached is a screenshot of how it looks currently today. for mobile and web Income Summary - [ ] Yr. Income - will calculate how much the user will earn in a 12 month calendar period. The method of calculation will be variable based on what pay frequency they have chosen. - [ ] Yr. Bills - Will just be another place to represent the total yearly amount that is represented in the bills list. - [ ] Yr. Savings - will add up all the leftover amounts within a 12 month period and display that. This will also include any one off incomes that the user adds. Pay cycle - [ ] Adding income will filter the home page based on the pay cycle frequency they had chosen - [ ] The website will also have a monthly view that will show the bills based on their calendar month. - [ ] The pay cycle will show by default 12 pay cycles down the page irrespective of what frequency they select - [ ] Main part of a pay cycle will have the date at the top which will show the dates that they pay cycle is representing from. X date to y date. - [ ] It will have Income, Estimated Bills to pay, and Leftover - [ ] Income - Is determined by whatever income the user has added - [ ] Income will increase within the pay cycle if the user also has a one off income amount in that pay cycle - [ ] Estimated bills to pay - will tally all the bills within that pay cycle and represent them as a negative red number - [ ] Leftover - will subtract the estimated bills to pay from the income and will show a number, the number will be green if its positive or red if its negative - [ ] Bills list - Like the main bill list, this will be a collapsed list that will show the bills that are due within that pay cycle in a list. - [ ] Bills list - will have name of the bill, date that it is due and the amount that is due. - [ ] The total of all the bills in the bills list should equate the Estimated bills to pay. - [ ] All the functionality here for the pay cycle will be the same for each of the 12 pay cycles that are represented. 
Monthly View - [ ] Will function exactly the same as pay cycle, however it will be based on the calendar month. - [ ] If the user is paid weekly for example and they get paid 5 times in a month, then the income amount will represent 5 incomes for that month. - [ ] Whatever bills fall in each calendar month will also be represented in the bills list that is attached to each monthly cycle. - [ ] The date that represents on top of each cycle, will just be the month name and the year. November 2024. For example. Pay Cycle/ Monthly Graph - [ ] Graph will be dynamic so the bars in the graph will always stay the same size no matter the size of the users screen, if the screen is too small for the full size of the graph it will be scrollable - [ ] The graph will measure two things, total bills and leftover amount - [ ] It will show in black the leftover amount Adding Bills - [ ] Add a bill - [ ] Opens correct add bill modal - [ ] Add bill name - [ ] Enter number only amount - [ ] Bills are able to have a frequency (Daily, Weekly, fortnightly, Monthly, Quarterly, Yearly and one off) - [ ] If a one off bill is made it will show up once. And once it has passed it will drop off - [ ] Bills can have a due date - [ ] Bill can be tagged - [ ] Bills that don’t have a tag will be added a “Default Tag”. No bill should not have a tag - [ ] User can select from a drop down an existing tag that was already created. - [ ] Users can type in a new tag - [ ] After adding a bill it navigates them back to the home page - [ ] Adding bill will add the bill to the corresponding pay cycle and also the corresponding month in monthly view - [ ] Bills will be added to a primary list, called Bill list. - [ ] Clicking outside the add a bill modal will close the modal Bill list - [ ] The bill list will be the master list of all the bills that have been added - [ ] Once a bill past in time, the date will change to the next time that bill is due. - [ ] One off bills and one off income will only show once, once the date has past, it will disappear from the bill list - [ ] Bill list will have 7 headings (Name of bill, Amount, Frequency, Due Date, Tag, Yearly total, Actions (Edit, Delete) - [ ] Each heading will be clickable and will allow the user to filter the list by that - [ ] At the bottom of the bill list there will be a yearly total that will tally all the yearly amounts - [ ] Negative numbers will represent as red, they will also have a negative symbol. - [ ] Positive numbers will represent as green - [ ] Editing a bill will update all bills data throughout the website. This includes the pay cycle view and the monthly view. - [ ] Since all bills that are represented in the bill list should only be displaying the next bill due, and it doesn’t show past bills, when a user selects edit, all data in the modal should be based on the next time that bill is due. (In reality this will just be the data that will look different between bills) - [ ] There will be a drop down that will allow a user to filter bills by their tag, this will then filter all content on the website and only show the bills that are being filtered. By default all tags will be selected. It will be multi select. Income - [ ] Select income frequency - [ ] Add income - [ ] Adding income will navigate them to the home page Primary Functions - [ ] Default state when a user first opens the website will be the add income modal. - [ ] Reset Data - will reset everything on the website back to its default state - [ ] Export data - will save everything that is stored in local storage to a file that can be re imported - [ ] Import data - will use the exported data function to import every bit of data back into the website. - [ ] Manage tags - This will be the home for tags that are added by the user, when selected it will open a modal that will have a drop down for the user to select the tag that they want to edit or delete. Selecting the tag will populate the tag name in a field below the drop down, and will allow them to edit the tag. Deleting a tag will remove it from everywhere in the website and will replace the tag if it was attached to a bill with a default tag. - [ ] Edit income - Once a user has added their income that would be the last time they see the add income modal. Edit income will be a seperate modal that will have all the same fields as when they first added their income, however the primary CTA will be “save”. There will also be a secondary button that says “go back”. Going back will just navigate the user back to the home page. Import data - [ ] If a user imports data that is from months before the present data, the website needs to recognise the current date and start displaying the pay cycles and month to month based on whatever cycle they would have been up to. For example if the data was created in September, and the user was importing it to their phone for example in November, all data in monthly view should show November and all respective bills for that month. It will then show the 12 sequential months from November onwards. It will also need to adjust all the bills in the bill list so that they are representing the bills that are coming up. So in this example because the user is importing lets say in the middle of November, and this user has bills that come out every day of the month, they will only see the bills for the next month ahead, as each bill will only be shown once in the bill list, so if the 12th of November bill has already passed in the bill list it will show 12th of December.