Todo App with Drag and Drop Feature

Features

• Drag and Drop: Intuitive drag and drop functionality for moving tasks between different categories.
• CRUD Operations: Users can create, read, update, delete and download tasks in PDF format.
• Category Management: Ability to create and manage categories to organize tasks effectively.
• Responsive Design: The application is designed to be responsive, providing a seamless experience across various devices.

Technologies Used

Frontend

• React: JavaScript library for building user interfaces.
• Tailwind CSS: Utility-first CSS framework for designing responsive and custom UIs.
• React DnD: React wrapper for the HTML5 drag and drop API.

Backend

• Node.js: JavaScript runtime for building server-side applications.
• Express.js: Web application framework for Node.js, providing a robust set of features for web and mobile applications.
• MongoDB: NoSQL database for storing application data.
• PDFkit: User can download all tasks in PDF format.

Installation

To run this application locally, follow these steps:

1. Clone the repository:

   git clone https://github.com/Abhishek-Bharti1/kryzen.git

2. Navigate to the project directory:

   cd kryzen

3. Install dependencies for both frontend and backend:

   cd frontend
   npm install
   cd ../backend
   npm install

4. Set up MongoDB:

   • Ensure you have MongoDB installed and running on your system.
   • Create a new MongoDB database for this application.

5. Configure backend:

   • Create a .env file in the backend directory.
   • Define the MongoDB connection URI and other necessary environment variables in the .env file.

6. Start the backend server:

   cd backend
   npm start

7. Start the frontend server:

   cd frontend
   npm run dev

8. Open your browser to access the application.