🕹️ Playaround - Real-Time Chat Application

Playaround is a simple and elegant real-time chat app built with vanilla JavaScript, socket.io, and a touch of style. It lets users join with a custom name and automatically assigns them a unique avatar using DiceBear. The UI is clean, mobile-friendly, and inspired by classic messaging interfaces.

---

🚀 Features

• Real-time messaging using Socket.io
• Unique avatars via DiceBear Avatars API
• Smooth user join and message notifications
• Custom name input with live avatar preview
• Notification sound toggle
• Minimalist chat UI with time and date display
• Mobile-friendly responsive layout

---

---

🛠️ Tech Stack

• Frontend: HTML, CSS, JavaScript
• Backend: Node.js with Socket.io (served via Glitch)
• Avatars: DiceBear Bottts API
• Sounds: Custom audio for incoming and outgoing messages

---

🔧 How to Run Locally

1. Clone the repo:

git clone https://github.com/Spiral-Memory/playAround.git
cd playAround

2. Set up a Socket.io server:

Either:

• Use my existing Glitch server (e.g., https://zchatserver.glitch.me/)
• Or spin up a local Node.js server using the minimal setup provided in the Server_Code folder:

Run with:

npm install socket.io
node server.js

3. Open index.html in a browser

Ensure your script.js connects to the correct server URL (io('http://localhost:3000') or Glitch URL).

---

✍️ To-Do

• Support attachments (files, images)
• Add emoji support
• Implement group chat
• Show active members

---

🤝 Credits

• DiceBear Avatars
• Socket.io
• Glitch for quick backend deployment

---

💡 Contributions

Contributions are very welcome! Whether it's fixing bugs, improving the UI, adding new features like attachments or group chat, or helping with documentation — feel free to open issues or submit pull requests.