🚀 MERN Stack App with Google Gemini ✨

A Simple MERN Stack Application with Google Gemini's Text Generation for Subtasks from a user's main Task.

This guide will help you set up and run the MERN stack application, which includes a MongoDB database, Express.js server, React.js frontend, and Node.js runtime.

Demo

demo_video.mp4

Prerequisites 📋

Before you begin, ensure you have the following installed on your machine:

• Node.js (includes npm) 🌐
• MongoDB (if running locally) 🗄️
• GOOGLE GEMINI API KEY 🗝️
• MONGOOSE DB URI 🔗

Features 🌟

Frontend 💻

• 🔑 User Authentication

  • User Registration and Login
  • Password Reset Functionality

• 📋 Todo Management

  • Add, Edit, and Delete Todos
  • Generate Subtasks using Google Gemini Pro ✨

• 🎮 Gamification

  • Track Completed Todos and Subtasks
  • Display Completion Percentages

• 👤 User Account Management

  • Edit and Delete Account

Backend 🔧

• 🔐 Security

  • JWT Authentication
  • Password Hashing using bcrypt

• 🛡️ Validation

  • Data Validation using express-validator

• 📊 Database

  • MongoDB Integration for Storing User and Todo Data

• 🔄 API Integration

  • Google Gemini API for Subtask Generation

Technologies Used 🛠️

This project was built using the following technologies:

• 🌐 MongoDB: For database management
• ⚙️ Express.js: For the backend server
• ⚛️ React: For the frontend UI
• 🟢 Node.js: For the backend runtime environment
• ✨ Google Gemini Pro: For generating subtasks
• 🎨 Tailwind CSS: For styling the application

Project Setup 🛠️

Follow these steps to set up and run the application:

1. Clone the Repository 📂

First, clone the repository to your local machine:

git clone <repository-url>
cd <repository-folder>

2. Install Dependencies 📦

Frontend

Navigate to the frontend directory and install the necessary dependencies:

cd todo
npm install

Backend

Navigate to the backend directory and install the necessary dependencies:

cd ../todo-backend
npm install

3. Configure Environment Variables 🌍

Backend

Create a .env file in the todo-backend directory and add your MongoDB URI:

MONGODB_URI=your_mongodb_uri_here
JWT_SECRET=your_jwt_secret_here

Frontend

Create a .env file in the todo directory and add your Google Gemini API key:

REACT_APP_GEMINI_API_KEY=your_google_gemini_api_key_here

4. Start the Backend Server 🚀

In the backend directory, start the server using nodemon:

cd ../todo-backend
nodemon server.js

5. Start the Frontend Application 🌐

In the frontend directory, start the application:

cd ../todo
npm start

Usage 📝

Once the application is running, you can:

• Sign up for a new account ✍️
• Log in to your account 🔑
• Reset your password 🔄
• Create, edit, and delete todos 🗒️
• Generate subtasks using Google Gemini Pro ✨
• Track your progress with gamification features 🎮

Contributing 🤝

Contributions are welcome! Please fork the repository and create a pull request with your changes.

License 📜

This project is licensed under the MIT License.