feat: sample article (#54)

* chore: cleaning old posts * chore: adding scrap folder to gitignore * feat: article --------- Co-authored-by: Andrey <[email protected]>
codenomnom · Oct 12, 2024 · d180a86 · d180a86
1 parent 5d47ffa
commit d180a86
Show file tree

Hide file tree

Showing 11 changed files with 56 additions and 129 deletions.
diff --git a/.gitignore b/.gitignore
@@ -22,3 +22,5 @@ pnpm-debug.log*
 
 # jetbrains setting folder
 .idea/
+
+scrap/
diff --git a/src/content/quirks/01-image-bottom-margin.md b/src/content/quirks/01-image-bottom-margin.md
@@ -1,8 +1,7 @@
 ---
 title: Image <code>bottom</code> margin
-# slug: image-bottom-margin
 date: 2023-09-18
-tags: [html, js]
+tags: [html]
 ---
 
 Okay, this one got me good. It's one of the things I'm constantly amazed by, primarily because I often use libraries and CSS normalize/reset.

diff --git a/src/content/quirks/02-collapsing-margins.md b/src/content/quirks/02-collapsing-margins.md
diff --git a/src/content/quirks/03-lobotomized-owl-selector.md b/src/content/quirks/03-lobotomized-owl-selector.md
diff --git a/src/content/quirks/03-timezoned-unix-timestamps.md b/src/content/quirks/03-timezoned-unix-timestamps.md
@@ -0,0 +1,53 @@
+---
+title: Timezoned unix timestamps
+date: 2024-10-11
+tags: [js, date]
+---
+
+```ts
+// TL;DR
+const time = Math.floor(now.getTime() / 1000) + now.getTimezoneOffset() * 60;
+```
+
+---
+
+A JavaScript's [Date](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date) love/hate letter.
+
+**Use case**: I received a date from an external source (backend) in a UNIX timestamp format
+(number of seconds since January 1st, 1970, shortly named `UTC`).
+I wanted to know if that timestamp is in the future or in the past
+(so that I could validate a [JWT](https://jwt.io) token).
+
+But the server's time was in different timezone than mine. Which caused issues even though
+I was using [epoch](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date#the_epoch_timestamps_and_invalid_date) time:
+
+```ts
+const date: number = payload.date; // server's date
+console.log(date); // 172863765
+console.log(Date.now()); // 1728648454925
+```
+
+---
+
+Long story short - regardless of what you do with your current date, you will still get UTC time **including**
+your timezone difference. Making both timestamps work withouth a timezone (GMT) required some manipulation:
+
+```ts
+const now = new Date();
+
+// time elapsed since January 1st, 1970 in MILLISECONDS
+const localTimeSinceEpoch = now.getTime(); // 1728648454925
+
+// timezone difference IN MINUTES 🤯
+const timezoneOffset = now.getTimezoneOffset(); // -180
+
+// let's talk the same language - SECONDS
+const timezonedTimestamp = Math.floor(localTimeSinceEpoch / 1000);
+const offsetInSeconds = timezoneOffset * 60;
+const timeSinceGMTEpoch = timezonedTimestamp + offsetInSeconds;
+
+// everything's in seconds, let's compare
+if (tokenExpiry < timeSinceGMTEpoch) {
+  // not yet expired!
+}
+```
diff --git a/src/content/quirks/fifthpost.md b/src/content/quirks/fifthpost.md
diff --git a/src/content/quirks/firstpost.md b/src/content/quirks/firstpost.md
diff --git a/src/content/quirks/line-height-causes-margin-collapse.md b/src/content/quirks/line-height-causes-margin-collapse.md
diff --git a/src/content/quirks/secondpost.md b/src/content/quirks/secondpost.md
diff --git a/src/content/quirks/the-sass-ampersand.md b/src/content/quirks/the-sass-ampersand.md
diff --git a/src/content/quirks/thirdpost.md b/src/content/quirks/thirdpost.md
Original file line number	Diff line number	Diff line change
Expand Up		@@ -22,3 +22,5 @@ pnpm-debug.log*

		# jetbrains setting folder
		.idea/

		scrap/