From 0f037647667944aae158b284278947c1e7584e00 Mon Sep 17 00:00:00 2001
From: Arik Chakma <arikchangma@gmail.com>
Date: Sat, 5 Oct 2024 06:30:10 +0600
Subject: [PATCH] wip: age calculator

---
 src/data/projects/age-calculator.md | 43 +++++++++++++++++++++++++++++
 1 file changed, 43 insertions(+)
 create mode 100644 src/data/projects/age-calculator.md

diff --git a/src/data/projects/age-calculator.md b/src/data/projects/age-calculator.md
new file mode 100644
index 000000000..b6b5107d3
--- /dev/null
+++ b/src/data/projects/age-calculator.md
@@ -0,0 +1,43 @@
+---
+title: 'Age Calculator'
+description: Build a simple application to calculate a person's age based on their birthdate using the Luxon library and a JavaScript datepicker.
+isNew: false
+sort: 1
+difficulty: 'beginner'
+nature: 'Frontend'
+skills:
+  - 'HTML'
+  - 'CSS'
+  - 'JavaScript'
+  - 'DOM Manipulation'
+  - 'Package Management'
+seo:
+  title: 'Age Calculator using Luxon Project Idea'
+  description: Build a simple application to calculate a person's age based on their birthdate using the Luxon library and a JavaScript datepicker.
+  keywords:
+    - 'age calculator'
+    - 'frontend project idea'
+    - 'luxon date manipulation'
+    - 'javascript datepicker'
+roadmapIds:
+  - 'frontend'
+  - 'javascript'
+---
+
+The goal of this project is to help you learn about how to use external packages using [npm](https://www.npmjs.com/). The user inputs their birthdate via a [JavaScript Datepicker](https://www.npmjs.com/package/js-datepicker), and the app calculates and displays their exact age, including years, and months using [Luxon](https://www.npmjs.com/package/luxon).
+
+![Age Calculator](https://assets.roadmap.sh/guest/age-calculator-do1un.png)
+
+## Requirements
+
+You are required to develop an age calculator with the following features:
+
+- A form that allows users to input their birthdate using a JavaScript datepicker (avoid the default HTML date picker)
+- Use the [Luxon](https://www.npmjs.com/package/luxon) library to calculate the exact age in years, months, and days
+- Display the result on the same page after the user submits the form
+- Implement basic validation to ensure the birthdate is valid
+- Use simple styling to make the calculator visually appealing and responsive
+
+<hr />
+
+This project will help you understand how to manipulate dates and times in JavaScript using [Luxon](https://www.npmjs.com/package/luxon). You'll gain experience handling user input via a datepicker, performing date calculations, and designing a simple user interface.