0

Currently, I am developing an application using Nextjs 13.4 where the user can create meals and see them in a calendar and list form. If today's date matches the date of the meal, then the meal will be displayed.

I've been having some issues with new Date() because after 5pm Pacific Time, the new Date() will be equal to tomorrow's date. Most likely this is isn't the best way to make sure to get the correct date no matter what time it is, but this is currently working in development:

const todayDate = new Date(new Date().toLocalDateString()) // new Date('yyyy-mm-ddT07:00:00.000Z')

However, when I deployed the application on vercel, it is giving me the incorrect date after 5pm Pacific Time. I have also created a simple website displaying the issue. The website shows a server component and a client component. From this, I can see that the server component is always showing the incorrect date, while the client component is only showing the incorrect date when using new Date().toISOString().

I would like to know what would be the best approach to get the correct date. I assume one approach is to change the component to client, but I would like to keep it as server component. Also, please feel free to correct my method of getting today's date.

here is the link to the simple website.

Thank you

AndF
  • 23
  • 4
  • 1
    What is the point of `new Date(new Date().toLocalDateString())`?? Why not just `new Date()`, which will give you a new Date instance? Date values are *always* based on an absolute timestamp value; the locale only matters when you render a Date instance as a string for display. – Pointy Aug 30 '23 at 02:08
  • Timezones! Server time is in UTC. Your browser time is in your local timezone. – Ben Taber Aug 30 '23 at 02:09
  • (Well or use the getters for the various date/time "parts".) – Pointy Aug 30 '23 at 02:09
  • Does this answer your question? [Determine a user's timezone](https://stackoverflow.com/questions/13/determine-a-users-timezone) – jsejcksn Aug 30 '23 at 02:15
  • The problem with new Date() is that at 5pm Pacific time it gives me the date of tomorrow. So if I look at the app today, 08/29, after 5pm it will say that today's date is tomorrow's date, 08/30. About the timezones, in the link, it does work if the component is being rendered at the client side, but server component is showing me tomorrow date. I think the getters will also do the same. Again, I can just change it to a client component, but I would like to see if I can fix it in the server component. I'll check the link you shared. Thanks – AndF Aug 30 '23 at 02:40
  • About `new Date(new Date().toLocalDateString())`. If I were to use `new Date()` or `new Date().toISOString()` and display it after 5pm Pacific Time, It will also show me tomorrow's date, even in the client component. the method that I am using is giving the correct date, no matter the time of day. – AndF Aug 30 '23 at 02:43
  • what is this `toLocalDateString` method? – Jaromanda X Aug 30 '23 at 03:05
  • @JaromandaX I think they meant `toLocaleDateString`. I'm pretty sure it's a typo. Please note `Local` vs `Locale` with an **e**. – Wyck Aug 30 '23 at 03:07
  • but they state in the comment `new Date('yyyy-mm-ddT07:00:00.000Z')` ... which implies that `toLocalDateString` returns `yyyy-mm-ddT07:00:00.000Z` which it does not – Jaromanda X Aug 30 '23 at 03:11

0 Answers0