{"id":24247133,"url":"https://github.com/kartikk-26/dockerized-to-do-app","last_synced_at":"2026-04-20T13:05:20.983Z","repository":{"id":271865845,"uuid":"914806497","full_name":"Kartikk-26/Dockerized-To-Do-App","owner":"Kartikk-26","description":"A To-Do List app featuring a Node.js backend and React frontend. Docker is used to containerize both services, allowing for easy deployment and management via Docker Compose.","archived":false,"fork":false,"pushed_at":"2025-01-10T11:02:29.000Z","size":474,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-04T15:48:14.679Z","etag":null,"topics":["docker","docker-compose","docker-container","dockerfile"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","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/Kartikk-26.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}},"created_at":"2025-01-10T10:47:41.000Z","updated_at":"2025-01-12T08:07:29.000Z","dependencies_parsed_at":"2025-01-10T12:35:11.452Z","dependency_job_id":null,"html_url":"https://github.com/Kartikk-26/Dockerized-To-Do-App","commit_stats":null,"previous_names":["kartikk-26/dockerized-to-do-app-"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Kartikk-26/Dockerized-To-Do-App","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Kartikk-26%2FDockerized-To-Do-App","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Kartikk-26%2FDockerized-To-Do-App/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Kartikk-26%2FDockerized-To-Do-App/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Kartikk-26%2FDockerized-To-Do-App/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Kartikk-26","download_url":"https://codeload.github.com/Kartikk-26/Dockerized-To-Do-App/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Kartikk-26%2FDockerized-To-Do-App/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":263219116,"owners_count":23432607,"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","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":["docker","docker-compose","docker-container","dockerfile"],"created_at":"2025-01-14T23:18:15.340Z","updated_at":"2026-04-20T13:05:20.954Z","avatar_url":"https://github.com/Kartikk-26.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n---\n\n# 🚀 To-Do App (Dockerized) 📝\n\nThis is a simple **To-Do List Application** with a **frontend** built using **React.js** and a **backend** using **Node.js**. The application is **Dockerized** using **Docker Compose** to manage the containers for both frontend and backend.\n\n## ✨ **Features** \n- Add, edit, and delete tasks.\n- Persistent task data stored in the backend (without MongoDB, using a simple in-memory store).\n- Fully dockerized application with frontend served using React and backend using Node.js.\n\n---\n\n## 🛠️ **Technologies Used** \n\n### Frontend:\n- **React.js** for building the user interface.\n- **Material-UI** for UI components and styling.\n- **Axios** for making API calls to the backend.\n\n### Backend:\n- **Node.js** as the runtime for backend development.\n- **Express.js** for building the RESTful API.\n- **CORS** for handling cross-origin requests.\n\n### Docker:\n- **Docker Compose** for managing both frontend and backend containers.\n\n---\n\n## 📂 **Folder Structure**\n\n```\nTo-Do-App/\n│\n├── Assets/                      # New folder for images\n│   ├── DockerHub.png            # DockerHub image\n│   └── To-Do-List-APP.png       # To-Do List App image\n│\n├── backend/                     # Backend directory (Node.js API)\n│   ├── .gitignore               # Git ignore file for backend\n│   ├── Dockerfile               # Dockerfile for the backend\n│   ├── index.js                 # Backend Node.js server\n│   ├── package.json             # Backend dependencies\n│   ├── package-lock.json        # Backend lock file\n│   ├── server.js                # Backend server\n│   └── todos.json               # Todo data file (JSON)\n│\n├── frontend/                    # Frontend directory (React app)\n│   ├── .gitignore               # Git ignore file for frontend\n│   ├── Dockerfile               # Dockerfile for the frontend\n│   ├── README.md                # Frontend readme file\n│   ├── package-lock.json        # Frontend lock file\n│   ├── package.json             # Frontend dependencies\n│   ├── public/                  # Public folder (React)\n│   │   ├── favicon.ico          # React app favicon\n│   │   ├── index.html           # Main HTML file\n│   │   ├── logo192.png          # Logo image for React\n│   │   ├── logo512.png          # Logo image for React\n│   │   ├── manifest.json        # App manifest\n│   │   └── robots.txt           # Robots.txt file\n│   └── src/                     # Source folder (React components)\n│       ├── App.css              # App CSS\n│       ├── App.js               # App component\n│       ├── App.test.js          # App tests\n│       ├── components/          # React components\n│       │   └── TodoList.js      # Todo List component\n│       ├── index.css            # Main CSS for the React app\n│       ├── index.js             # Entry point for React\n│       ├── logo.svg             # React logo\n│       ├── reportWebVitals.js   # Web vitals for performance metrics\n│       └── setupTests.js        # Test setup\n│\n├── docker-compose.yml           # Docker Compose file for backend \u0026 frontend\n├── package-lock.json            # Lock file for the entire project\n└── package.json                 # Dependencies for the entire project (if applicable)\n└── README.md                    # Project documentation (root-level)\n\n```\n\n---\n\n## 🏡 **Setting Up the Project Locally** \n\nTo run this project locally, follow these steps:\n\n### 📥 **Step 1 : Clone the Repository**\nClone the repository to your local machine:\n\n```bash\ngit clone :  https://github.com/Kartikk-26/Dockerized-To-Do-App-.git\ncd To-Do-App\n```\n\n###  🐋 **Step 2: Install Docker**\n\nIf you haven't installed **Docker** on your machine yet, you can download it from [here](https://www.docker.com/products/docker-desktop).\n\n### 🏗️ **Step 3: Build the Docker Containers**\n\nRun the following command to build the frontend and backend Docker containers:\n\n```bash\ndocker-compose build\n```\n\n### ▶️ **Step 4: Run the Application**\n\nAfter building the containers, start the application by running:\n\n```bash\ndocker-compose up\n```\n\nThis will start both the frontend and backend services.\n\n- The frontend will be available at `http://localhost:3000`.\n- The backend will be available at `http://localhost:5000`.\n\n---\n\n## ⏹️ **Stop the Application**\n\nTo stop the containers, run:\n\n```bash\ndocker-compose down\n```\n\n---\n\n## 🛠️ **Dockerized Services**\n\n- **Backend**: The backend service is built using **Node.js** and **Express**. It handles task CRUD operations and serves the API at `http://localhost:5000`.\n  \n- **Frontend**: The frontend service is built using **React.js**. It interacts with the backend API to display and manage tasks. It is served at `http://localhost:3000`.\n\n---\n\n## 🌐 **Ports Mapping**\n\n- **Frontend** is mapped to `localhost:3000`.\n- **Backend** is mapped to `localhost:5000`.\n\n---\n\n## 📋 **To-Do App Functionality**\n\n1. **Add a Task**: Type the task in the input field and click \"Add Task\" to save it.\n2. **Delete a Task**: Click on the trash icon next to any task to remove it from the list.\n3. **Edit a Task**: Update an existing task and hit \"Save\".\n\n---\n\n## ⚙️ **Customization**\n\nYou can modify the `docker-compose.yml` file to use different ports or customize other services as needed.\n\n---\n\n### Example Screenshot 📸:\n-\u003e Docker-Hub-Record\n![Docker-Hub](./Assets/DockerHub.png)\n\n-\u003e To-Do-List-Application\n![To-Do App Screenshot](./Assets/To-Do-List-APP.png)\n\n---\n\n## 💡 Connect with Me\n\nStay connected on [LinkedIn](https://www.linkedin.com/in/-kartikjain/) to see more projects and improvements as I continue my learning journey. \n\nLet's collaborate and create impactful web applications! \n\n---","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkartikk-26%2Fdockerized-to-do-app","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkartikk-26%2Fdockerized-to-do-app","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkartikk-26%2Fdockerized-to-do-app/lists"}