🎥 Demo Video

Click the link above to watch the demo directly on Youtube.

🌙 ADC – AI Dream Chat (Frontend)

AI Dream Chat Frontend is a sleek, responsive web interface designed to bring anonymity and authenticity to dream sharing and interpretation.
Users can post their dreams, explore AI-powered analyses, and engage in meaningful discussions all within a calm, minimalist experience that prioritizes reflection over attention.

This frontend focuses on clarity, emotion, and usability, offering seamless interaction with the Flask backend API while maintaining a clean and intuitive design.

---

✨ Key Highlights

• Anonymous Interface – No sign-ups, no photos, no bios — just raw conversation.
• AI-Driven Insight Display – Integrates with backend AI endpoints for real-time interpretations.
• Responsive Design – Optimized for desktop and mobile users with fluid transitions.
• Modular Components – Cleanly structured HTML, CSS, and JavaScript files for scalability.
• Fast Local Deployment – Runs instantly via Python’s built-in server for easy testing.

---

🧭 Table of Contents

1. Features
2. Tech Stack
3. Project Structure
4. Installation & Setup
5. Usage
6. Scripts
7. Contributing
8. License
9. Contact

---

✨ Features

• 🔐 User Authentication — secure signup and login flow
• 📊 Dynamic Dashboard — displays user stats, posts, and interactions
• 👥 Group Management — create, join, and interact with user groups
• 📱 Fully Responsive Design — optimized for mobile, tablet, and desktop
• ⚙️ Reusable Components — modular JavaScript and HTML structure
• ⚡ Smooth UX — seamless navigation and transitions
• 🤖 AI & Chat Modules — built for scalability and future features

---

🧠 Tech Stack

Layer	Technology
Structure	HTML5
Styling	TailwindCSS
Logic	JavaScript
Assets	SVG, PNG

---

📁 Project Structure

ADC-Frontend/ │ ├── index.html ├── login.html ├── signup.html ├── dashboard.html ├── groups.html ├── post.html ├── ai.html │ ├── index.js ├── login.js ├── signup.js ├── dashboard.js ├── groups.js ├── post.js ├── ai.js │ ├── chat.html ├── chat.js │ ├── assets/ │ ├── Vector.png │ └── Vector (1).png │ └── README.md

• Each HTML file has a dedicated JS script for logic and API handling
• assets/ contains static resources and icons
• Global styling is managed through TailwindCSS

---

⚙️ Installation & Setup

1. Clone the frontend repository

   git clone https://github.com/Syntax-Queen/ADC-Frontend.git
   cd ADC-Frontend

Run the frontend locally

If you have Python 3 installed, use a simple local server to preview the app:

python -m http.server 3000

Then open http://localhost:3000 in your browser

Clone and set up the backend

For full functionality (authentication, posts, dashboard data, etc.), clone and run the backend API:

git clone https://github.com/Syntax-Queen/ADC-Backend.git cd ADC-Backend

Follow the backend’s setup instructions in its README to start the server. Then update API endpoints in your frontend JS files (login.js, signup.js, dashboard.js, etc.) to match your backend URL.

🧩 Usage

Once the backend server is running and connected:

Visit /signup.html to register a new user

Log in via /login.html

You’ll be redirected to dashboard.html after successful authentication

From there, navigate between groups, posts, chat, or AI modules

All interactions (login, fetch, post creation) are handled using Axios or native fetch() methods in the JS scripts

🧱 Scripts Script Description index.js Manages homepage logic and navigation login.js Handles authentication and validation signup.js User registration flow dashboard.js Fetches and renders user-specific data groups.js Group creation, joining, and management post.js Handles post creation, fetching, and updates chat.js / ai.js Chat and AI module logic (if enabled) 🤝 Contributing

Contributions are welcome!

Fork the repository

Create a new branch

git checkout -b feature/YourFeature

Commit your changes

git commit -m "Add new feature"

Push and open a Pull Request to the main branch

Please ensure your code is:

Well-formatted and documented

Free of console errors

Tested for major breakpoints and features

⚖️ License

This project is released under the MIT License — you are free to use, modify, and distribute it with proper attribution.

📬 Contact

Author: Queen (Syntax-Queen)

Frontend Repository: ADC-Frontend

Backend Repository: ADC-Backend

If you find this project useful, kindly ⭐ star the repository and share feedback to support continued development.