Cuadratic - Prueba tecnica Aldazabal & Cia.

Tecnnologias

• React
• Next.js
• Typescript
• TailwindCSS
• React query
• Postgres
• Docker

Instalacion

1. Clonar el repositorio
2. Instalar las dependencias con npm install
3. Correr el docker de postgres con docker-compose up -d
4. Correr el script de setup de la base de datos
5. Correr el programa con npm run dev

Script para crear la base de datos y la tabla de tareas

CREATE TABLE tasks (
  id SERIAL PRIMARY KEY,
  title VARCHAR(255) NOT NULL
);

INSERT INTO tasks (title) VALUES ('Tarea 1');
INSERT INTO tasks (title) VALUES ('Tarea 2');
INSERT INTO tasks (title) VALUES ('Tarea 3');

Links comodos

• Documentacion de React Query
• Documentacion de TailwindCSS
• Documentacion de Next.js
• Documentacion de pg (libreria para consultas al postgres)

Tareas

1. Crear un esqueleto basico de la aplicacion

Hacer los componentes y el layout basico de la aplicacion leyendo las tareas de la base de datos

Necesario:

• Editar la base de datos para almacenar el estado y fecha de las tareas
• Crear el endpoint para obtener las tareas
• Crear el componente de tareas
• Crear el componente de tareas individuales
• Crear el componente de layout

2. Agregar, borrar y editar tareas

Poder editar y crear tareas nuevas en la aplicacion

Necesario:

• Crear un endpoint para agregar tareas
• Crear un endpoint para editar tareas
• Crear un endpoint para borrar tareas
• Crear el componente de formulario
• Modificar el componente de tareas para poder editarlas/borrarlas
• Actualizar las tareas luego de ser agregadas/editadas

3. Tareas por usuario

Hasta ahora las tareas eran "globales" y cualquiera veia todas las tareas, para el siguiente paso vamos a hacer que las tareas sean por usuario.

El usuario crea poniendo el username y aprentando "Login", no es necesaria una contraseña, ni registro previo, ni queda guardada la sesion en cookies (solo un useState de la app).

Mientras el usuario no esta registrado, no ve ninguna tarea ni puede crearlas

Necesario:

• Crear el componente donde se especifica el username y almacenar el valor de login
• Actualizar la tabla de tareas para que tenga un campo de usuario
• Actualizar los endpoints para que las tareas sean por usuario
• Hacer que no se pueda crear tareas si no estas logeado

4. Ordenamiento

Agregar la posibilidad de ordenar las tareas por fecha y por estado

Necesario:

• Agregar un campo de fecha a las tareas
• Agregar un select para ordenar las tareas

5. Agregar delay y optimistic

Vamos a fingir delay en los endpoints para mas realismo, pero para mantener la aplicacion rapida vamos a usar optimistic updates con react query

Necesario:

• Agregar un input donde se pueda poner el delay
• Que los endpoints reciban este delay como parametro y lo fingan con un sleep
• Agregar optimistic updates a la lista de tareas para mantener la responsiness