{"id":24579957,"url":"https://github.com/razor-eng/taskmanager_springboot","last_synced_at":"2026-07-15T19:06:52.016Z","repository":{"id":272300805,"uuid":"916117734","full_name":"Razor-eng/TaskManager_SpringBoot","owner":"Razor-eng","description":null,"archived":false,"fork":false,"pushed_at":"2025-01-13T14:32:41.000Z","size":21,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-24T01:29:39.019Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"Java","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/Razor-eng.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-13T13:45:28.000Z","updated_at":"2025-01-13T14:32:44.000Z","dependencies_parsed_at":"2025-01-13T15:39:20.595Z","dependency_job_id":"fde4c970-b835-44d0-b395-7528b43fd3b2","html_url":"https://github.com/Razor-eng/TaskManager_SpringBoot","commit_stats":null,"previous_names":["razor-eng/taskmanager_springboot"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Razor-eng%2FTaskManager_SpringBoot","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Razor-eng%2FTaskManager_SpringBoot/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Razor-eng%2FTaskManager_SpringBoot/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Razor-eng%2FTaskManager_SpringBoot/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Razor-eng","download_url":"https://codeload.github.com/Razor-eng/TaskManager_SpringBoot/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244056426,"owners_count":20390720,"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":[],"created_at":"2025-01-24T01:30:10.769Z","updated_at":"2025-10-18T22:06:02.460Z","avatar_url":"https://github.com/Razor-eng.png","language":"Java","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Full-Stack Task Manager Application: Spring Boot Backend with React Frontend\n\n## Overview\n\nThis project is a full-stack Task Manager application consisting of a Spring Boot backend and a React frontend. It includes features like environment-specific configurations, task management, user interactions, and is ready for deployment.\n\n---\n\n## Backend Setup (Spring Boot with MySQL)\n\n### 1. Set Up Spring Boot Project\n\n- The following dependencies were used:\n  - Spring Web\n  - Spring Data JPA\n  - MySQL Driver\n  - Lombok (Optional, for concise code)\n\n### 2. Configure Environment Properties\n\n- Two `application.properties` files were created:\n  - `application-dev.properties` for the development environment.\n  - `application-prod.properties` for the production environment.\n- These properties include configuration details for the database URL, username, password, and logging levels.\n\nExample:\n\n```properties\n# application-dev.properties\nspring.datasource.url=jdbc:mysql://localhost:3306/dev_taskmanager_db\nspring.datasource.username=root\nspring.datasource.password=dev_password\nspring.jpa.hibernate.ddl-auto=update\n\n# application-prod.properties\nspring.datasource.url=jdbc:mysql://prod-db-host:3306/prod_taskmanager_db\nspring.datasource.username=prod_user\nspring.datasource.password=prod_password\nspring.jpa.hibernate.ddl-auto=none\n```\n\n### 3. Developed API Endpoints\n\n- RESTful APIs were created using Spring Web.\n- Spring Data JPA was used to interact with the database.\n\nExample API:\n\n```java\n@RestController\n@RequestMapping(\"/api/tasks\")\npublic class TaskController {\n    @Autowired\n    private TaskService taskService;\n\n    @GetMapping\n    public List\u003cTask\u003e getAllTasks() {\n        return taskService.getAllTasks();\n    }\n\n    @PostMapping\n    public Task createTask(@RequestBody Task task) {\n        return taskService.saveTask(task);\n    }\n\n    @PutMapping(\"/{id}\")\n    public Task updateTask(@PathVariable Long id, @RequestBody Task task) {\n        return taskService.updateTask(id, task);\n    }\n\n    @DeleteMapping(\"/{id}\")\n    public void deleteTask(@PathVariable Long id) {\n        taskService.deleteTask(id);\n    }\n}\n```\n\n---\n\n## Frontend Setup (React)\n\n### 1. Set Up Project\n\n- `create-react-app` was used to bootstrap the React project:\n  ```bash\n  npx create-react-app taskmanager-frontend\n  ```\n\n### 2. Created Components\n\n- The UI was divided into components like `TaskList`, `TaskForm`, and `TaskItem`.\n\n### 3. Fetch Data from Backend\n\n- Axios was used to make API calls from the frontend to the backend.\n\nReact Example:\n\n```javascript\nimport axios from \"axios\";\nimport { useEffect, useState } from \"react\";\n\nfunction TaskList() {\n  const [tasks, setTasks] = useState([]);\n\n  useEffect(() =\u003e {\n    axios\n      .get(\"http://localhost:8080/api/tasks\")\n      .then((response) =\u003e setTasks(response.data))\n      .catch((error) =\u003e console.error(error));\n  }, []);\n\n  return (\n    \u003cdiv\u003e\n      {tasks.map((task) =\u003e (\n        \u003cdiv key={task.id}\u003e{task.title}\u003c/div\u003e\n      ))}\n    \u003c/div\u003e\n  );\n}\n\nexport default TaskList;\n```\n\n### 4. Display Data\n\n- The fetched data was rendered in the UI using JSX and styled with React Bootstrap.\n\nReact Example:\n\n```javascript\nreturn (\n  \u003cdiv className=\"task-list\"\u003e\n    {tasks.map((task) =\u003e (\n      \u003cdiv key={task.id} className=\"task-item\"\u003e\n        \u003ch4\u003e{task.title}\u003c/h4\u003e\n        \u003cp\u003e{task.description}\u003c/p\u003e\n      \u003c/div\u003e\n    ))}\n  \u003c/div\u003e\n);\n```\n\n### 5. Handle User Interactions\n\n- Event handlers were implemented to allow actions like adding, updating, or deleting tasks.\n- Appropriate API calls were made to update the backend and refresh the UI.\n\nExample:\n\n```javascript\nconst deleteTask = (id) =\u003e {\n  axios\n    .delete(`http://localhost:8080/api/tasks/${id}`)\n    .then(() =\u003e setTasks(tasks.filter((task) =\u003e task.id !== id)))\n    .catch((error) =\u003e console.error(error));\n};\n```\n\n---\n\n## Additional Considerations\n\n### 1. Authentication and Authorization\n\n- Security mechanisms were implemented using Spring Security (backend) and JWT.\n\n### 2. Error Handling\n\n- Backend: Meaningful error messages with appropriate HTTP status codes were returned.\n- Frontend: User-friendly error messages were displayed.\n\n### 3. Testing\n\n- Unit and integration tests were written for backend APIs.\n- For React components, Jest was used to ensure proper functionality.\n\n### 4. Deployment\n\n- **Backend**: The backend was deployed using Docker and hosted on a cloud service like AWS, Azure, or Heroku.\n- **Frontend**: The frontend was deployed on Vercel for easy hosting.\n\n### 5. Continuous Integration and Continuous Delivery (CI/CD)\n\n- CI/CD pipelines were set up using GitHub Actions to automate build, test, and deployment processes.\n\n---\n\n## Example Directory Structure\n\n### Backend\n\n```\nbackend/\n|-- src/\n|   |-- main/\n|   |   |-- java/com/example/fullstack/\n|   |   |   |-- config/\n|   |   |   |-- controller/\n|   |   |   |-- exception/\n|   |   |   |-- model/\n|   |   |   |-- repository/\n|   |   |   |-- security/\n|   |   |   |-- service/\n|   |   |   |-- FullstackAppApplication.java\n|   |-- resources/\n|       |-- application.properties\n|       |-- application-dev.properties\n|       |-- application-prod.properties\n```\n\n### Frontend\n\n#### React\n\n```\nfrontend/\n|-- src/\n|   |-- components/\n|       |-- TaskList.js\n|       |-- TaskForm.js\n|   |-- services/\n|       |-- api.js\n|   |-- App.js\n```\n\n---\n\n## Conclusion\n\nA full-stack Task Manager application was built using a Spring Boot backend and a React frontend. This README provides a guide to the features, setup, and deployment steps for the project.\n\n---\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frazor-eng%2Ftaskmanager_springboot","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frazor-eng%2Ftaskmanager_springboot","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frazor-eng%2Ftaskmanager_springboot/lists"}