Added a green tick button which you can click after finishing a task and the text turns cut off after clicking on the green button it took some time but it looks neat and worth it
Hello, a very basic devlog:
I added a ‘Do you want to delete’ Confirmation message alongside changed the entire preview and UI of the website so it looks neat and awesome
Session Overview
The primary goal of this sprint was to implement end-to-end integration testing for the checkout lifecycle and clean up crashing behaviors across existing modules, including the cart and currency formatting utilities. Multiple silent issues relating to environment setups, structural naming conventions, parameter passing, spy lifecycle management, and directory relative routing were identified and resolved. Problems Tracked & Fixed
The testing runner dashboard initially displayed a grey status bar reporting zero specs found. This occurred because Jasmine in the browser runs entirely through explicit scripts, and the newly added test suites were living in isolation without being linked via script modules to the central test DOM harness. This was resolved by synchronizing the tests HTML file explicitly with the current directory tree using modular script references for the money, cart, and order summary tests.Execution of the cart addition tests also resulted in failures returning unexpected NaN values. The root cause was that the underlying application logic signature reads two parameters, but the test suites were passing only a singular product identification string parameter. Lacking the second parameter caused the quantity argument to fall back to undefined, evaluating to NaN during quantity compounding arithmetic. The unit tests were refined to mock and pass explicit numbers as the second operational argument.The test execution crashed further on a runtime evaluation due to a type error stating that properties of null could not be set. This stemmed from dual semantic bugs in the DOM selectors, specifically a missing class identifier literal dot during test setup, and a leading whitespace syntax combined with an invalid selector dot inside raw HTML class assignments. The code was resolved by restructuring string interpolations to leverage native selector patterns cleanly.Mismatched pointer evaluations between local mock expectations and object definitions previously caused failures. This was driven by a divergence in the key casing strategy between lowercase and uppercase definitions. The codebase was validated to strictly adhere to Pascal-case Quantity properties within all internal data dictionaries to safeguard consistency across both mocking and output testing assertions.The testing suite encountered a cross-suite spy failure where the framework reported that the localStorage setItem method had already been spied upon. This state pollution occurred because spies were persisting across different test specs without being cleared, causing subsequent initialization hooks to collide. This was resolved by implementing an afterEach cleanup mechanism that resets the calls on the localStorage spies, alongside a teardown function that unmounts and wipes the sandbox HTML test container.System Health: Current State
All nine specifications have successfully registered and passed across the test framework. State leakage between consecutive component renders has been mitigated by appending container-teardown functions and resetting global mocks. The test suite now stands at nine total specs, zero failures, covering the formatCurrency, add to cart, and renderOrderSummary suites. No further immediate testing actions are required for these modules.
We completely overhauled the checkout system’s date calculation and architecture by shifting away from fragile, hardcoded date jumps and manual DOM targeting. To meet the business rules for delivery options, we implemented an isWeekend utility and a day-by-day while loop that dynamically skips Saturdays and Sundays, ensuring shipping timelines stay perfectly accurate relative to weekends. Throughout the build, we ran into and fixed several tricky JavaScript edge cases, like catching case-sensitivity crashes where cartItem.Quantity broke data binding, declaring implicit globals to prevent local variables from leaking between layout generation loops, and adding safe fallback defaults for unassigned delivery option IDs. By stripping out tightly coupled element selectors from our quantity updates and converting the logic to a clean, true MVC structure where data mutations trigger a complete structural re-render (renderOrderSummary() and renderPaymentSummary()), the application now maintains flawless UI synchronization and data syncing completely on the fly.
Devlog UpdateI upgraded my functional payment summary module to feature dynamic data rendering and accurate cost calculations, which allows users to view real-time totals, shipping costs, and estimated taxes based on their actual cart contents. As a beginner learning JavaScript, the most challenging part of development was troubleshooting silent data bugs caused by strict case-sensitivity in object properties, such as accidentally referencing cartItem.Quantity instead of cartItem.quantity, which broke the math operations with NaN values. I also had to figure out how to transition away from hardcoded HTML mockups to dynamic calculations so that the total item count dynamically updates rather than sticking stubbornly to a fixed number. However, now the application seamlessly aggregates multi-item totals, cleanly tracks individual shipping selections, and correctly formats currency breakdowns before rendering the final checkout layout, so I hope you all check out the updated implementation and let me know if there are any other edge cases I should handle!
I upgraded my functional To-Do List web application to feature a dynamic, multi-list architecture that allows users to create custom categories and manage isolated task sets simultaneously. As a beginner learning JavaScript, the most challenging part of development was mastering nested state management (listTitles[activeListIndex].todolist), handling event bubbling using event.stopPropagation() so deleting a list didn’t accidentally activate it, and troubleshooting asynchronous rendering bugs where event listeners were trying to bind before the HTML was injected. However, now the application seamlessly syncs separate lists to local storage, handles input-specific Enter key listeners for both tasks and lists gracefully, and maintains clean visual state transitions, so I hope you all give it a try at least once and maybe suggest some improvements!
Changed UI completely, added a create button, input element to enter name and save button for confirmation.
Key features:
Input box and save disappear and only appear when create is clicked and disappear after saving (does not recognize null value) For now it saves it in an array which I have stored in local storage, in the future will add a remove button to remove the contents of the array and ill add the array names to the list sequentially.
Devlog - 2
This took a while:
Apart from all the changes from the tutorial heres what I did independently following the exercises:
Devlog-1
Hello, Im working on a amazon project through a tutorial by SuperSimpleDev so apart from the tutorial heres what I did following the optional exercises:
Hey there,
I added some amazing changes
Things I learnt here:
Mainly I implemented addevenListener in js instead of using onclick in HTML, and I also had a huge logic for the pop-up thingy which is not as easy as it looks but it worked fine and I’m really proud :D
A functionality was added where you can press keys instead of clicking the buttons manually, i changed this by removing onclick attribute on HTML and implementing document.body.eventListener, it really helped and its something new is learnt
I built a sleek, dark-themed calculator web application featuring a modern minimalist button grid and real-time computation logic after practicing more of my JavaScript fundamentals. Currently, the most challenging part was managing the calculation state, updating the UI display dynamically with each button click, and ensuring operators stringed together correctly in the background, especially since I’m still quite new to web development. However, now it looks really sharp with its smooth rounded buttons and vibrant orange accent colors, and even if it’s a straightforward project, I hope you guys do give it a good spin at least once and maybe suggest some improvements!
I created a functional To-Do List web application featuring a clean, grid-aligned layout to manage daily tasks, track deadlines, and handle dynamic input. As a beginner learning JavaScript, the most challenging part of development was mastering array modifications, understanding how data passes by reference versus by value, and ensuring data state accumulated correctly outside of loops without wiping previous iterations. However, now the layout automatically re-sequences serial numbers perfectly when tasks are added or deleted, handles missing dates gracefully, and looks really sharp with its dark green styling, so I hope you all give it a try at least once and maybe suggest some improvements!
I built a dark mode Rock Paper Scissors game from scratch to learn dynamic DOM manipulation, state logic, and browser storage. The single biggest obstacle was deploying to GitHub, where my image assets completely broke on live servers. It turned out to be a case-sensitivity issue—GitHub’s Linux-based servers rejected my lowercase image paths because my JavaScript was passing capitalized strings. I’m really proud of debugging this and fixing it programmatically using the .toLowerCase() method, which successfully synced my script with the directory assets. The code is clean, fully responsive, and keeps your score saved via localStorage even after a page refresh!
Devlog 4-
Finished the designs for every single page, made research connect to my research paper and added cool visual effects in my social media page
Also, media queries took me a lot of time which makes it look extremely clean on smaller devices
Devlog3-
I added a navigation bar for all pages which looks really neat and it took me a lot of time to add media queries to make the website have a good UI in mobile phones or tablets. This taught me a lot and I’m starting to realize AI cannot replace humans after all. I feel its the same as mathematics, we have AI to do the math for us but we dont rely on it blindly. Moreover, I made individual pages for the websites with the same template idea and I also finished up on the experience page.
This is my first project and I am so excited to share the end result which I will post in Devlog4.