What are you most proud of? I'm most proud of completing the entire project and seeing my solution work smoothly. This project gave me a deeper understanding of building functional and interactive web pages. Specifically, I’m proud of implementing the calculations accurately and designing a clean, user-friendly interface. It was a great opportunity to apply my HTML, CSS, and JavaScript skills, especially integrating them for a seamless experience.
What would you do differently next time? Next time, I would focus more on the structure and organization of my code, particularly using more semantic HTML tags to enhance accessibility and SEO. I also realize there are some areas in the JavaScript logic where I could optimize the code for better readability and performance. I’d also like to implement additional features, such as customizing tip percentages or adding validation to improve user experience. Finally, I’d pay more attention to responsive design to ensure a consistent experience across all devices.
What challenges did you encounter, and how did you overcome them?One of the main challenges I encountered was managing state updates in JavaScript, especially when calculating the tip and total amounts dynamically based on user input. Initially, the calculations didn’t always update correctly when switching between custom tip percentages, which led to inconsistent results. I overcame this by carefully reviewing the logic and ensuring that all the necessary inputs were being captured and recalculated on every change. Breaking down the problem and using console.log() to debug step by step helped me identify where the code wasn’t behaving as expected.
Another challenge was making the layout responsive. It took some trial and error to make sure that the app looked good on different screen sizes. I overcame this by refining my CSS, using relative units like percentages and rem for better flexibility, and leveraging media queries to adjust the layout for smaller devices.
What specific areas of your project would you like help with?JavaScript Optimization: While the current functionality works, I feel like there might be ways to streamline the JavaScript code, particularly how state is managed and how inputs are handled. I'd love feedback on how I can make the code more efficient or readable, especially for larger projects.
Responsive Design: I’m still learning how to ensure consistent design across all devices. While the app is functional on different screen sizes, I’d appreciate suggestions on improving the responsiveness, especially in terms of layout adjustments and ensuring the UI scales nicely on smaller screens.
Accessibility Enhancements: I’ve started learning about making web apps more accessible, but I’m not entirely confident that my current solution meets accessibility best practices. Any advice on how to improve this (e.g., using ARIA attributes, semantic HTML, etc.) would be really helpful.