---
# System prepended metadata

title: '[Proyecto final] Web salud mental.'

---

# [Proyecto final] Web salud mental.

:::info 
:bulb: El proyecto estará basado en una Web relacionada con el tema de salud mental, adicciones y la gestion de ellas.
:::


## :+1: Sobre el proyecto:

:::success
Tecnologías planificadas de uso en el proyecto:
:::

### :small_blue_diamond: Front: React / Redux, Sass, TypeScript.
### :small_blue_diamond: Back: MongoDB, NodeJS, TypeScript, Express, mongoose.
### :small_blue_diamond: Testing: Jest.

## 🤔 Objecciones.


### 1. ¿Como funcionará la web?  
La principial idea es que el usuario pueda asignar ciertas adicciones o condiciones mentales a la hora de registrarse, y que durante el día pueda ir "asignando" ciertos valores que por la noche le permitan hacer un computo global de ese día, y también compararlo con otros.
### 2. ¿Como podrás saber cuanto tiempo llevas sin consumir o relativo?
Se tratará de un simple contador de tiempo desde el momento en el que lo activas, que según pase el tiempo y llegue a ciertos valores de tiempo te proporcionen algún tipo de "recompensa" o felicitación.


## :100: Objetivos

### :small_blue_diamond: Semana 1: Backend & 100% testing, conexión con MongoDB y funcionamiento.
### :small_blue_diamond: Semana 2: Frontend, hacer el sistema Redux completo con llamadas a nuestro Back, con su respectivo testing.
### :small_blue_diamond: Semana 3: Finalización del proyecto, finalización de detalles, y tratar de implementar Cypress al testing ya hecho durante las semanas anteriores.

## 🗡: Modelos

### :small_blue_diamond: User: 
* Age: number,
* Name: string,
* profilePic?: string,
* NickName: string | number,
* timeWithout: date,
* Addictions?: Adiction[],
* Conditions?: Condition[],
* mood: States[]

### :small_blue_diamond: Adiction: 

* actualThing: string,
* Cause?: string,
* TimeConsuming: date,


### :small_blue_diamond: Condition: 


* actualCondition: string,
* Cause?: string,
* psychoHelp: boolean,

### :small_blue_diamond: States: 
*  States = "Happy" | "Sad" | "Angry" | "Excited" | "Calm"

## 🪕: Listado de responsabilidades: 

:small_blue_diamond: Componente NavBar:

Lo que renderiza: una barra de navegación con enlaces a diferentes páginas y a la información de la cuenta del usuario.

Cómo interactúa con el usuario: el usuario puede hacer clic en los enlaces para navegar a diferentes páginas.

Lo que recibe: no se necesitan props o contexto.

:small_blue_diamond: Componente LoginForm:

Lo que renderiza: un formulario de inicio de sesión para que el usuario ingrese sus credenciales.

Cómo interactúa con el usuario: el usuario puede ingresar su nombre de usuario y contraseña y hacer clic en el botón "Iniciar sesión" para enviar sus credenciales.

Lo que recibe:  un objeto "auth" del store de Redux, que contiene información de autenticación del usuario, como su estado de inicio de sesión y su token de acceso.

:small_blue_diamond: Componente SignUp:

Lo que renderiza: un formulario de registro para que el usuario cree una cuenta.

Cómo interactúa con el usuario: el usuario puede ingresar su nombre, correo electrónico, nombre de usuario y contraseña y hacer clic en el botón "Registrarse" para enviar su información.

Lo que recibe:  un objeto "auth" del store de Redux, que contiene información de autenticación del usuario, como su estado de inicio de sesión y su token de acceso.

:small_blue_diamond: Componente Dashboard:

Lo que renderiza: una página principal donde el usuario puede ver un resumen de su actividad diaria, incluyendo sus adicciones, estados de ánimo y condiciones.

Cómo interactúa con el usuario: el usuario puede hacer clic en diferentes elementos de la página para ver más detalles y estadísticas sobre su actividad diaria.

Lo que recibe: la información de la cuenta del usuario para mostrar su actividad diaria.

:small_blue_diamond: Componente AddictionDetails:

Lo que renderiza: una página que muestra detalles y estadísticas sobre una adicción específica del usuario.

Cómo interactúa con el usuario: el usuario puede ver gráficos y estadísticas sobre su consumo de la adicción seleccionada.

Lo que recibe: la información de la adicción seleccionada para mostrar detalles y estadísticas.

:small_blue_diamond: Componente ConditionDetails:

Lo que renderiza: una página que muestra detalles y estadísticas sobre una condición mental específica del usuario.

Cómo interactúa con el usuario: el usuario puede ver gráficos y estadísticas sobre la condición mental seleccionada.

Lo que recibe: la información de la condición mental seleccionada para mostrar detalles y estadísticas.

:small_blue_diamond: Componente HomePage:


Lo que renderiza: la página principal con información general sobre el proyecto y posibles opciones para el usuario.

Cómo interactúa con el usuario: el usuario puede añadir distintas adicciones, estados mentales y elegir su estado de animo actual.

Lo que recibe: no se necesitan props o contexto.

:small_blue_diamond: Componente Profile:

Lo que renderiza: la página de perfil del usuario con información sobre su cuenta y opciones para editarla.

Cómo interactúa con el usuario: el usuario puede editar su información de perfil y guardar los cambios.

Lo que recibe: información del usuario actual, como su nombre, imagen de perfil, etc.

:small_blue_diamond: Componente ConditionForm:

Lo que renderiza: un formulario para que el usuario pueda agregar una nueva condición a su lista de condiciones.

Cómo interactúa con el usuario: el usuario puede escribir el nombre de la condición y hacer clic en el botón "Agregar" para agregarla a la lista.

Lo que recibe: una función de callback para agregar la nueva condición a la lista.

:small_blue_diamond: Componente AddictionForm:

Lo que renderiza: un formulario para que el usuario pueda agregar una nueva adicción a su lista de adicciones.

Cómo interactúa con el usuario: el usuario puede escribir el nombre de la adicción y hacer clic en el botón "Agregar" para agregarla a la lista.

Lo que recibe: una función de callback para agregar la nueva adicción a la lista.

## 🦔Endpoints: 

:small_blue_diamond:Endpoints Adicciones:

Listar todas las adicciones: GET -> /addictions

Obtener detalles de una adicción: GET -> /addictions/:id

Crear una nueva adicción: POST -> /addictions

Actualizar información de una adicción: PATCH -> /addictions/:id

Eliminar una adicción: DELETE -> /addictions/:id

:small_blue_diamond:Endpoints de Condiciones mentales:

Listar todos los estados mentales: GET -> /states

Obtener detalles de un estado mental: GET -> /states/:id

Crear un nuevo estado mental: POST -> /states

Actualizar información de un estado mental: PATCH -> /states/:id

Eliminar un estado mental: DELETE -> /states/:id

:small_blue_diamond:Endpoints de Usuarios:

Listar todos los usuarios: GET -> /users

Obtener detalles de un usuario: GET -> /users/:id

Crear un nuevo usuario: POST -> /users/register

Iniciar sesion como usuario: POST -> /users/login

Actualizar información de un usuario: PATCH -> /users/:id

Eliminar un usuario: DELETE -> /users/:id