Skip to content

magamahe/Task-App

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

✅ Task-App – Full Stack Task Manager

Task-App es una aplicación Full Stack para la gestión de tareas (To-Do List) que demuestra el dominio del flujo de datos completo: desde la interfaz de usuario dinámica hasta la persistencia en bases de datos NoSQL.

LINK RENDER:https://task-app-n091.onrender.com/

🚀 Tech Stack

Backend

Node.js Express MongoDB Mongoose

Frontend

HTML5 JavaScript Tailwind CSS


✨ Features

  • Gestión Integral de Tareas: CRUD completo (Crear, Leer, Actualizar y Eliminar).
  • Control de Estado: Posibilidad de marcar tareas como completadas/pendientes.
  • Modo Oscuro/Claro: Interfaz adaptativa con persistencia en localStorage.
  • API RESTful: Endpoints estructurados para operaciones seguras de datos.
  • Validación de Esquemas: Uso de Mongoose para asegurar la integridad de las tareas.

🧩 Architecture Overview

La aplicación utiliza una arquitectura desacoplada:

  • Client: Desarrollado en Vanilla JS para demostrar lógica pura de manipulación del DOM y consumo de APIs mediante fetch.
  • Server: API construida con Node.js/Express bajo un patrón de rutas y modelos.
  • Database: MongoDB Atlas para almacenamiento persistente y escalable.

📂 Project Structure

📂task-app/
├── 📂backend/
│   ├── 📂models/Task.js        # Esquema de Mongoose (title, description, completed)
│   ├── 📂routes/taskRoutes.js  # Endpoints de la API
│   ├── .env                    # Configuración de variables (MONGO_URI)
│   └── index.js                # Entrada del servidor
├── 📂public/
│   ├── index.html              # Estructura con Tailwind CSS
│   ├── 📂js/script.js          # Lógica de estados y modo oscuro
│   └── 📂css/styles.css        # Estilos personalizados
└── package.json

## Getting Started

1️⃣ Clone the repository

git clone https://github.com/magamahe/Task-App.git cd Task-App/backend


2️⃣ Install dependencies

npm install


3️⃣ Environment variables
Create a **.env** file inside backend:

PORT=3000

4️⃣ Run the application

npm run dev

or

npm start

5️⃣ Open in your browser

http://localhost:3000


## API

| Method | Endpoint            | Description          |
| ------ | ------------------- | -------------------- |
| GET    | `/api/tasks`        | Get all tasks        |
| POST   | `/api/tasks`        | Create a new task    |
| PUT    | `/api/tasks/:id`    | Update a task        |
| DELETE | `/api/tasks/:id`    | Delete a task        |

🎯 Why this project?

- This project was built to demonstrate:
- Real backend development with Node.js and Express
- Database modeling and validation with MongoDB & Mongoose
- Frontend-backend integration without frameworks
- Clean code and scalable architecture

## 👥 Autor
**Martínez Herrero, María Gabriela**
Backend & Frontend Developer – Argentina

<p>
  <a href="https://github.com/magamahe" target="_blank">
    <img src="https://cdn.jsdelivr.net/gh/devicons/devicon/icons/github/github-original.svg" width="32"/>
  </a>
  &nbsp;
  <a href="https://linkedin.com/in/magamahe" target="_blank">
    <img src="https://cdn.jsdelivr.net/gh/devicons/devicon/icons/linkedin/linkedin-original.svg" width="32"/>
  </a>
  &nbsp;
  <a href="mailto:magamahe@gmail.com">
    <img src="https://cdn-icons-png.flaticon.com/512/732/732200.png" width="32"/>
  </a>
</p> 

About

Agenda tus tareas a realizar, modificar, eliminar y completar

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published