Skip to content

prashant00797/ai-summary-app

Repository files navigation

🧠 Insight AI — AI Text Summarizer

React Vite TailwindCSS OpenAI Status

🚀 Insight AI is a fast and minimal AI-powered tool that transforms long text into clear summaries, key insights, or bullet points using Open AI.

Paste large content and instantly generate structured insights with adjustable summary styles and lengths.

Designed as a clean single-page React application, the focus is on simplicity, usability, and reliable AI integration.

🌐 Live Demo https://insight-ai-summary.netlify.app


✨ Key Features

🤖 AI Powered Summarization

Generate intelligent summaries using Open AI.

📑 Multiple Summary Modes

Choose between Summary, Key Insights, or Bullet Points.

📏 Adjustable Summary Length

Generate Short, Medium, or Detailed summaries.

🔢 Live Word & Character Counter

Instantly see how much text you are analyzing.

📋 Copy to Clipboard

Quickly copy generated summaries with a single click.

⚡ Fast & Responsive UI

Mobile-first design with a clean and responsive interface.

🛡 Safe AI Response Handling

Structured JSON parsing prevents malformed AI responses and ensures reliable output.


🧩 Summary Modes

📄 Summary

Generates a concise paragraph explaining the core idea of the text.


💡 Key Insights

Structured output including:

  • Summary
  • Key Points
  • Keywords

📌 Bullet Points

Extracts the most important ideas in bullet-point format for quick readability.


📏 Summary Length Options

Short

Quick overview with minimal explanation.

Medium

Balanced summary capturing the main ideas and context.

Long

Detailed explanation covering multiple concepts and deeper insights.


⚙️ Tech Stack

Technology Purpose
⚛️ React UI Library
⚡ Vite Frontend Build Tool
🎨 Tailwind CSS Styling
🤖 OPEN AI API AI Text Processing
🟨 JavaScript Application Logic

🏗 Project Architecture

└──netlify/functions → summarize.js (serveless function)
src
│
├── assets       → icons & images
├── constants    → API URLs, constants, configs
├── generic      → reusable components
├── page         → container logic (data layer)
├── service      → Open AI API integration (service layer)
├── ui           → UI components (ui layer)
├── utility      → helper functions
├── App.jsx
└── main.jsx

This structure follows a layered architecture, separating:

  • UI rendering
  • business logic
  • API services
  • utilities

⚡ How It Works

1️⃣ User pastes long text 2️⃣ Selects summary mode and length 3️⃣ Request is sent via a Netlify serverless function to securely call OpenAI 4️⃣ AI returns structured JSON output 5️⃣ UI parses and renders the summary instantly


📋 Example Output

Summary

Artificial Intelligence has rapidly evolved and is now integrated into many aspects of modern life.

Key Points

• AI powers recommendation systems and healthcare diagnostics • Autonomous vehicles are a major AI application • Ethical concerns such as privacy and bias are emerging

Keywords

Artificial Intelligence, Healthcare AI, Autonomous Vehicles


🔑 Environment Setup

Create a .env file in the project root and add your Open AI API key.

Example:

OPENAI_API_KEY=your_api_key_here

🚀 Running the Project

Clone the repository

git clone <repository-url>

Navigate to the project folder

cd insight-ai

Install dependencies

npm install

Run the development server

npm run dev

🌍 Deployment

This project can be easily deployed on:

  • Netlify
  • Vercel
  • GitHub Pages

📄 License

This project is built for learning and portfolio purposes.

Portfolio Project


💡 Built to demonstrate AI integration in modern frontend applications using React.

About

Insight AI — AI powered text summarizer that converts long text into clear summaries, key insights, or bullet points using Google Gemini.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors