Build this project step by step:
![Uploading loloo.PNG…]()
Instantly summarize any article with just one click using the powerful OpenAI model.
⚙️ Tech Stack
React.js TypeScript Redux Toolkit Tailwind CSS 🔋 Features Modern User Interface: Enjoy a sleek, user-friendly interface for an intuitive experience. Summary Generation: Enter the URL of a lengthy article, and the web app uses AI to provide a concise summary. History Saving with Local Storage: Save summaries locally for easy access and management of your reading history. Copy to Clipboard: Easily share or store summarized content by copying it to your clipboard. Advanced RTK Query API Requests: Leverage the advanced capabilities of Redux Toolkit (RTK) Query for conditional API requests, optimizing data fetching and management. And More: Including code architecture and reusability. 🤸 Quick Start Follow these steps to set up the project locally:
Ensure you have the following installed:
Git Node.js npm (Node Package Manager) Cloning the Repository bash Copier le code git clone https://github.com/adrianhajdin/project_ai_summarizer.git cd project_ai_summarizer Installation Install project dependencies:
npm install
Create a .env file in the root of your project and add the following content:
VITE_RAPID_API_ARTICLE_KEY= Replace the placeholder with your actual credentials from the Rapid API website.
npm run dev Open http://localhost:5173 in your browser to view the project.
🕸️ Snippets App.css index.html 🔗 Links Assets used in the project can be found here.
🚀 More Advance your skills with Next.js 14 Pro Course Enjoyed this project? Dive deeper with our PRO courses, featuring detailed explanations, advanced features, and exercises to enhance your skills. Give it a try!
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Currently, two official plugins are available: