Hayk, I have been to solve this problem in my code for a few days, I tried ai, tried asking ai questions, try searching in documentation. I also kept asking myself what concepts to put for this feature, tried searching youtube for similar patterns, tried commenting out code one piece at a time when I thought there was an issue, try using the break points and looked at scope and call stack. I still can't find out how to solve the problem. I tried to go to the weather project in the course and figure this out to but that was for async wait, and my project I don't think use async wait. I asked ai do I use async wait for this problem, and it said no. The problem was my city and time values will show even before clicking the show city button, but I needed the setInterval for the city and time values to change and update live on the screen. The problem is when I use set Interval it would show the city and time values even before clicking the show city button, but when I comment it out, the city and time values will show on the screen when I click the show city button, but the city and time values will be static and won't update live. I commented out this piece of code cityIntervalId = setInterval(updateCityTime, 1000); , and then my city and time values, like the city, time(hours,minutes, seconds) showed on the screen when the user click, but the time was static. Hayk, in real world applications, don't you use SetInterval and at the same time the results will only show when clicking the show button or do I need to choose between keeping setInterval and allowing the city time values to show before clicking the button and remove the showCityButton by writing the remove event listener for the show city button to prevent memory leaks and then remove the show city button from the html file or can this be fixed where I can have setInterval update the city and time and only show when users click the show city button? Hayk, another thing is, Even though I went through the JavaScript tutorial of how to use breakpoints, I don't know what values is unexpected, like how do you know when that value is unexpected? Hayk, can you review my code, but also make a video of how to use the breakpoints, local scope, and call stack for this problem to just to see how I can debug this? I was trying to get more practice on the debugging using this debugging strategy and I am just trying to get better at coding and web development.

Hope you guys are having a great weekend! Just wanted to give you a quick heads up that I'll be flying around Europe Dec 2-4. Nothing changes for the group calls, we'll have the 2 calls next week. For next week's 1/1 syncs, hit me up either tomorrow (Monday) or end of the week. During my flights I'll be slower to respond. PS. Let me know if you're around any of these cities in December, I'm down to meet up: Bari, Milan, St Moritz, Zurich, Paris

I was coding and practicing a project and I learned some new things as I was coding. It was very fascinating, I am working on a digital clock project in JavaScript, and I learned there was two ways to write the JavaScript logic. You can write the JavaScript logic for the toggle either with your custom logic ai give you or you know how to write or the second way is to use the built in strategy like with the toggle and connecting it to the time on the main clock section, you can also use the Intl.DateTimeFormat. I also learned that with intl.DateTimeFormat api, there is two ways to write it. One of the ways was using a fixed string , but your time will be static and not update,and the other was using new Date() which will change your time live on screen, but the newDate(); doesn't format two different times for the 12 hour and 24 hour format until it turns 1 pm. I chose to go with the Intl.DateTime and newDate(); method. I also learned when I first started with this digital clock I had to start over and over because I kept running into this same bug where the city and time values would display before you click the show city button. I tried a lot of methods to debug, I tried commenting out, using breakpoints,looking at local scope, and looking at the call stack, I tried more debugging strategies. I also tried ai over and over and looking in documentation. I tried asking ai to create a mini project around the problem, and that helped at first. Then I asked ai how it would code my version of the project, and it showed me the code for html, css,JavaScript, and I commented out or removed my other code tested ai version of this digital clock, and found the reason for this bug was because I didn't include the city.display = 'none' or hide, but I didn't include the city.display to none or hide or block, it was one of those three for this issue, and the second issue for this was I needed to set an interval, and both of them needed to be in the citySelect where the cities were in the drop down because you don't want the city and time to show on screen before users select the city and press the show city button.

In the video below, I address the common issue most guys face in the program: not having enough time to dedicate to their learning and career advancement. Watch the announcement below to see what we will cover in our emergency room sessions. 👉 Here's a more detailed explanation of why I decided to add these calls and how we can save you time so you can dedicate it to learning and advancing in your career. I recommend everyone to join the first session and ask questions. If you find this valuable, we will make the event recurring every week.

These few days of learning React and React 19, I learned state management, styling options in React, tanstack query, react router: The purpose of state management is when multiple components need to share data, when you notice there may be prop drilling or you need to pass props down to other components(even if all of the components don't use the prop), and also Styling options is like the styles to style each component, your app, and website. This is just like CSS except this is for React and there are multiple options to style in React and React 19. The traditional CSS and module css is different because in traditional css, you have to give each thing with the same class different name, like if you have the button class, you have to name one of them button 1 , button 2, or just differentiate the name if there are things that are the same thing, but in modules css, you can have the same components and name it a name and it won't affect the other components that are the same thing. (I hope I am explaining this the right way.) The purpose of Tanstack Query is to fetch data, cache and store data. Tanstack query works with asynchronous data. (Asynchronous data means the data don't show up or come immediately in the app or browser, it takes time.) Tanstack Query is used when your app or website talk to servers a lot and you want the website or app to feel fast and be fast and smooth for the user while the tanstack is talking to the server. You also use tasnstack query when there is certain data that needs to be constantly updated on the screen or just updated. You don't use Tanstack query when your website or app isn't talking to servers a lot or certain data don't need to be updated constantly. The purpose of React Router is when you have a website that has multiple pages and the user can go to different pages. There is a homepage, about us page, contact us page, testimonials page, or any page. I also learned even though I am not done with the React guide in the Senior Dev Accelerator and the React Course on Udemy is that to create a website in React, it is divided up into two categories. The two categories are for pages that is gone show on every page the visitor go to like the navigation bar, the footer, the header, and these go in the layout in the app.js.