This is an OFFLINE-FIRST Progressive Web Application (PWA). Designed to provide an uninterrupted user experience even without an internet connection. This project is a web application for task management. Featuring a responsive design and an "Offline First" approach, it enables users to create, edit, delete, and sync tasks, maintaining productivity even without an active internet connection. 📱 Demo Aqui
- Task Creation: Add new tasks to your list.
- Task Editing: Update the content of an existing task.
- Task Deletion: Remove tasks that are no longer needed.
- Offline Sync: Changes made offline are synchronized when the connection is reestablished.
- Connection Status Indicator: View your connection status (Online/Offline).
- Responsive Design: The interface adapts to different screen sizes.
- HTML5
- CSS3
- JavaScript (ES6+)
- Service Workers for caching and offline resources
- LocalStorage for local data storage
- Base URL:
https://[URL]/api/v1
- Content-Type:
application/json
- URI:
/create.php
- Method:
POST
- Description: This endpoint creates a new task in the application.
Parameters:
- text: Required. The text of the task.
- status: Optional. The status of the task. Valid values are "pending" or "completed". Defaults to "pending".
Body:
{
"text": "Task text",
"status": "pending"
}
Status: 200 OK
{
"message": "Task was created.",
"id": 123
}
- 400 Bad Request: Invalid data (e.g., missing "text" field).
- 500 Internal Server Error: Unexpected server error.
Status: 400 Bad Request
{
"message": "Incomplete data. Please provide the 'text' field."
}
OR
{
"message": "Invalid status. Please provide 'pending' or 'completed'."
}
Status: 500 Internal Server Error
{
"message": "Unable to create task."
}
OR
{
"message": "Internal server error."
}
- The request body must be a valid JSON object.
- The "text" field is required.
- The "status" field is optional and defaults to "pending".
- The response body is a JSON object with the following properties:
- message: A message indicating the success or failure of the request;
- id: The ID of the created task.
- URI:
/read.php
- Method:
GET
- Description: This endpoint retrieves all tasks from the application.
Status: 200 OK
[
{
"id": 1,
"text": "Task 1",
"status": "pending",
"created_at": "2024-01-26 17:37:00"
},
{
"id": 2,
"text": "Task 2",
"status": "completed",
"created_at": "2024-01-25 10:00:00"
}
]
- 500 Internal Server Error: Unexpected server error.
Status: 500 Internal Server Error
{
"message": "Failed to retrieve tasks."
}
- The response body is a JSON array of tasks.
- Each task object has the following properties:
- id: The ID of the task.
- text: The text of the task.
- status: The status of the task (pending or completed).
- created_at: The date and time when the task was created.
- URI:
/read_single.php
- Method:
GET
- Description: This endpoint retrieves a specific task by its ID.
Parameters:
- id: Required. The ID of the task to retrieve.
Status: 200 OK
{
"id": 1,
"text": "Task 1",
"status": "pending",
"created_at": "2024-01-26 17:37:00",
"updated_at": "2024-01-26 17:45:00"
}
- 400 Bad Request: ID not provided.
- 404 Not Found: Task not found.
- 500 Internal Server Error: Unexpected server error.
Status: 400 Bad Request
{
"message": "ID not provided"
}
Status: 404 Not Found
{
"message": "Task not found."
}
Status: 500 Internal Server Error
{
"message": "Failed to retrieve task."
}
- The id parameter must be provided in the query string.
- The response body is a JSON object containing the task details.
- The task object has the following properties:
- id: The ID of the task.
- text: The text of the task.
- status: The status of the task (pending or completed).
- created_at: The date and time when the task was created.
- updated_at: The date and time when the task was last updated.
- URI:
/update.php
- Method:
PUT
- Description: This endpoint updates an existing task in the application.
Parameters:
- id: Required. The ID of the task to update.
- text: Optional. The new text for the task.
- status: Optional. The new status for the task. Valid values are "pending" or "completed".
Body:
{
"id": 123,
"text": "Updated task text",
"status": "completed"
}
Status: 200 OK
{
"message": "Task was updated."
}
- 400 Bad Request: Incomplete or invalid data.
- 404 Not Found: Task not found.
- 500 Internal Server Error: Unexpected server error.
Status: 400 Bad Request
{
"message": "Incomplete or invalid data."
}
Status: 404 Not Found
{
"message": "Task not found."
}
Status: 500 Internal Server Error
{
"message": "Unable to update task."
}
- The id parameter is required and must be a valid integer.
- The text and status parameters are optional.
- The response body is a JSON object with a success message.
- The endpoint uses prepared statements to prevent SQL injection attacks.
- The endpoint validates the status field to ensure it's either "pending" or "completed".
- URI:
/update_single.php
- Method:
PATCH
- Description: This endpoint updates specific fields of a single task in the application.
Parameters:
- id: Required. The ID of the task to update.
- text: Optional. The new text for the task.
- status: Optional. The new status for the task. Valid values are "pending" or "completed".
Body:
{
"id": 123,
"text": "Updated task text",
"status": "completed"
}
Status: 200 OK
{
"message": "Task was updated.",
"updated_at": "2024-01-26 22:45:00"
}
- 400 Bad Request: Incomplete or invalid data.
- 404 Not Found: Task not found.
- 500 Internal Server Error: Unexpected server error.
Status: 400 Bad Request
{
"message": "Incomplete or invalid data."
}
Status: 404 Not Found
{
"message": "Task not found."
}
Status: 500 Internal Server Error
{
"message": "Unable to update task."
}
- The id parameter is required and must be a valid integer.
- The text and status parameters are optional, but one of them must be chosen to change.
- The endpoint only updates the fields that are provided in the request body.
- The response body includes the updated updated_at timestamp.
- The endpoint uses prepared statements to prevent SQL injection attacks.
- The endpoint validates the status field to ensure it's either "pending" or "completed".
- URI:
/delete.php
- Method:
DELETE
- Description: This endpoint allows you to remove an existing task from the application, keeping your to-do list organized.
Parameters:
- id: (Required) The unique identifier of the task to be deleted.
Body:
{
"id": 123
}
Status: 200 OK
{
"message": "Task was deleted."
}
- 400 Bad Request: Invalid data provided (e.g., missing or invalid "id" field).
- 404 Not Found: Task with the specified ID does not exist.
- 500 Internal Server Error: An unexpected error occurred on the server.
Status: 400 Bad Request
{
"message": "Incomplete or invalid data."
}
Status: 404 Not Found
{
"message": "Task with the specified ID does not exist."
}
Status: 500 Internal Server Error
{
"message": "Unable to delete task."
}
OR
{
"message": "Failed to delete task."
}
- The request body must contain a valid JSON object with the id field.
- The id field must be a valid integer representing an existing task.
- The response body provides a message indicating the outcome of the deletion request.
This project is under the MIT license. See the LICENSE
file for more details.