DEV Community: Luciano Menezes

Your Clock Can Go Backward—Use the Right One for Durations

Luciano Menezes — Tue, 21 Jul 2026 12:39:14 +0000

A request starts at 10:00:00.900 and finishes 200 ms later.

Your latency log says -800 ms.

That sounds impossible until the machine corrects its clock between the two reads. Then ordinary code turns an adjustable wall clock into a broken stopwatch.

The subtraction that works—until it does not

This is probably hiding in one of your metrics helpers:

async function timed(operation) {
  const startedAt = Date.now();
  const result = await operation();

  return {
    result,
    durationMs: Date.now() - startedAt,
  };
}

Most of the time, this reports a sensible number. That is what makes it dangerous.

Date.now() answers a calendar question: how many milliseconds have passed since the Unix epoch according to this machine? The answer must remain comparable with logs, users, and other computers, so synchronization software is allowed to correct it. A correction can change its rate, jump it forward, or move it backward.

If either correction lands between the two calls, the subtraction measures the clock adjustment as if it were work.

A timestamp is a coordinate. A duration is a distance. They need different instruments.

Your computer already has two kinds of clock

Operating systems expose several clocks, but two mental buckets cover most application code:

Question	Clock	JavaScript example
“When did this happen?”	Wall clock	`Date.now()`, `new Date()`
“How long did this take?”	Monotonic clock	`performance.now()`

A wall clock follows civil time. It has an epoch and can be serialized as an ISO timestamp. A monotonic clock starts at an arbitrary origin and promises that later readings will not be lower than earlier readings.

wall:       1000 ── 1001 ── 0998 ── 0999   clock correction
monotonic:    40 ───── 41 ───── 42 ───── 43

On Linux, CLOCK_REALTIME is settable wall time. CLOCK_MONOTONIC cannot be set and does not make discontinuous jumps backward, although gradual frequency adjustment can affect its rate. Linux even has CLOCK_BOOTTIME for a monotonic counter that includes suspended time.

Three properties are easy to confuse:

Resolution: how small a change the clock can represent.
Accuracy: how close it is to an external reference.
Monotonicity: whether readings can go backward.

A microsecond-resolution wall clock can still jump. A coarse monotonic clock can still be the correct stopwatch. MDN says browsers may expose Performance API timestamps at 5 µs in isolated contexts or coarsen them to 100 µs for privacy. Both modes remain monotonic.

A negative duration once broke DNS

At midnight UTC on January 1, 2017, a leap second exposed this exact assumption inside Cloudflare’s RRDNS service.

RRDNS measured upstream DNS resolver performance. During the leap, some elapsed values became negative. Those values entered a weighted-selection calculation and eventually reached Go’s rand.Int63n, which panics when its argument is negative.

The blast radius was small in percentage terms but enormous in context: Cloudflare reported about 0.2% of DNS queries affected at peak, under 1% of HTTP requests, across a small number of machines in 102 data centers. The worst-hit machines were patched within 90 minutes; the worldwide fix finished at 06:45 UTC.

Why did redundant machines fail together? The leap second was a correlated trigger. The same rare assumption existed in many replicas, and the external event arrived everywhere at once.

Go changed its time model after this class of failure. Its current time.Now() value may carry both wall and monotonic readings; subtraction uses the monotonic part when both operands have it. The design proposal estimated roughly 30% of time.Now calls were being used to measure elapsed time.

This was not exotic timekeeping trivia. It was an API footgun with production evidence.

Fix the stopwatch, then fix the deadline

For a duration inside one browser context or Node.js process, use performance.now():

async function timed(operation) {
  const startedAt = performance.now();
  const result = await operation();

  return {
    result,
    durationMs: performance.now() - startedAt,
  };
}

The Performance API uses a stable monotonic clock whose origin is performance.timeOrigin. Node’s implementation returns high-resolution milliseconds from process start. If you need integer nanoseconds in Node, process.hrtime.bigint() serves the same interval-measurement job.

The same rule improves timeouts. Suppose an HTTP handler has 250 ms for authentication, a database query, and an upstream request. Giving each step a fresh 250 ms timeout turns one budget into 750 ms.

Calculate one monotonic deadline and pass the remaining budget down:

async function fetchWithDeadline(url, deadlineMs) {
  const remainingMs = Math.max(0, deadlineMs - performance.now());
  if (remainingMs === 0) throw new Error('request budget exhausted');

  const controller = new AbortController();
  const timer = setTimeout(() => controller.abort(), remainingMs);

  try {
    return await fetch(url, { signal: controller.signal });
  } finally {
    clearTimeout(timer);
  }
}

const deadlineMs = performance.now() + 250;
await authenticate(deadlineMs);
await queryDatabase(deadlineMs);
await fetchWithDeadline('https://inventory.internal', deadlineMs);

A timeout belongs to one operation; a deadline preserves one budget across the whole call tree.

In real code, clamp every remaining budget to zero, stop before starting work with no budget left, and record which stage consumed it. That turns “request timed out” into “database queue used 187 of 250 ms.”

The boundary: never serialize a monotonic reading

A monotonic value is meaningful only relative to its own clock origin. Process A’s 5421.3 and process B’s 5421.3 are not the same instant. A restart creates another origin. Serialization often strips monotonic information deliberately; Go’s time package does exactly that.

Use this decision table:

Need	Use
Request latency, retry delay, local timeout	Monotonic time
Log timestamp, invoice date, calendar event	Wall time
Persisted expiration such as `expires_at`	Authoritative wall time, usually server-side
Ordering events across machines	Sequence, logical clock, or database order—not client wall time
Distributed lease safety	Consensus/authority plus fencing tokens—not clock subtraction alone

Monotonic clocks also differ around suspend. Linux CLOCK_MONOTONIC excludes sleep, while CLOCK_BOOTTIME includes it; Go documents that monotonic elapsed time may exclude suspend on some systems. Ask whether “five minutes” means five minutes of active process time or five minutes experienced by a user.

NTP does not remove these choices. Leap smearing avoids a one-second step by changing clock rate over a window, but smear strategies are not universal. Google’s Go proposal describes a 20-hour smear at 99.9986% speed; Meta describes its own 17-hour smear.

Make time testable and observable

Production telemetry needs both clocks, each doing its own job:

const observedAt = new Date().toISOString();
const startedAt = performance.now();

await handleRequest();

logger.info({
observedAt,
durationMs: performance.now() - startedAt,
});


The wall timestamp lets you correlate services. The monotonic duration keeps the measurement immune to a local clock correction. Monitor host clock offset separately; do not bake it into request latency.

Wrap both clock reads behind injectable functions in business logic. Tests can then step wall time backward, jump it forward, and advance monotonic time independently. That catches expiry and timeout assumptions without changing the developer laptop’s clock.

Avoid the tempting fallback <code>Math.max(0, Date.now() - start)</code>. Cloudflare used a defensive negative check as an emergency mitigation, but clamping merely hides the wrong measurement. Use the right clock and keep guards for impossible values as alarms.

## One rule worth remembering

**Wall time tells you when. Monotonic time tells you how long.**

Use <code>Date</code> for timestamps people and systems exchange. Use <code>performance.now()</code>, <code>process.hrtime.bigint()</code>, or your runtime’s monotonic API for latency, budgets, and local deadlines. Do not send monotonic readings across a process boundary.

Which piece of your codebase still subtracts two wall-clock timestamps—and what would happen if the second one were smaller?

🎥 Why is it almost impossible to create a social media with videos - Daykeeper

Luciano Menezes — Tue, 05 Aug 2025 04:18:11 +0000

Currently, I’m a 16-year-old student, and since January 2024, I’ve been developing DayKeeper on my own — a social network with a different proposal: turning each day into a meaningful memory. Inspired by platforms like Twitter and Instagram, DayKeeper lets users make daily posts with text, images, and videos.

Over time, the idea has gone through many changes. A lot has changed: the project’s vision matured, features were redesigned, and the code… well, most of the code has been rewritten several times. One of the biggest challenges so far? Supporting video uploads in a scalable, secure, and affordable way.

DayKeeper’s Environment

To understand the problem, you first need to understand the project’s environment:

Database: MongoDB
File storage: AWS S3 (images and videos)
Content moderation: Amazon Rekognition
Video verification notifications: Amazon SNS (Simple Notification Service)

Of course, along with many other things, like nodemailer for emails, passport for third-party login, firebase for mobile app notifications, etc.

To understand what happens when a user creates a post, here’s the route:

router.post(
  "/create",
  checkTokenMW,
  multer(multerConfig("both")).array("files", 5),
  handleMulterError,
  createMediaDocsMW,
  detectInappropriateFileMW,
  postValidation,
  createPost
)

Or explained:

checkTokenMW: Makes sure the user is authenticated.
multer(...): Middleware to upload files (images or videos).
handleMulterError: Handles upload errors.
createMediaDocsMW: Creates documents in the "media" collection, separating files from the post.
detectInappropriateFileMW: Uses Rekognition to moderate files. Images are moderated instantly; videos go through asynchronous analysis.
postValidation: Validates post data.
createPost: Creates the post with references to stored files.

The Problem

1. Storage structure

Originally, images could be embedded in the post objects. But videos require asynchronous moderation. So a unified structure was created: all files (images and videos) are now stored in a separate "media" collection with fields like status: 'pending', public, or rejected.

2. Verification time

Images are analyzed in milliseconds, but videos take minutes. The system sends the video to Rekognition, waits for processing, and gets a notification via SNS when it’s done. During this time, the post stays pending.

3. Costs

This is the critical part.

Images:
- Cost: $0.001 per verified image
- 1,000 images/day ≈ $1/day = $30/month
Videos:
- Cost: $0.10 per minute
- 1,000 videos of 5 minutes ≈ $500/month
- Not counting multiple videos per post
S3 Storage:
- $0.023 per GB/month
- PNG 1080x1080 ≈ 500 KB – 5 MB
- 1080p Video (5 Mbps) ≈ 1.5 GB
- $100/month in S3 gives:
- ~4.4 million PNG images
- ~2,400 five-minute videos

Result: Supporting video content is dozens or hundreds of times more expensive than images.

Possible Solutions

1. Having funds ($$$)

The obvious but least accessible solution for solo developers. If you have investors or a big budget, you can afford full video moderation. For me, a 16-year-old student without capital, this isn’t viable.

2. Imposing limits

Strict limits might be necessary:

Max video length: 3 minutes
Size limit (e.g., 700 MB)
Automatic compression for all files
Daily upload limits per user

These reduce video costs and let you store more content in the same space. Of course, this might affect user experience, so it must be implemented carefully.

3. Trust-based moderation system

Currently on DayKeeper, not every file is automatically analyzed by Rekognition.

Trust Factor: New users have low trust and all their files are checked. If they follow rules and aren’t banned, they gain trust and can post without automatic checks.
Report System: Any file can be reported. If reported multiple times, it’s reanalyzed, even if it passed automatically.
Manual moderation: Admins can view reports, ban users, and manually moderate content.

On top of that, random moderation of unchecked files will run in the background to keep the app safe. If a malicious user tries to bypass thumbnail analysis, and the post gets many reports, a full video check is triggered and the user may be auto-banned.

4. Partial video verification

Analyzing every frame is expensive — and often unnecessary. DayKeeper only checks a few:

2 frames at the start
2 in the middle
2 at the end
2 random frames

This equals about 1 frame every 18 seconds for a 3-minute video. If a video is reported, it’s reanalyzed in full. This also varies depending on Trust Factor.

Use Queues with Redis and BullMQ

Creating and verifying thumbnails takes time, and handling thousands of simultaneous requests could overload the server. DayKeeper uses a moderation queue with BullMQ to manage tasks in a scalable and safe way.

5. Video compression

A clear way to cut storage costs is by compressing every file before uploading to the server. This lets you store more videos in less space, with little quality loss — massively reducing storage costs.

DayKeeper’s Solution

DayKeeper combines a trust-based moderation system with admins and reports, partial video verification, task queues, and file compression, all alongside clear limits on daily stories, posts, and uploaded files.

Imposing limits also opens the door for a premium subscription. While it might seem controversial in a social network, I believe it’s more acceptable than selling user data or spamming ads. If done right, it won’t hurt free users too much and can help monetize the app.

Conclusion

Building a video-friendly social network isn’t impossible — but it’s a real challenge, especially for solo developers. Costs, moderation time, and technical complexity are tough hurdles.

In DayKeeper, we’re overcoming them with:

File compression
Partial video checks
Trust and reporting systems
Human moderation

With creative solutions and scalable thinking, even a solo project can reach a professional level. The key is balancing user experience, security, and costs — all while building something you believe in.

If you want to learn more about DayKeeper, you can check the code here or visit our website.

🎆THE BEST PROGRAMMING CHALLENGES USED IN BIG TECHS FOR YOU TO TRAIN IN 2024🎆

Luciano Menezes — Thu, 28 Mar 2024 00:05:13 +0000

⭐- WHAT WILL I SHOW?

In this post, I will show you REAL programming challenges used by VARIOUS BIG TECHS in job interviews!

From simpler challenges to more complex ones, including PicPay, Google, Uber, Amazon, Netflix, and MORE!

Enjoy the post!

✅ 1 - Back-end Challenge by PicPay

This challenge, as the title says, has already been used by PicPay for a Backend position.

Your challenge? Develop a simplified system inspired by PicPay.

The system should allow two types of users, regular users, and merchants, to transfer money between them.

To see the details and solve the challenge, just go to this GitHub repository!

And if you want to see a resolution video, I highly recommend @kipperdev's on YouTube!

I HIGHLY recommend you try it out!

✅ 2 - First Missing Positive by Google

This is a hard-level challenge that has been used by GOOGLE itself.

Here, you'll receive an unordered array of INTs nums and need to return the smallest integer not present in the array.

To do this, you must implement an algorithm that runs in O(n) time and uses O(1) auxiliary space.

Sounds easy? Here's the challenge on LeetCode for you to try!

And if you want to see a resolution video, @phenpessoa's on YouTube is GREAT!

This one's good! I recommend it!

✅ 3 - Backend Challenge by Uber

Here's another challenge for BackEnds, this time from Uber!

Here, you should create a prototype of one of the following projects:

Departure Times
SF Movies
Email Service
Food Trucks

The design is up to you, and you should deploy it as if it were in production!

To see more details, just go to this GitHub repo!

And if you want to see any resolution videos, @kipperdev's is ideal!

✅ 4 - Product of Array Except Self by Amazon

This is a medium-level challenge, but still, it's interview level!

Here, you receive an array nums and need to return an array answer where answer[i] is equal to the product of the elements of nums MINUS num[i].

Additionally, the product of any prefix or suffix of nums must be a 32-bit integer.

If you want to try it yourself, just go to this LeetCode challenge!

And if you want to see a resolution video, Vamos Codar's is quick, practical, and efficient!

✅ 5 - First Unique Character in a String by Netflix

LOOK, this one is EASY level on LeetCode and has been USED IN NETFLIX!

In this challenge, you receive a string s and need to return the index of the first character that does not repeat!

If this character does not exist, just return -1.

Seriously, this is one of the EASIEST, but still, it can be a great challenge!

To try to solve it, just go to this challenge on LeetCode!

And if you want to see a resolution video, @phenpessoa's is THE BEST!

Of all on this list, this is the one I most recommend you try!

⭐- BONUS - Uber Archives

If you want to see other challenges that have been used in Uber interviews in the past, the Uber Archives repository has MANY of these challenges in an Open Source format!

I HIGHLY recommend checking it out!

😄 - THANK YOU!

Of all on this profile, without a doubt, this is one of the best in my opinion!

Took me a while to post it precisely because I researched a lot and wasn't very free, but still, I hope you liked it!

If you have any suggestions, just send me a DM on Twitter! I always want to bring the best content here.

My recent posts didn't reach many people, and even if it continues like this, I'll never stop posting!

Finally, Thank you for reading this far!

Also, check out other projects of mine on my GitHub!

Thank you!

🎆THE BEST HTML/REACT TAGS YOU SURELY DON'T KNOW FOR 2024🎆

Luciano Menezes — Mon, 25 Mar 2024 23:31:10 +0000

⭐- WHAT WILL I SHOW?

In this post, I'll showcase AMAZING HTML/REACT tags that you DEFINITELY DON'T KNOW to START USING IN 2024

If you're new, I always post programming content here! Stay tuned!

Enjoy the read!!

✅ 1 - `<picture>`

This Tag allows you to place MULTIPLE IMAGES at the same time, being able to choose which one will be shown according to the client's screen!

It's AMAZING for when you have various images of different sizes!

Learn more here!

✅ 2 - `<dialog>`

This one is simpler, but VERY USEFUL

You know when you want to show those dialog boxes on your website? This tag will save you!

I only use it now!

Learn more here!

✅ 3 - `<template>`

No more defining a variable with an ENTIRE HTML in your JavaScript!

This tag allows you to place content that can be shown or not, based on JavaScript

IMAGINE THE POSSIBILITIES!

Learn more here!

✅ 4 - `<track>`

This TAG you use along with a media element, like a video or an audio, and you can simply provide SUBTITLES for that content!

MAKES YOUR LIFE MUCH EASIER!!

Learn more here!

✅ 5 - `<object>`

This one allows you to embed external content within your HTML page!

You can put a PDF, files, videos, audios, and even handle the error if the browser doesn't support it!

simply AMAZING!

Learn more here!

⭐ BONUS - `<base>`

This one's good!
With it, you set a Base URL for ALL URLs on your page!

No more repeating the same URL all the time!

Learn more here!

😄 - THANK YOU!

This post was shorter than the others, mainly because time is a bit tighter, but I'll make the next one AMAZING!!

Thank you for reading so far! If you have any suggestions, just let me know and I'll tag you at the top!!

Also, check out my other projects:

better-format: https://github.com/luciano655dev/better-format

DayKeeper (in dev):
https://github.com/luciano655dev/daykeeper

Thank you!

🎆 THE BEST CSS PROPERTIES YOU SURELY DON'T KNOW FOR 2024 🎆

Luciano Menezes — Thu, 21 Mar 2024 00:01:17 +0000

This post is also available, originally, in a Twitter thread and in Portuguese, on Tabnews

⭐ - WHAT WILL I SHOW?

In this Post, I'll show you some AMAZING CSS PROPERTIES that you DEFINITELY don't know about!

If you're new here, I always post programming content on my Twitter! Feel free to follow and give suggestions!

✅ 1 - `mix-blend-mode`

This property allows you to control how an element blends with the content of its parent element and the background element.

With it, you can create UNIQUE overlay effects, among MANY other things!

Learn more!

✅ 2 - `shape-outside`

This one allows you to wrap content around a specific shape, like a circle, a triangle, a polygon, and MANY others.

This is GREAT for creating more interesting and creative layouts for your website.

Learn more!

✅ 3 - `backdrop-filter`

This property applies filtering effects, such as blur or color inversion, to the background of an element, including nested elements.

With this, you can create some visual effects that make the page INCREDIBLY more beautiful!

Learn more!

✅ 4 - `scroll-behavior`

You know when you want to automatically scroll to somewhere on your page? This property will save you!

With it, you can configure how the scroll will be, whether it will be fast, linear, smooth, HOWEVER you want!

Learn more!

✅ 5 - `clip-path`

With this property, you can cut elements IN ANY SHAPE YOU PREFER.

You can make a geometric shape, a star, ANYTHING, making your page UNIQUE and INCREDIBLY BEAUTIFUL.

Learn more!

✅ 6 - `object-fit`

This one's for you who CAN'T DEAL with an image!

With this property, you can place an element HOWEVER YOU WANT over another, whether by filling it, cutting it to make a mask, ANYTHING.

Learn more!

✅ 7 - `perspective`

I KNOW you often want to create some 3D effect on your Website and always end up going for some library.

With THIS property, you define the user's perspective in relation to the Z axis of the website, GREATLY IMPROVING any 3D you're going to do!

Learn more!

✅ 8 - `column-count` AND `column-gap`

These two properties allow you to divide the content of an element into a specific number of columns and define the space between these columns.

With this, everything becomes MUCH more organized, it can SAVE a website!

Learn more about column-gap!
Learn more about column-count!

✅ 9 - `image-rendering`

You know when the image is on the website, but it looks a bit weird?

THIS PROPERTY allows you to DEFINE how an image will be rendered!

Whether it'll be pixelated, with sharper edges, YOU CHOOSE.

Learn more!

✅ 10 - `word-wrap`

You know when that text of yours is ALL MESSED UP on the page, overflowing the container and everything?

Well, this property allows you to BREAK the sentence WHENEVER YOU NEED!

NO MORE MESSED UP SENTENCES, NO MORE BAD TEXTS, NEVER AGAIN!

Learn more!

⭐ BONUS - `text-overflow`

This property, just like the previous one, allows you to IMPROVE THAT MESSED UP TEXT by 100%

With it, you can put '...' at the end of a sentence that doesn't fit in the container, for example, and MUCH MORE.

THIS HAS SAVED ME A LOT

Learn more!

😄 - THANK YOU

The last thread didn't reach as many people, but even if none of my threads yield results, I WILL ALWAYS CONTINUE POSTING.

Hope you enjoyed! Remember that this post is also available on TabNews and DevTo!

My last thread: https://twitter.com/Luciano655dev/status/1769868521863835956

Also check out my other projects!

better-format: https://github.com/luciano655dev/better-format

DayKeeper (in dev): https://github.com/luciano655dev/daykeeper

THANK YOU!

🎆THE BEST GIT COMMANDS YOU PROBABLY DON'T KNOW FOR 2024 🎆

Luciano Menezes — Mon, 18 Mar 2024 23:43:03 +0000

This post is also available originally in Thread format on Twitter and in English on Dev.To!

⭐- WHAT WILL I SHOW?

In this Thread, I'll show you useful git commands that you probably haven't even heard of and believe me, they are VERY USEFUL

If you're new, I always post content here and on Twitter! Keep an eye out!

✅ 1 - `git rebase -i`

This GIT command allows you to reorganize, edit, or combine commits during a rebase

This is VERY useful for cleaning up commit history before sending a pull request, merging your changes into a main branch, etc.

DEV Community: Luciano Menezes

Your Clock Can Go Backward—Use the Right One for Durations

The subtraction that works—until it does not

Your computer already has two kinds of clock

A negative duration once broke DNS

Fix the stopwatch, then fix the deadline

The boundary: never serialize a monotonic reading

Make time testable and observable

🎥 Why is it almost impossible to create a social media with videos - Daykeeper

DayKeeper’s Environment

The Problem

1. Storage structure

2. Verification time

3. Costs

Possible Solutions

1. Having funds ($$$)

2. Imposing limits

3. Trust-based moderation system

4. Partial video verification

Use Queues with Redis and BullMQ

5. Video compression

DayKeeper’s Solution

Conclusion

🎆THE BEST PROGRAMMING CHALLENGES USED IN BIG TECHS FOR YOU TO TRAIN IN 2024🎆

⭐- WHAT WILL I SHOW?

✅ 1 - Back-end Challenge by PicPay

✅ 2 - First Missing Positive by Google

✅ 3 - Backend Challenge by Uber

✅ 4 - Product of Array Except Self by Amazon

✅ 5 - First Unique Character in a String by Netflix

⭐- BONUS - Uber Archives

😄 - THANK YOU!

Thank you!

🎆THE BEST HTML/REACT TAGS YOU SURELY DON'T KNOW FOR 2024🎆

⭐- WHAT WILL I SHOW?

✅ 1 - <picture>

✅ 2 - <dialog>

✅ 3 - <template>

✅ 4 - <track>

✅ 5 - <object>

⭐ BONUS - <base>

😄 - THANK YOU!

Thank you!

🎆 THE BEST CSS PROPERTIES YOU SURELY DON'T KNOW FOR 2024 🎆

⭐ - WHAT WILL I SHOW?

✅ 1 - mix-blend-mode

✅ 2 - shape-outside

✅ 3 - backdrop-filter

✅ 4 - scroll-behavior

✅ 5 - clip-path

✅ 6 - object-fit

✅ 7 - perspective

✅ 8 - column-count AND column-gap

✅ 9 - image-rendering

✅ 10 - word-wrap

⭐ BONUS - text-overflow

😄 - THANK YOU

🎆THE BEST GIT COMMANDS YOU PROBABLY DON'T KNOW FOR 2024 🎆

⭐- WHAT WILL I SHOW?

✅ 1 - git rebase -i

✅ 2 - git cherry-pick

✅ 3 - git reflog

✅ 4 - git bisect

✅ 5 - git worktree

✅ 6 - git submodule

✅ 7 - git clean

✅ 8 - git worktree prune

✅ 9 - git sparse-checkout

✅ 10 - git rerere

⭐ BONUS - git notes

😄- THANK YOU

🎆HOW TO CREATE YOUR OWN PACKAGE ON NPM EASILY, QUICKLY, AND UPDATED 2024🎆

⭐- WHAT ARE WE GOING TO DO?

✅- WHAT IS NPM?

✅- BEFORE CREATING...

✅- WHAT YOU WILL NEED

✅ 1 - HOW TO GET STARTED

✅ 2 - FIRST CODE

✅ 3 - CREATING THE PACKAGE

✅ 4 - CREATING TESTS

✅ 1 - `<picture>`

✅ 2 - `<dialog>`

✅ 3 - `<template>`

✅ 4 - `<track>`

✅ 5 - `<object>`

⭐ BONUS - `<base>`

✅ 1 - `mix-blend-mode`

✅ 2 - `shape-outside`

✅ 3 - `backdrop-filter`

✅ 4 - `scroll-behavior`

✅ 5 - `clip-path`

✅ 6 - `object-fit`

✅ 7 - `perspective`

✅ 8 - `column-count` AND `column-gap`

✅ 9 - `image-rendering`

✅ 10 - `word-wrap`

⭐ BONUS - `text-overflow`

✅ 1 - `git rebase -i`

✅ 2 - `git cherry-pick`

✅ 3 - `git reflog`

✅ 4 - `git bisect`

✅ 5 - `git worktree`

✅ 6 - `git submodule`

✅ 7 - `git clean`

✅ 8 - `git worktree prune`

✅ 9 - `git sparse-checkout`

✅ 10 - `git rerere`

⭐ BONUS - `git notes`