Promptly

A modern, minimal AI chat interface built with React + TailwindCSS.

---

🌐 Live

👉 https://promptly-alpha-eight.vercel.app/

---

🚀 Features

✅ Chat UI

• Clean chat layout with user/AI message bubbles
• Auto-scroll to the latest message
• Markdown rendering for AI responses
• Code highlighting with copy-to-clipboard

✅ Smart Input

• Global focus on typing anywhere
• Send message on Enter, new line on Shift+Enter

✅ AI Integration

• Easily switch between multiple AI models
• Built-in fetch method for external APIs
• Extendable API layer for GeminiAI, PollinationsAI, etc.

✅ Responsive & Dark UI

• Styled with TailwindCSS
• Smooth layout for desktop and mobile

---

🛠️ Tech Stack

Category	Technology
Frontend	React + Vite
Styling	TailwindCSS
Icons	React Icons
Markdown Rendering	React Markdown

---

⚙️ Installation & Setup

# 1️⃣ Clone the repository
git clone https://github.com/arifbasha559/Promptly
cd promptly

# 2️⃣ Install dependencies
npm install

# 3️⃣ Run the development server
npm run dev

---

🔑 API Setup

You can plug in any AI API into the fetchapi.js file. Example for ContentAI:

export const fetchContentAIResponse = async (query) => {
  const res = await fetch(
    `https://api.contentai.cloud/v1/Text/blog-articles?category=${encodeURIComponent(
      query
    )}`,
    {
      headers: {
        accept: "application/json",
        "X-ContentAI-Key": "YOUR_API_KEY_HERE",
      },
    }
  );
  return await res.json();
};

⚠️ Note: Replace YOUR_API_KEY_HERE with your actual API key.

---

🧠 Future Improvements

• Add model-based response switching
• Add chat persistence (localStorage / DB)
• Add voice input and speech output
• Add typing animation for AI replies

---

🧑‍💻 Author

**Arif ** Developer & Tech Enthusiast

---

🪪 License

This project is open source under the MIT License.

---

✨ Quote I Live By

“First, solve the problem. Then, write the code.” – John Johnson

---

Built with ❤️ by Arif

---