{"id":28804602,"url":"https://github.com/simranshaikh20/taskify","last_synced_at":"2025-10-04T00:12:46.463Z","repository":{"id":298662404,"uuid":"982573580","full_name":"SimranShaikh20/Taskify","owner":"SimranShaikh20","description":"A modern, responsive task management application built with React. Features include task creation, completion tracking, and intuitive user interface for productivity management.","archived":false,"fork":false,"pushed_at":"2025-06-16T15:36:56.000Z","size":23019,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-06-19T09:12:08.231Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://taskify-1e72c.web.app/","language":"Python","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/SimranShaikh20.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-05-13T05:12:15.000Z","updated_at":"2025-06-16T15:37:00.000Z","dependencies_parsed_at":"2025-06-12T08:29:55.596Z","dependency_job_id":null,"html_url":"https://github.com/SimranShaikh20/Taskify","commit_stats":null,"previous_names":["simranshaikh20/taskify"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/SimranShaikh20/Taskify","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SimranShaikh20%2FTaskify","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SimranShaikh20%2FTaskify/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SimranShaikh20%2FTaskify/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SimranShaikh20%2FTaskify/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/SimranShaikh20","download_url":"https://codeload.github.com/SimranShaikh20/Taskify/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SimranShaikh20%2FTaskify/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":278245570,"owners_count":25955052,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-03T02:00:06.070Z","response_time":53,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-06-18T09:06:16.796Z","updated_at":"2025-10-04T00:12:46.458Z","avatar_url":"https://github.com/SimranShaikh20.png","language":"Python","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Taskify - Todo Application\n\nA full-stack todo application built with **React** (frontend), **FastAPI** (backend), and **MongoDB** (database). This application allows users to create, read, update, and delete todo items with a modern, responsive interface.\n\n## 🌐 Live Demo\n\n- **Frontend**: [https://taskify-todo-app.web.app](https://taskify-todo-app.web.app)\n- **API Documentation**: [https://your-backend-url.com/docs](https://your-backend-url.com/docs)\n\n## 🚀 Features\n\n- ✅ **Create** new todo items\n- 📝 **Edit** existing todos inline\n- ✔️ **Mark** todos as complete/incomplete\n- 🗑️ **Delete** todos with confirmation\n- 📊 **Progress tracking** with completion percentage\n- 🎨 **Modern UI** with Tailwind CSS\n- 📱 **Responsive design** for all devices\n- ⚡ **Real-time updates** with loading states\n- 🔄 **Error handling** and user feedback\n- 🌐 **REST API** with automatic documentation\n\n## 🛠️ Tech Stack\n\n### Frontend\n- **React 18** - Modern JavaScript library for building user interfaces\n- **Tailwind CSS** - Utility-first CSS framework for styling\n- **Lucide React** - Beautiful icons for React applications\n- **JavaScript ES6+** - Modern JavaScript features\n\n### Backend\n- **FastAPI** - Modern, fast Python web framework\n- **Pydantic** - Data validation using Python type annotations\n- **Motor** - Async MongoDB driver for Python\n- **Uvicorn** - ASGI server for running FastAPI applications\n\n### Database\n- **MongoDB** - NoSQL document database for flexible data storage\n\n### Deployment\n- **Firebase Hosting** - Frontend deployment\n- **Railway/Heroku** - Backend deployment options\n\n## 📋 Prerequisites\n\nBefore running this application, make sure you have the following installed:\n\n- **Node.js** (v16 or higher) - [Download here](https://nodejs.org/)\n- **Python** (v3.8 or higher) - [Download here](https://python.org/)\n- **MongoDB** - [Download here](https://www.mongodb.com/try/download/community) or use [MongoDB Atlas](https://www.mongodb.com/cloud/atlas)\n- **Git** - [Download here](https://git-scm.com/)\n\n## 🚀 Installation \u0026 Setup\n\n### 1. Clone the Repository\n\n```bash\ngit clone https://github.com/SimranShaikh20/taskify.git\ncd taskify\n```\n\n### 2. Backend Setup (FastAPI + MongoDB)\n\n```bash\n# Navigate to backend directory\ncd backend\n\n# Create virtual environment\npython -m venv venv\n\n# Activate virtual environment\n# On Windows:\nvenv\\Scripts\\activate\n# On macOS/Linux:\nsource venv/bin/activate\n\n# Install dependencies\npip install fastapi uvicorn motor pymongo python-multipart\n\n# Or using requirements.txt (if available)\npip install -r requirements.txt\n```\n\n### 3. Frontend Setup (React)\n\n```bash\n# Navigate to frontend directory\ncd todo-frontend\n\n# Install dependencies\nnpm install\n\n# Install additional dependencies\nnpm install lucide-react\n\n# Install Tailwind CSS (if not already configured)\nnpm install -D tailwindcss postcss autoprefixer\nnpx tailwindcss init -p\n```\n\n### 4. Database Setup (MongoDB)\n\n#### Option A: Local MongoDB Installation\n1. Install MongoDB Community Edition\n2. Start MongoDB service:\n   ```bash\n   # On Windows (as service)\n   net start MongoDB\n   \n   # On macOS with Homebrew\n   brew services start mongodb-community\n   \n   # On Linux\n   sudo systemctl start mongod\n   ```\n\n#### Option B: MongoDB Atlas (Cloud)\n1. Create a free account at [MongoDB Atlas](https://www.mongodb.com/cloud/atlas)\n2. Create a new cluster\n3. Get your connection string\n4. Update the `MONGODB_URL` in your backend configuration\n\n### 5. Environment Configuration\n\nCreate a `.env` file in the backend directory:\n\n```env\n# Database Configuration\nMONGODB_URL=mongodb://localhost:27017\n# For MongoDB Atlas, use your connection string:\n# MONGODB_URL=mongodb+srv://username:password@cluster.mongodb.net/\n\n# API Configuration\nHOST=0.0.0.0\nPORT=8000\nDEBUG=True\n```\n\n## 🏃‍♂️ Running the Application\n\n### 1. Start the Backend Server\n\n```bash\ncd backend\nuvicorn main:app --reload --host 0.0.0.0 --port 8000\n```\n\nThe backend will be available at:\n- **API**: http://localhost:8000\n- **API Documentation**: http://localhost:8000/docs\n- **Alternative Docs**: http://localhost:8000/redoc\n\n### 2. Start the Frontend Development Server\n\n```bash\ncd todo-frontend\nnpm start\n```\n\nThe frontend will be available at:\n- **Application**: http://localhost:3000\n\n## 📁 Project Structure\n\n```\ntaskify/\n├── __pycache__/                 # Python cache files\n├── config/\n│   ├── __pycache__/\n│   └── database.py             # Database connection configuration\n├── model/\n│   ├── __pycache__/\n│   └── todos.py                # Pydantic models for data validation\n├── routes/\n│   ├── __pycache__/\n│   └── route.py                # API route handlers\n├── schema/\n│   ├── __pycache__/\n│   └── schemas.py              # Data schemas\n├── todo-frontend/\n│   ├── node_modules/           # Node.js dependencies\n│   ├── public/\n│   │   ├── favicon.ico\n│   │   ├── index.html\n│   │   ├── logo192.png\n│   │   ├── logo512.png\n│   │   ├── manifest.json\n│   │   └── robots.txt\n│   ├── src/\n│   │   ├── components/\n│   │   │   ├── TodoForm.js     # Form for creating new todos\n│   │   │   ├── TodoItem.js     # Individual todo item component\n│   │   │   └── TodoList.js     # List container for todos\n│   │   ├── App.css             # Application styles\n│   │   ├── App.js              # Main React application\n│   │   ├── App.test.js         # Application tests\n│   │   ├── index.css           # Global styles\n│   │   ├── index.js            # React entry point\n│   │   ├── logo.svg            # React logo\n│   │   └── reportWebVitals.js  # Performance monitoring\n│   ├── package.json            # Node.js dependencies\n│   └── package-lock.json       # Dependency lock file\n├── firebase.json               # Firebase configuration\n├── .firebaserc                 # Firebase project settings\n└── main.py                     # FastAPI application entry point\n```\n\n## 🔌 API Endpoints\n\nThe backend provides the following REST API endpoints:\n\n| Method | Endpoint | Description |\n|--------|----------|-------------|\n| `GET` | `/todos/` | Get all todos |\n| `POST` | `/todos/` | Create a new todo |\n| `GET` | `/todos/{id}` | Get a specific todo |\n| `PUT` | `/todos/{id}` | Update a todo |\n| `DELETE` | `/todos/{id}` | Delete a todo |\n| `GET` | `/` | API status |\n| `GET` | `/health` | Health check |\n\n\n## 🔧 Configuration\n\n### Backend Configuration\n\nEdit `.env` file in the root directory to configure:\n\n```env\n# Database\nMONGODB_URL=mongodb://localhost:27017\nDATABASE_NAME=taskify_db\n\n# Server\nHOST=0.0.0.0\nPORT=8000\nDEBUG=True\n\n# CORS (add your frontend URLs)\nCORS_ORIGINS=[\"http://localhost:3000\", \"https://taskify-todo-app.web.app\"]\n```\n\n### Frontend Configuration\n\nUpdate API base URL in your frontend service files:\n\n```javascript\n// For development\nconst API_BASE_URL = 'http://localhost:8000';\n\n// For production\nconst API_BASE_URL = 'https://your-backend-url.com';\n```\n\n## 🚀 Deployment\n\n### 🔥 Firebase Deployment (Frontend)\n\nDeploy your React frontend to Firebase Hosting for free:\n\n#### 1. 📦 Build the React App\n\n```bash\ncd todo-frontend\nnpm run build\n```\n\n#### 2. 🔧 Set Up Firebase Hosting\n\nInstall Firebase CLI and login (one-time setup):\n\n```bash\n# Install Firebase CLI globally\nnpm install -g firebase-tools\n\n# Login to Firebase\nfirebase login\n```\n\n#### 3. 🎯 Initialize Firebase\n\n```bash\ncd todo-frontend\nfirebase init\n```\n\n**Configuration Options:**\n- ❓ **Which Firebase features?** → Select \"Hosting\"\n- ❓ **Select a default Firebase project** → Choose existing or create new project\n- ❓ **Public directory** → Enter: `build`\n- ❓ **Configure as single-page app?** → **Yes**\n- ❓ **Set up automatic builds with GitHub?** → **No** (for now)\n- 🚫 **Don't overwrite** `index.html` if prompted\n\nThis creates a `firebase.json` file:\n\n```json\n{\n  \"hosting\": {\n    \"public\": \"build\",\n    \"ignore\": [\n      \"firebase.json\",\n      \"**/.*\",\n      \"**/node_modules/**\"\n    ],\n    \"rewrites\": [\n      {\n        \"source\": \"**\",\n        \"destination\": \"/index.html\"\n      }\n    ]\n  }\n}\n```\n\n#### 4. 🚀 Deploy to Firebase\n\n```bash\nfirebase deploy\n```\n\nAfter deployment, you'll get a live URL:\n```\n✅ Deploy complete!\n\nProject Console: https://console.firebase.google.com/project/taskify-todo-app\nHosting URL: https://taskify-todo-app.web.app\n```\n\n#### 5. 🔄 Future Deployments\n\nFor subsequent deployments:\n\n```bash\n# Build the latest changes\nnpm run build\n\n# Deploy to Firebase\nfirebase deploy\n```\n\n### 🚂 Backend Deployment (Render)\n\nDeploy your FastAPI backend easily using [Render](https://render.com):\n\n## 🐛 Troubleshooting\n\n### Common Issues\n\n#### 1. MongoDB Connection Error\n```\npymongo.errors.ServerSelectionTimeoutError\n```\n**Solution**: Make sure MongoDB is running and the connection string is correct.\n\n#### 2. CORS Error\n```\nAccess to fetch at 'http://localhost:8000' from origin 'http://localhost:3000' has been blocked by CORS policy\n```\n**Solution**: Ensure CORS middleware is properly configured in `main.py`.\n\n#### 3. Firebase Deployment - Blank Page\n**Solution**: \n- Ensure `\"public\": \"build\"` in `firebase.json`\n- Check SPA rewrite rule exists\n- Clear browser cache\n\n#### 4. Port Already in Use\n```\nOSError: [Errno 48] Address already in use\n```\n**Solution**: Kill the process using the port or use a different port:\n```bash\n# Kill process on port 8000\nlsof -ti:8000 | xargs kill -9\n\n# Or use different port\nuvicorn main:app --reload --port 8001\n```\n\n### Debug Mode\n\nEnable debug mode by setting `DEBUG=True` in `.env` file or running:\n\n```bash\nuvicorn main:app --reload --log-level debug\n```\n\n## 📚 API Documentation\n\nFastAPI automatically generates interactive API documentation:\n\n- **Swagger UI**: http://localhost:8000/docs\n- **ReDoc**: http://localhost:8000/redoc\n\nThese interfaces allow you to:\n- Explore all available endpoints\n- Test API calls directly from the browser\n- View request/response schemas\n- Download OpenAPI specification\n\n## 🧪 Testing\n\n### Backend Testing\n\n```bash\n# Install testing dependencies\npip install pytest httpx\n\n# Run tests\npytest\n```\n\n### Frontend Testing\n\n```bash\ncd todo-frontend\n\n# Run tests\nnpm test\n\n# Run tests with coverage\nnpm test -- --coverage\n```\n\n## 🤝 Contributing\n\n1. Fork the repository\n2. Create a feature branch (`git checkout -b feature/amazing-feature`)\n3. Commit your changes (`git commit -m 'Add some amazing feature'`)\n4. Push to the branch (`git push origin feature/amazing-feature`)\n5. Open a Pull Request\n\n## 📝 License\n\nThis project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.\n\n## 👨‍💻 Author\n\n**Simran Shaikh**\n- GitHub: [SimranShaikh20](https://github.com/SimranShaikh20)\n- Project: [Taskify](https://github.com/SimranShaikh20/taskify)\n\n## 🙏 Acknowledgments\n\n- [FastAPI](https://fastapi.tiangolo.com/) for the amazing Python web framework\n- [React](https://reactjs.org/) for the powerful frontend library\n- [MongoDB](https://www.mongodb.com/) for the flexible database solution\n- [Tailwind CSS](https://tailwindcss.com/) for the utility-first CSS framework\n- [Lucide](https://lucide.dev/) for the beautiful icons\n- [Firebase](https://firebase.google.com/) for free and reliable hosting\n\n---\n\n⭐ **If you found Taskify helpful, please give it a star!** ⭐\n\n🌐 **Live Demo**: [App](https://taskify-1e72c.web.app/)","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsimranshaikh20%2Ftaskify","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsimranshaikh20%2Ftaskify","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsimranshaikh20%2Ftaskify/lists"}