Overview

Najmis Calculator is a web-based application designed to hone foundational front-end development skills. The main focus of this project is the implementation of DOM Manipulation and mathematical logic using pure JavaScript. Besides calculation functions, the app is equipped with aesthetic enhancements and extra utilities like a real-time clock and smooth dark mode transitions.

• Complete Mathematical Operations: Supports basic arithmetic functions (addition, subtraction, multiplication, division) with accurate logic.
• Real-Time Clock & Date: Integrates the Date() object to display the time (24-hour format) and date in the id-ID (Indonesian) locale, automatically updated every second.
• Dark Mode: A dynamic toggle feature to switch between light and dark themes using smooth CSS transitions for user eye comfort.
• Custom Error Handling: Implementation of try...catch blocks to handle invalid mathematical inputs. Instead of a standard message, the app displays a unique and personalized error message: "YANG BENER NYED!" (Are you kidding me!).
• Responsive Design: Uses CSS Grid and Flexbox to ensure the button layout remains precise and easy to use across various screen sizes (mobile & desktop).

Technologies Used

• HTML5: To build the semantic structure of the application.
• CSS3: For visual design, grid layouts, and theme transition animations.
• JavaScript (ES6+): The main application logic, including the use of eval() for calculations, setInterval for the clock, and class manipulation for the Dark Mode feature.

Challenges and Learnings

This project served as a highly effective learning tool in understanding simple asynchronous operations (via second-by-second time updates) and handling user inputs. The biggest challenge was ensuring that complex mathematical expressions did not break the application flow, which was successfully resolved with a responsive error handling system. I also learned how to inject a personal touch (humor) into the technical aspects of a digital product.

Outcome

The result is a functional calculation tool that is also visually appealing. This project demonstrates my strong grasp of JavaScript fundamentals before moving on to more complex frameworks. This calculator is now part of my personal digital tool collection, ready for further development.