A comprehensive task management system was built using Spring Boot for the back end and React with Tailwind CSS and MUI for the front end. The system supports two types of users: Admin and Employee/Helper.
- Create and Manage Tasks: Admins can create tasks with a title, description, image URL, and deadline.
- Assign Tasks: Tasks can be assigned to any registered users within the project.
- Task Management: Admins can view task submissions, with the ability to accept, reject, or reassign tasks.
- Task Filtering: Admins can filter tasks by categories such as All, Assigned, Unassigned, Pending, and Completed.
- Task Submission: Employees can submit their work for tasks by providing the task ID and repository URL.
- View Assigned Tasks: Employees can view tasks assigned to them, as well as their submissions.
- Used industry-leading technologies such as Spring Boot for backend development, Microservices architecture for modular service management, Kafka for real-time notifications, Eureka Server for service discovery, and API Gateway as the central entry point.
- Additionally, integrated OpenFeign for inter-service communication, Swagger for API documentation, JWT & Spring Security for authentication and authorization, and Redis Caching for performance optimization.
- Frontend technologies include React for UI management, styled with Tailwind CSS and Material-UI for pre-built, customizable components. The system also employs Zipkin for distributed tracing, Resilience4J for fault tolerance, and AWS S3 for file storage.
-
Spring Boot: The core framework for building the backend services.
-
Microservices:
-
Eureka Server: Manages service discovery, ensuring all microservices are running and healthy, with load balancing support.
- Since we have added the eureka server in api gateway, we can access it directly from the api gateway endpoint: https://localhost:5000/eureka/web
- <img width="960" alt="image" src="
-
Kafka: Kafka Service for real-time notification.
- Implemented Kafka for real-time notifications, where the Task Service produces messages whenever a task is assigned. The Notification Service consumes these messages to send timely email notifications to users, ensuring immediate and effective communication of task assignments
-
API Gateway: Serves as the entry point for all microservices.
- All the API endpoints are accessible with port 5000.
-
OpenFeign: Facilitates communication between microservices.
-
Swagger: Provides an interactive interface to access and test API endpoints.
-
JWT & Spring Security: Implements authentication and role-based authorization.
-
Redis Caching: API-level caching to optimize performance by reducing repeated calls to controllers.
-
Filters:
- CorrelationId Filter: Adds a mandatory header for tracking requests in logs.
- Correlation header should be added with each request. This id can be used to check the logs and easily detect the error for a particular request.
- Auth Filter: Manages user authentication.
- Except Login and register endpoint, each request should have Auth header included or else a 401 error will be returned.
- Redis Cache Filter: Handles API-level caching.
- If data is present in the cache then it should be returned directly from the middleware, or else it should continue the flow and the returned response should be added to the cache for the next request to this endpoint.
- CorrelationId Filter: Adds a mandatory header for tracking requests in logs.
-
AOP (Aspect-Oriented Programming): Logs method calls before and after execution of every method in Controller, Service and Repo layer for ease of logging and tracking the flow of control.
-
AWS S3: Stores user profile images.
-
Email Verification: Validates user email addresses upon registration.
-
Resilience4J implementation:
- Implemented Resilience4j to enhance fault tolerance in the application by incorporating
@CircuitBreakers
mechanisms for external service calls and additionally@Retry
and@TimeLimiter
can further be added for fine-grained control over fault tolerance.
- Implemented Resilience4j to enhance fault tolerance in the application by incorporating
-
Zipkin:
- React: Manages the state and UI of the application.
- Tailwind CSS: Provides utility-first CSS styling.
- MUI (Material-UI): Offers pre-built, customizable components for the user interface.
-
NavBar: Navigation bar for easy access to different sections.
-
Task: Displays task details.
-
TaskList: Shows a list of tasks based on filters.
-
Submissions: Allows employees to submit their work.
-
UserList: Displays a list of registered users.
-
Many other components were created to support the above primary components.
-
Admin View:
-
Customer View:
- Java 11 or higher
- Node.js
- npm or yarn
- Redis
- AWS account for S3
- Kafka
- Zipkins (docker)
-
Clone the Repository:
git clone https://github.com/yourusername/task-management-system.git cd task-management-system
-
Environment Variables:
Refer to the attached env.example file to check the environment variables used in the microservices.
-
Backend Setup:
- Navigate to each microservice directory and run:
./mvnw clean install
- Start the Eureka Server and API Gateway.
- Start each microservice.
- Navigate to each microservice directory and run:
-
Frontend Setup:
- Navigate to the frontend directory and install dependencies:
npm install
- Start the React application:
npm start
- Navigate to the frontend directory and install dependencies:
- Admin:: Log in as an admin to manage tasks and view submissions
- Customer: Log in as an employee to view assigned tasks and submit work