App: Task Manager

[hugo-cordoba]

[hugo-cordoba]

TaskManager Component

Summary

The TaskManager component is a standalone Angular component designed to manage a list of tasks. It includes functionality to add, display, and mark tasks as done. The component interacts with a backend REST API to fetch, create, update, and delete tasks.

Files Generated

1. Model: task.model.ts

   • Defines the structure of a Task object with properties such as id, name, description, and done.

2. Service: task.service.ts

   • Contains methods to interact with the backend REST API. This includes methods to get all tasks, add a new task, update an existing task, and delete a task.

3. Component Logic: taskmanager.component.ts

   • Contains the logic for the TaskManager component. This includes methods to handle user interactions, such as adding a new task, marking a task as done, and deleting a task.

4. Component HTML: taskmanager.component.html

   • Defines the structure of the TaskManager component's user interface. This includes a form to add new tasks and a table to display the list of tasks.

5. Component CSS: taskmanager.component.css

   • Contains the styles for the TaskManager component to ensure a clean and user-friendly interface.

OpenAPI Specification

openapi: 3.0.0
info:
  title: TaskManager API
  version: 1.0.0
paths:
  /tasks:
    get:
      summary: Get all tasks
      responses:
        '200':
          description: A list of tasks
          content:
            application/json:
              schema:
                type: array
                items:
                  $ref: '#/components/schemas/Task'
    post:
      summary: Add a new task
      requestBody:
        required: true
        content:
          application/json:
            schema:
              $ref: '#/components/schemas/Task'
      responses:
        '201':
          description: Task created
  /tasks/{id}:
    put:
      summary: Update an existing task
      parameters:
        - in: path
          name: id
          required: true
          schema:
            type: string
      requestBody:
        required: true
        content:
          application/json:
            schema:
              $ref: '#/components/schemas/Task'
      responses:
        '200':
          description: Task updated
    delete:
      summary: Delete a task
      parameters:
        - in: path
          name: id
          required: true
          schema:
            type: string
      responses:
        '204':
          description: Task deleted
components:
  schemas:
    Task:
      type: object
      properties:
        id:
          type: string
        name:
          type: string
        description:
          type: string
        done:
          type: boolean

This specification describes the necessary API endpoints for the TaskManager component to interact with the backend.