An intelligent web application that transforms complex text into simple, easy-to-understand explanations using the power of AI. Built with React, Vite, and Tailwind CSS, and powered by the Groq API for lightning-fast responses.
- 🤖 AI-Powered Explanations: Leverages the Groq API to provide high-quality explanations for any text you provide.
- 🎚️ Adjustable Complexity: Choose from five different explanation levels, from a simple explanation for a child to an expert-level breakdown.
- 🎨 Sleek & Modern UI: A beautiful and responsive interface built with Tailwind CSS, providing a great user experience.
- ⚡ Blazing Fast: Built with Vite for a rapid development experience and optimized performance.
- 📥 Export & Clear: Easily clear the text and explanation, or export the generated explanation to a
.txtfile. - 🔒 Secure API Key Handling: Uses environment variables to keep your API keys safe and secure.
- Frontend: React, Vite
- Styling: Tailwind CSS
- AI: Groq API
Follow these instructions to get a copy of the project up and running on your local machine for development and testing purposes.
-
Clone the repository:
git clone https://github.com/Dsp023/Explain-It-To-Me.git cd Explain-It-To-Me -
Install NPM packages:
npm install
-
Set up your environment variables: Create a
.envfile in the root of your project and add your Groq API key:VITE_GROQ_API_KEY=YOUR_API_KEY_HERE
You can get a free API key from Groq.
-
Run the development server:
npm run dev
The application will be available at
http://localhost:5173(or the next available port).
- Paste the text you want to be explained into the "Your Text" text area.
- Use the slider to select your desired level of explanation.
- Click the "Explain" button.
- The explanation will appear in the "Explanation" section below.
- Use the "Clear" button to reset the fields or the "Export" button to save the explanation as a text file.
Nakka Devi Sri Prasad
- GitHub: @Dsp023