EthioCode · P3·L06 · Day.js 📅

01Day.js ምንድን ነው? — ለምን Moment.js አንጠቀምም?

Day.js — JavaScript ላይ Date እና Timeን (ቀን እና ሰዓትን) ለማስተዳደር የሚያገለግል ቀለል ያለ (2KB!) library ነው! Moment.js 200KB+ ሲሆን Day.js ግን ተመሳሳይ API ይዞ 2KB ብቻ ነው! Immutable ስለሆነ — ዋናው date object አይቀየርም፣ አዲስ object ነው የሚመልሰው።
Parse any string/timestamp → format → manipulate → compare → timezone!

📦

npm install dayjs
import dayjs from 'dayjs' — default 2KB · plugins ሲጨመሩ ቀስ በቀስ መጠኑ ይጨምራል

❌ Moment.js — 230KB (Deprecated!)

import moment from 'moment';
// ❌ 230KB የ bundle መጠን!
// ❌ Mutable ነው — ዋናውን ዳታ ይቀይረዋል (side effects አለው)!
// ❌ Tree-shaking የለውም!
// ❌ ከ 2020 ጀምሮ Deprecated ሆኗል!

moment().format('YYYY-MM-DD');
moment().add(7, 'days');
moment().fromNow();

✅ Day.js — 2KB · ተመሳሳይ API!

import dayjs from 'dayjs';
// ✅ 2KB ብቻ ነው!
// ✅ Immutable ነው — pure functions ይጠቀማል!
// ✅ የ Plugin አሰራር አለው!
// ✅ አሁንም Active development ላይ ነው!

dayjs().format('YYYY-MM-DD');
dayjs().add(7, 'day');
dayjs().fromNow();

02⏰ የቀጥታ ሰዓት — dayjs() Live Demo

--:--:--

Loading...

— Day.js ⏰ —

Unix: ...

Year—

Month—

Day—

DOW—

DOY—

Quarter—

dayjs() API — ሰዓቱን ከ JS ማውጣት

clock.ts

const now = dayjs();

now.year()     // → 2026 (ዓመቱን ያወጣል)
now.month()    // → 0-11 (0=Jan) (ወሩን ያወጣል)
now.date()     // → 1-31 (ቀኑን ያወጣል)
now.day()      // → 0-6 (0=Sun) (የሳምንቱን ቀን ያወጣል)
now.hour()     // → 0-23 (ሰዓቱን ያወጣል)
now.minute()   // → 0-59 (ደቂቃውን ያወጣል)
now.second()   // → 0-59 (ሰከንዱን ያወጣል)
now.unix()     // → timestamp (በሰከንድ)
now.valueOf()  // → ms timestamp (በሚሊሰከንድ)
now.toDate()   // → JS Date object ይመልሳል
now.toISOString() // → ISO 8601 ፎርማት ይመልሳል

03📐 Parse · Format · Manipulate — ዋናዎቹ የ Day.js APIዎች

dayjs-core.ts

CORE API

🔍 Parse (ማንበብ)

📋 Format (ቅርፅ መቀየር)

⚙️ Manipulate (ማስተካከል)

⚖️ Compare (ማወዳደር)

⏱ Diff (ልዩነት)

dayjs() — ማንኛውንም ዓይነት Date ወደ Day.js object መቀየር (Parse ማድረግ)! String ፣ Timestamp ፣ JS Date ፣ ሁሉም ይሰራሉ!

parse.ts

// 📅 ዛሬን ለማግኘት
dayjs()                         // → አሁን ያለውን ሰዓት ይመልሳል
new Date()                      // ከ JS Date ጋር ተመሳሳይ ነው

// 📝 String parse ለማድረግ
dayjs('2026-05-16')            // ISO date
dayjs('2026-05-16T10:30:00')  // ISO datetime
dayjs('2026-01-01')            // አዲስ ዓመት

// 🔢 Unix Timestamp ለማንበብ
dayjs(1715817600000)           // በሚሊሰከንድ (milliseconds)
dayjs.unix(1715817600)         // በሰከንድ (seconds)

// 📦 JS Date objectን ወደ Day.js ለመቀየር
dayjs(new Date(2026, 4, 16))  // ወር ከ 0 ስለሚጀምር 4 ማለት May ነው

// 🎯 Object parse ለማድረግ (Plugin ሊያስፈልገው ይችላል)
dayjs({ year:2026, month:4, day:16,
        hour:10, minute:30 })

// ✅ ትክክለኛ Date መሆኑን ለማረጋገጥ (Is Valid?)
dayjs('2026-bad').isValid()   // → false
dayjs('2026-05-16').isValid() // → true

format() — Dateን ወደ ፈለጋችሁት string ፎርማት መቀየር! Format tokens በመጠቀም በቀላሉ ማስተካከል ይቻላል!

format.ts

const d = dayjs('2026-05-16T10:30:45');

d.format('YYYY-MM-DD')       // '2026-05-16'
d.format('DD/MM/YYYY')       // '16/05/2026'
d.format('MMMM D, YYYY')    // 'May 16, 2026'
d.format('ddd, MMM D')       // 'Sat, May 16'
d.format('HH:mm:ss')         // '10:30:45'
d.format('h:mm A')            // '10:30 AM'
d.format('x')                 // Unix ms timestamp
d.format('Q')                 // '2' (Quarter/ሩብ ዓመት)
d.toISOString()               // ISO 8601 string

Token	ምሳሌ	ትርጉም
YYYY	2026	4-digit year (ዓመተ ምህረት)
MM	05	2-digit month (01-12) (ወር)
MMMM	May	Full month name (የወሩ ሙሉ ስም)
DD	16	2-digit day (01-31) (ቀን)
ddd	Sat	Short weekday (የሳምንቱ ቀን በአጭሩ)
dddd	Saturday	Full weekday (የሳምንቱ ቀን በሙሉ)
HH	10	24-hour (00-23) (በ24 ሰዓት ፎርማት)
hh	10	12-hour (01-12) (በ12 ሰዓት ፎርማት)
mm	30	Minutes (00-59) (ደቂቃ)
ss	45	Seconds (00-59) (ሰከንድ)
A	AM/PM	Meridiem upper (ጠዋት/ከሰዓት)
x	1747388400000	Unix ms (በሚሊሰከንድ)

Immutable — add/subtract/set ሁሉም አዲስ Day.js object ነው የሚመልሱት! Original ዳታው አይቀየርም! Like strings in JS — always returns new value.

manipulate.ts

const today = dayjs(); // immutable ነው!

// ➕ add() (ለመጨመር)
today.add(1, 'day')          // ነገ
today.add(1, 'week')         // ከ 1 ሳምንት በኋላ
today.add(3, 'month')        // ከ 3 ወር በኋላ
today.add(1, 'year')         // ከ 1 ዓመት በኋላ
today.add(90, 'minute')      // ከ 90 ደቂቃ በኋላ

// ➖ subtract() (ለመቀነስ)
today.subtract(7, 'day')     // ከ 7 ቀን በፊት
today.subtract(6, 'month')   // ከ 6 ወር በፊት

// 📍 startOf · endOf (መጀመሪያ እና መጨረሻ ለማግኘት)
today.startOf('month')       // → የወሩ መጀመሪያ (May 1)
today.endOf('month')         // → የወሩ መጨረሻ (May 31)
today.startOf('week')        // → የሳምንቱ መጀመሪያ (Sunday)
today.startOf('year')        // → የዓመቱ መጀመሪያ (Jan 1)

// ✏️ set() (የተወሰነውን ክፍል ብቻ ለመቀየር)
today.set('hour', 9)          // → ሰዓቱን ወደ 09:00 ይቀይራል
today.set('date', 1)          // → ቀኑን ወደ 1 ይቀይራል

// ⛓️ Chain ማድረግ (ማያያዝ) ይቻላል!
dayjs().add(1,'month').startOf('month').format('YYYY-MM-DD')

isBefore · isAfter · isSame — Datesን ማወዳደሪያ! Deadline ፣ Age check ፣ Date range — ለሁሉም ያገለግላል!

compare.ts

const a = dayjs('2026-01-01');
const b = dayjs('2026-12-31');

// ⚖️ Comparison (ማወዳደር)
a.isBefore(b)                  // → true (a ከ b በፊት ነው)
a.isAfter(b)                   // → false (a ከ b በኋላ አይደለም)
a.isSame(b)                    // → false (እኩል አይደሉም)
a.isSame(b, 'year')            // → true (ዓመታቸው አንድ ነው!)
a.isBefore(b, 'month')        // → true (በወር ሲወዳደር a ይቀድማል)

// ✅ isBetween (መካከል መሆኑን ለማረጋገጥ - plugin ያስፈልገዋል)
import isBetween from 'dayjs/plugin/isBetween';
dayjs.extend(isBetween);

const check = dayjs('2026-06-15');
check.isBetween(a, b)           // → true (በ a እና b መካከል ነው)
check.isBetween(a, b, 'month') // በወር ደረጃ ማወዳደር

// 📅 Real use: Deadline check (የጊዜ ገደብ ማረጋገጫ)
const deadline = dayjs('2026-12-31');
const isPassed = dayjs().isAfter(deadline); // ጊዜው አልፏል?
const daysLeft = deadline.diff(dayjs(), 'day'); // ስንት ቀን ቀረው?

diff() — የሁለት Dates ልዩነት! በዓመት ፣ በወር ፣ በቀን ፣ በሰዓት — በሁሉም ዓይነት መለካት ይቻላል!

diff.ts

const start = dayjs('2026-01-01');
const end   = dayjs('2026-05-16');

// diff(date2, unit, float?)
end.diff(start, 'day')          // → 135 days (የቀን ልዩነት)
end.diff(start, 'month')        // → 4 months (የወር ልዩነት)
end.diff(start, 'week')         // → 19 weeks (የሳምንት ልዩነት)
end.diff(start, 'hour')         // → 3240 hours (የሰዓት ልዩነት)
end.diff(start, 'year')         // → 0 years (ተመሳሳይ ዓመት ስለሆነ)
end.diff(start, 'month', true)  // → 4.5 (float/ነጥብ ሲያስፈልግ)

// 🎂 Age Calculator (ዕድሜ ማስያ)
const birth = dayjs('2000-05-16');
const age = dayjs().diff(birth, 'year');
console.log(`ዕድሜ: ${age} ዓመት`);     // 26

// 📦 Duration Plugin (የቆይታ ጊዜ ፕለጊን)
import duration from 'dayjs/plugin/duration';
dayjs.extend(duration);
const dur = dayjs.duration(135, 'days');
dur.asHours()   // → 3240 (ወደ ሰዓት ሲቀየር)
dur.humanize()  // → '4 months' (ሰው ሊያነበው በሚችል መልኩ)

04🎮 Date Calculator — ቀጥታ ሞክሩት!

⚙️ Day.js Calculator — Date Manipulation Live

⚖️ Date Diff (ልዩነት)

➕ Add / Subtract (መጨመር/መቀነስ)

📋 Format (ቅርፅ)

🕐 Relative Time (አንፃራዊ ጊዜ)

📅 Date 1

📅 Date 2

📐 Unit

📅 Dates ምረጡ → Calculate ጠቅ አድርጉ!

05🔌 Plugins — Day.js ማስፋፊያዎች

Day.js ዋና package ቀለል ያለ እና ትንሽ ነው! ተጨማሪ Features ሲያስፈልጋችሁ plugin ትጨምራላችሁ — ያ ብቻ ነው! Tree-shaking ይደግፋል ✅

🕐

relativeTime

dayjs/plugin/relativeTime

"2 hours ago", "in 3 days" — ሰው ሊያነበው የሚችል የጊዜ አገላለፅ!

dayjs.extend(relativeTime)
dayjs('2026-01-01').fromNow()
// → "4 months ago"
dayjs().to(deadline)
// → "in 7 months"

🌍

timezone + utc

dayjs/plugin/timezone

Timezone convert ለማድረግ! Africa/Addis_Ababa ↔ UTC ↔ America/New_York!

dayjs().tz('Africa/Addis_Ababa')
dayjs().utc()
dayjs.tz('2026-05-16', 'Africa/...')
// → EAT +03:00

📅

isBetween

dayjs/plugin/isBetween

Date range ውስጥ መሆኑን ለማረጋገጥ? — ለ Event schedules, booking systems!

dayjs.extend(isBetween)
d.isBetween(start, end)
d.isBetween(a, b, 'month')
// → true / false

📏

duration

dayjs/plugin/duration

Duration object! ለ Countdown timers, interval calculations!

dayjs.extend(duration)
dayjs.duration(2, 'hours')
.asMinutes() // → 120
.humanize() // → '2 hours'

📆

weekOfYear

dayjs/plugin/weekOfYear

ዓመቱ ስንተኛ ሳምንት ላይ ነው? ለ Calendars, analytics dashboards!

dayjs.extend(weekOfYear)
dayjs('2026-05-16').week()
// → 20 (week 20 of 2026)

📝

customParseFormat

dayjs/plugin/customParseFormat

Custom string format parse ለማድረግ! ለ Ethiopian dates, non-ISO formats!

dayjs.extend(customParseFormat)
dayjs('16-05-2026', 'DD-MM-YYYY')
dayjs('May 16 2026', 'MMM D YYYY')

06🕐 Relative Time — fromNow() Live Demo

relativeTime plugin → fromNow() / to() — Dates ሰው ሊያነበው ወደሚችል ቋንቋ ይቀይራል! Social media ፣ Comments ፣ Timestamps — ለሁሉም ያገለግላል!

⏪ ያለፈ ጊዜ (Past)ዛሬ (Now)ወደፊት (Future) ⏩

DATE

—

→

fromNow()

—

|

DIFF

—

relativeTime.ts

import dayjs from 'dayjs';
import relativeTime from 'dayjs/plugin/relativeTime';
dayjs.extend(relativeTime);

dayjs().fromNow()                    // → 'a few seconds ago'
dayjs().subtract(5,'min').fromNow()  // → '5 minutes ago'
dayjs().subtract(2,'hour').fromNow() // → '2 hours ago'
dayjs().subtract(3,'day').fromNow()  // → '3 days ago'
dayjs().add(1,'week').fromNow()      // → 'in 7 days'
dayjs().add(3,'month').fromNow()    // → 'in 3 months'

// to() — ከአንድ date አንፃር የሌላውን ጊዜ ለማወቅ
const deadline = dayjs('2026-12-31');
dayjs().to(deadline)                  // → 'in 7 months'

07⚡ Production Ready — ሙሉ ምሳሌ

dateUtils.ts — በሁሉም ቦታ የምንጠቀማቸው utils

import dayjs from 'dayjs';
import relativeTime from 'dayjs/plugin/relativeTime';
import timezone   from 'dayjs/plugin/timezone';
import utc        from 'dayjs/plugin/utc';
import duration   from 'dayjs/plugin/duration';

dayjs.extend(relativeTime);
dayjs.extend(utc);
dayjs.extend(timezone);
dayjs.extend(duration);

// 1️⃣ Display — Post timestamp (እንደ Twitter/Facebook style)
export const timeAgo = (date: string) =>
  dayjs(date).fromNow();
// '2026-05-16T08:00:00' → '2 hours ago'

// 2️⃣ Format — Ethiopian date display (ቀን እና ሰዓት ማሳያ)
export const formatEt = (date: string) =>
  dayjs(date).format('MMMM D, YYYY · HH:mm');
// → 'May 16, 2026 · 10:30'

// 3️⃣ Age calculator (ዕድሜ ማስያ)
export const calcAge = (birth: string) =>
  dayjs().diff(dayjs(birth), 'year');

// 4️⃣ Deadline check (የጊዜ ገደብ ማረጋገጫ)
export const deadlineInfo = (deadline: string) => ({
  isPassed: dayjs().isAfter(dayjs(deadline)),
  daysLeft: dayjs(deadline).diff(dayjs(), 'day'),
  label:    dayjs().to(dayjs(deadline)),
});

// 5️⃣ Timezone convert (EAT ↔ UTC)
export const toEAT = (utcDate: string) =>
  dayjs.utc(utcDate).tz('Africa/Addis_Ababa').format('HH:mm');

// 6️⃣ Date range for calendar (ለካላንደር የሚሆኑ ቀናትን ማውጣት)
export const getMonthDays = (year: number, month: number) => {
  const start = dayjs().year(year).month(month).startOf('month');
  const end   = start.endOf('month');
  const days  = [];
  let cur = start;
  while (cur.isBefore(end) || cur.isSame(end, 'day')) {
    days.push(cur.format('YYYY-MM-DD'));
    cur = cur.add(1, 'day');
  }
  return days; // በወሩ ውስጥ ያሉትን ቀናት በሙሉ ይመልሳል
};

📌ጠቅለል ያለ ማስታወሻ

1

📦 2KB — Moment.js ን ተካ!

Moment.js 230KB ሲሆን Day.js 2KB ነው! Immutable ነው — add(), subtract() ሁሉም አዲስ object ይመልሳሉ! Original ዳታው አይቀየርም — ስህተት አይፈጠርም!

dayjs() is chainable: dayjs().add(1,'d').subtract(2,'h').format('...')

2

📐 format() — Display ሁሉ!

YYYY-MM-DD · HH:mm:ss · MMMM D, YYYY — የፈለጋችሁትን format tokens አቀላቅሉ! API responses ሁሌ ISO 8601 መሆን አለባቸው — Display ሲሆን format() ተጠቀሙ!

Always store dates in ISO 8601 (UTC), only format for display.

3

🕐 relativeTime Plugin — Social UX!

fromNow() = "2 minutes ago" ፣ to() = "in 3 months"! ለ Comments ፣ Post timestamps ፣ Countdown — ለሁሉም ያገለግላል! Plugin መጨመር ብቻ ነው የሚጠበቅባችሁ!

dayjs.extend(relativeTime) — once at app entry, use everywhere.

4

⚖️ diff() — የልዩነት ስሌት!

dayjs(end).diff(start, 'day') — Age ፣ Deadline days left ፣ Duration — ለሁሉም ይሰራል! float: true ሲቀመጥ decimal (ነጥብ) ይሰጠናል!

Positive = end is after start · Negative = end is before start.

5

🌍 Timezone — Global Apps!

EAT (Ethiopia +03:00)፣ UTC ፣ US timezones — timezone + utc plugins ያስፈልጉታል! API ሁሌ UTC መሆን አለበት ፣ Display ሲሆን ወደ user timezone convert ይደረጋል!

dayjs.utc(isoString).tz('Africa/Addis_Ababa').format('HH:mm')

🎯ለዕውቀት መፈተኛ Quiz!

❓ Day.js ውስጥ add() method ምን ይመልሳል?

What does the add() method return in Day.js?

A

ዋናው Date object ይቀይርና ምንም አይመልስም (Mutates and returns undefined)

B

አዲስ Day.js object ይፈጥርና ይመልሳል — Original ዳታው አይቀየርም! (Immutable) ✅

C

JavaScript Date object ይመልሳል

D

String format ሰጥቶ ይመልሳል

Day.js —Date እና Timeን ለማስተዳደር ቀላሉ መንገድ! 📅

Day.js —
Date እና Timeን ለማስተዳደር ቀላሉ መንገድ! 📅