💳 Cardify [Create. Display. Simplify].

A modern React project that demonstrates form handling, two-way data binding, and dynamic user card rendering all designed with a clean, responsive UI using TailwindCSS.

Users can add their details, and instantly see them displayed as beautiful profile cards smooth, minimal, and interactive.

🚀 Live Demo: https://cardify-d1vd.vercel.app/

---

🖼️ Preview

(./src/assets/demo.png)

✨ Features

• 🧠 Two-way data binding for real-time updates
• 🎨 Responsive UI built with TailwindCSS
• 🧾 Dynamic form handling and validation
• 💳 Instant user card creation
• 🗑️ Easy delete functionality for cards

---

🛠️ Tech Stack

Technology	Purpose
⚛️ React (Vite)	UI framework
🎨 Tailwind CSS	Styling
💡 JavaScript (ES6+)	Logic & interactivity
🌍 Vercel	Deployment platform

---

⚙️ Installation & Setup

Run the following commands in your terminal to set up Cardify locally 👇

# 1️⃣ Clone the repository
git clone https://github.com/naitik-work/Cardify.git

# 2️⃣ Navigate into the project folder
cd Cardify

# 3️⃣ Install dependencies
npm install

# 4️⃣ Start the development server
npm run dev

## 📂 Folder Structure

├── node_modules/
├── public/
├── src/
│   ├── assets/
│   │   └── demo.png
│   ├── components/
│   │   ├── Card.jsx
│   ├── App.jsx
│   ├── index.css
│   ├── main.jsx
│   └── vite.config.js
├── .gitignore
├── package.json
├── package-lock.json
├── index.html
└── README.md

📱 Responsiveness

Designed to adapt beautifully across all devices:

📱 Mobile: Cards stack vertically for readability

💻 Tablet: 2-column layout

🖥️ Desktop: 3–4 cards per row

🧑‍💻 Author

👋 Hey, I’m Naitik Chitransh
Frontend Developer | Clean UI Enthusiast | Lifelong Learner

💫 Acknowledgements

⚛️ React Documentation
 — for clarity and best practices

🎨 TailwindCSS
 — for effortless design

🚀 Vercel
 — for seamless deployment