A simple and lightweight AI React.js Notes App that lets you create, view, edit, and delete notes — built for learning and fun!
- ✏️ Add new notes easily
- 🗑️ Delete notes with a click
- 📅 Each note shows the date it was created
- 💾 Data stored in React state (no backend needed)
- 🎨 Clean and minimal UI
- 🤖 Use Ai to get Summarize or Improve your Notes
In this project we can understand and practice:
- 🔹 useState — managing component state
- 🔹 localStorage — saving notes permanently in the browser
- 🔹 props — passing data between components
- 🔹 Tailwind CSS — fast and modern styling
- 🔹 GitHub Hosting — deploying a React app online
- 🔹 API Integration — connecting Gemini AI to add smart features
- 🔹 Adding AI to Web Apps — integrating AI-powered tools into a React project
- ⚛️ React.js – Frontend library
- 💅 Tailwind – For styling
- 🤖 Gemini Ai - For Ai Features
- Clone the repository
git clone https://github.com/kaushalsahu07/notes.git
- Navigate to the project folder
cd notes - Install dependencies
npm install
- Configure your Gemini API key
- Rename
.env.exampleto.env - Add your API key:
VITE_GEMINI_API_KEY=your_gemini_api_key_here
- Rename
- Run the app
npm run dev
- Open your browser and visit
👉 http://localhost:5173
For any inquiries, reach out at kaushalsahu.me@gmailcom.
GitHub: @kaushalsahu07.
Linkedin: @kaushalsahu07.
Instagram: @cd.kaushal.
Portfolio: Website Link .
X (Tweeter): @kaushalsahu_07.
Created with ❤️ by Kaushal Sahu