AI Website Explainer

An AI-powered web application that allows users to paste website content and ask questions based on the provided information. The system analyzes the content and generates intelligent responses, summaries, and explanations in real time.

---

Features

• Paste website or article content
• Ask contextual questions
• Intelligent response generation
• Real-time frontend-backend communication
• Clean and responsive user interface
• REST API integration
• Beginner-friendly architecture

---

Tech Stack

Frontend

• React.js
• Vite
• Axios

Backend

• Node.js
• Express.js
• CORS
• dotenv

AI Integration

• LLM API Integration

---

Project Structure

ai-website-explainer/
│
├── frontend/
│   ├── src/
│   ├── public/
│   ├── package.json
│
├── backend/
│   ├── server.js
│   ├── .env
│   ├── package.json
│
└── README.md

---

Installation

Clone the Repository

git clone https://github.com/kowshikramtg/Claude_Powered_Website_Explainer.git

cd Claude_Powered_Website_Explainer

---

Backend Setup

cd backend

npm install

Create a .env file:

API_KEY=your_api_key_here

Start backend server:

node server.js

Server runs on:

http://localhost:5000

---

Frontend Setup

Open another terminal:

cd frontend

npm install

npm run dev

Frontend runs on:

http://localhost:5173

---

Usage

1. Paste website or article content into the textarea
2. Enter a question related to the content
3. Click the Ask button
4. Receive AI-generated answers instantly

---

Example

Website Content

React is a JavaScript library used for building user interfaces.

Question

What is React used for?

Output

React is used for building user interfaces in web applications.

---

Future Improvements

• Direct website URL scraping
• Browser extension integration
• Voice assistant support
• Multi-language support
• PDF summarization
• Authentication system
• Chat history storage
• Playwright automation integration

---

Learning Outcomes

This project helps developers understand:

• Frontend and backend integration
• REST API communication
• AI application workflows
• Environment variable management
• Prompt handling
• Full-stack project structure

---

Contributing

Contributions, suggestions, and improvements are welcome.

Feel free to fork the repository and submit pull requests.

---

📜 License

This project is licensed under the MIT License.

---

Author

Developed by Kowshik T G