🧑‍💼 DevProfile — Craft Your Resume Effortlessly

DevProfile is a dynamic resume builder built with React that lets users create, edit, and preview their resume in real time. It focuses on clean design, responsive layout, and intuitive state management — helping you showcase your skills, experience, and education like a pro.

---

🚀 About the Project

DevProfile is a sleek, interactive resume builder built with React 19, Vite 7, and Tailwind CSS 4.
It empowers developers and professionals to create, edit, and preview resumes in real time — no formatting headaches, just clean, professional results.

---

✨ Features That Make You Shine

• 🧩 Live Editing — Update resume sections with real-time preview and instant formatting
• 🎨 Modern Accent Colors — Choose from professional themes that match your vibe
• 🧾 One-Click Export — Download your resume as a crisp, high-quality PDF instantly
• 📱 Fully Responsive — Works perfectly on all screen sizes

---

🧰 Tech Stack

Technology	Purpose
⚛️ React 19	UI framework
⚡ Vite 7	Lightning-fast build tool
🎨 Tailwind CSS 4	Styling and layout
🪄 Prettier + ESLint	Code formatting & linting
🧠 React Hooks	Component logic
🧾 date-fns	Date formatting utilities
💡 Lucide Icons	Clean, modern icon set

---

⚙️ Installation & Setup

1. Clone the Repository

   git clone https://github.com/devxsameer/devprofile.git
   cd devprofile

2. Install Dependencies

   npm install

3. Run Development Server

   npm run dev

   The app should automatically open at http://localhost:5173

4. Build for Production

   npm run build

5. Preview Production Build

   npm run preview

---

🧠 How It Works

1. Home Page — Introduces the app and its features

2. Builder Interface — Edit your resume sections (Experience, Projects, Skills, etc.)

3. Live Preview — Watch your resume take shape in real time

4. Export to PDF — Save your completed resume with a single click

---

🪄 Development Setup

This project follows modern front-end practices:

🧹 Code Formatting

Prettier + Tailwind Plugin are used for automatic code sorting and formatting. Run manually with:

npx prettier --write .

🕵️ Linting

ESLint ensures clean, consistent code.
Run:

npm run lint

---

💡 Inspiration

Built as part of The Odin Project’s Full Stack Path, focusing on React, component composition, and modern UI design with Tailwind CSS.

---

Made with ♥ by @devxsameer