diff --git a/README.md b/README.md
index c737b2cd..fd062ad0 100644
--- a/README.md
+++ b/README.md
@@ -1,530 +1,79 @@
# Creando una Red Social
+##Desarrollado por Laura Garduño, Laura Buitrago y Sandra Corral.
+
## Índice
-* [1. Preámbulo](#1-preámbulo)
+* [1. Introducción al proyecto](#1-Introducción-al-proyecto)
* [2. Resumen del proyecto](#2-resumen-del-proyecto)
-* [3. Objetivos de aprendizaje](#3-objetivos-de-aprendizaje)
-* [4. Consideraciones generales](#4-consideraciones-generales)
-* [5. Criterios de aceptación mínimos del proyecto](#5-criterios-de-aceptación-mínimos-del-proyecto)
-* [6. Hacker edition](#6-hacker-edition)
-* [7. Entrega](#7-entrega)
-* [8. Pistas, tips y lecturas complementarias](#8-pistas-tips-y-lecturas-complementarias)
-
-## 1. Preámbulo
-
-Instagram, Snapchat, Twitter, Facebook, Twitch, Linkedin, etc. Las redes
-sociales han invadido nuestras vidas. Las amamos u odiamos, y muchos no podemos
-vivir sin ellas.
-
-
-
-Hay redes sociales de todo tipo y para todo tipo de intereses. Por ejemplo,
-en una ronda de financiamiento con inversionistas, se presentó una red social
-para químicos en la que los usuarios podían publicar artículos sobre sus
-investigaciones, comentar en los artículos de sus colegas, y filtrar artículos
-de acuerdo a determinadas etiquetas o su popularidad, lo más reciente, o lo
-más comentado.
-
-## 2. Resumen del proyecto
-
-En este proyecto construirás una Red Social sobre lo que decidan tú y tu equipo.
-Podría ser, por ejemplo, sobre alimentación saludable, feminismo, educación,
-salud, energías renovables, amantes de las [Empanadas](https://es.wikipedia.org/wiki/Empanada)
-o de los [Tacos de Canasta](https://es.wikipedia.org/wiki/Taco),
-de la [Feijoada](https://es.wikipedia.org/wiki/Feijoada), o de lo que sea.
-
-Tu Red Social tendrá que permitir a cualquier usuario crear una cuenta de acceso
-y loguearse con ella; crear, editar, borrar y _"likear"_ publicacciones.
-
-Por lo tanto, en este proyecto construirás una
-[Single-page Application (SPA)](https://es.wikipedia.org/wiki/Single-page_application)
-[_responsive_](https://curriculum.laboratoria.la/es/topics/css/02-responsive) (con más de una vista / página)
-en la que podamos **leer y escribir datos**.
-
-### Los objetivos generales de este proyecto son los siguientes
-
-* Desarrollar una SPA con temática de red social
-* Aplicar los conceptos de responsividad en el desarrollo de las vistas (templates)
-* Implementar un router para la navegación entre las diferentes vistas de la aplicación
-* Emplear un servicio externo para la persistencia de datos de la aplicación
-* Crear una suite de pruebas unitarias que permitan testear código asíncrono
-
-Para lograr estos objetivos, deberás aprender y hacer uso de las siguientes
-herramientas o habilidades técnicas:
-
-## 3. Objetivos de aprendizaje
-
-Reflexiona y luego marca los objetivos que has llegado a entender y aplicar en tu proyecto. Piensa en eso al decidir tu estrategia de trabajo.
-
-### HTML
-
-- [ ] **Uso de HTML semántico**
-
- Links
-
-### Web APIs
-
-- [ ] **Uso de selectores del DOM**
-
- Links
-
- * [Manipulación del DOM](https://curriculum.laboratoria.la/es/topics/browser/02-dom/03-1-dom-methods-selection)
- * [Introducción al DOM - MDN](https://developer.mozilla.org/es/docs/Web/API/Document_Object_Model/Introduction)
- * [Localizando elementos DOM usando selectores - MDN](https://developer.mozilla.org/es/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors)
-
-
-- [ ] **Manejo de eventos del DOM (listeners, propagación, delegación)**
-
- Links
-
- * [Objetos en JavaScript](https://curriculum.laboratoria.la/es/topics/javascript/05-objects/01-objects)
-
-
-- [ ] **Diferenciar entre tipos de datos primitivos y no primitivos**
-
-- [ ] **Variables (declaración, asignación, ámbito)**
-
- Links
-
- * [Valores, tipos de datos y operadores](https://curriculum.laboratoria.la/es/topics/javascript/01-basics/01-values-variables-and-types)
- * [Variables](https://curriculum.laboratoria.la/es/topics/javascript/01-basics/02-variables)
-
-
- * [Promise - MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Promise)
- * [How to Write a JavaScript Promise - freecodecamp (en inglés)](https://www.freecodecamp.org/news/how-to-write-a-javascript-promise-4ed8d44292b8/)
-
-
-### Control de Versiones (Git y GitHub)
-
-- [ ] **Git: Instalación y configuración**
-
-- [ ] **Git: Control de versiones con git (init, clone, add, commit, status, push, pull, remote)**
-
-- [ ] **Git: Integración de cambios entre ramas (branch, checkout, fetch, merge, reset, rebase, tag)**
-
-- [ ] **GitHub: Creación de cuenta y repos, configuración de llaves SSH**
-
-- [ ] **GitHub: Despliegue con GitHub Pages**
-
- Links
-
- * [Sitio oficial de GitHub Pages](https://pages.github.com/)
-
-
-- [ ] **GitHub: Colaboración en Github (branches | forks | pull requests | code review | tags)**
-
-- [ ] **GitHub: Organización en Github (projects | issues | labels | milestones | releases)**
-
-### Centrado en el usuario
-
-- [ ] **Diseñar y desarrollar un producto o servicio poniendo a las usuarias en el centro**
-
-### Diseño de producto
-
-- [ ] **Crear prototipos de alta fidelidad que incluyan interacciones**
-
-- [ ] **Seguir los principios básicos de diseño visual**
-
-### Investigación
-
-- [ ] **Planear y ejecutar testeos de usabilidad de prototipos en distintos niveles de fidelidad**
-
- Links
-
- * [Intro a testeos usabilidad](https://coda.io/@bootcamp-laboratoria/contenido-ux/test-de-usabilidad-15)
- * [Pruebas con Usuarios 1 — ¿Qué, cuándo y para qué testeamos?](https://eugeniacasabona.medium.com/pruebas-con-usuarios-1-qu%C3%A9-cu%C3%A1ndo-y-para-qu%C3%A9-testeamos-7c3a89b4b5e7)
-
- * [Primeros pasos con Firebase Authentication en sitios web - Documentación oficial](https://firebase.google.com/docs/auth/web/start?hl=es)
- * [Administra usuarios en Firebase (onAuthStateChanged)](https://firebase.google.com/docs/auth/web/manage-users?hl=es#get_the_currently_signed-in_user)
-
+## 1. Introducción al proyecto:
-- [ ] **Firestore**
+En este proyecto nos propusimos desarrollar una red social para los amantes de los libros. Creamos un espacio para que los usuarios creen su perfil y puedan compartir reseñas de los libros que han leído y así disfrutar de dar y responder a diferentes opiniones. https://dev-002-social-network-readingclub.vercel.app/
- Links
+
- * [Firestore - Documentación oficial](https://firebase.google.com/docs/firestore?hl=es)
- * [Reglas de seguridad de Firestore - Documentación oficial](https://firebase.google.com/docs/rules?hl=es)
- * [Obtén actualizaciones en tiempo real con Cloud Firestore - Documentación oficial](https://firebase.google.com/docs/firestore/query-data/listen?hl=es)
-
-## 4. Consideraciones generales
+## 2. Resumen del proyecto:
-* Este proyecto se debe trabajar en equipos de tres.
+En este proyecto construimos una red social con la siguiente información:
-* La lógica del proyecto debe estar implementada completamente en JavaScript
- (ES6+), HTML y CSS :smiley:. Para este proyecto **no está permitido** utilizar
- _frameworks_ o librerías de CSS y JS.
+* Desarrollamos una SPA que cuenta con los conceptos responsive.
+* Implementamos un servicio externo a través de Firebase.
+* Creamos e implementamos pruebas unitarias.
-* La división y organización del trabajo debe permitir, sin excepciones, que
- **cada integrante** del equipo practique el aprendizaje de todo lo involucrado
- en **cada historia**. _No se dividan el trabajo como en una fábrica._
- - ¿Hasta acá has avanzado en tus proyectos con cierta fluidez y sin mayores
- problemas? Sé generosa con tus compañeras, permíteles aprender y practicar
- sin restricciones, aunque tome un poco más de tiempo. Aproveha de
- _coachearlas_, de hacer _pair programming_, una de las mejores maneras de
- aprender es explicando verbalmente.
- - ¿Se te está haciendo difícil y te cuesta un poco más avanzar? No te quedes
- con las partes "fáciles" del proyecto, conversa, negocia, exige tu oportunidad
- para practicar y aprender lo que se te hace más difícil.
+## 3. Prototipos:
-* Solamente pueden trabajar en una única historia por vez, no pueden avanzar a
- la siguiente sin haber completado la anterior. La historia se completa cuando
- se cumplen **todos** sus Criterios de Aceptación + **toda** su Definición
- de Terminado.
+Creamos prototipos de baja y de alta fidelidad utilizando Figma y basándonos en las historias de usuario logramos establecer el diseño de la red social.
+Obtuvimos feedback de pares y coaches hasta que consideramos que la página estaba lista para desarrollarla.
-Para comenzar tendrás que hacer un _fork_ y _clonar_ este repositorio.
+### Prototipo de baja fidelidad
+
-## 5. Criterios de aceptación mínimos del proyecto
+### Prototipo de alta fidelidad
+
+
+
-### 5.1 Boilerplate
-Este proyecto no incluye un _boilerplate_, así es que tendrás que definir la
-estructura de carpetas y escribir tus propias Pruebas Unitarias (_tests_). Para
-hacerlo, puedes guiarte de los proyectos anteriores.
-### 5.2 Definición del producto
+## 4. Historias de usuario:
-En el `README.md` cuéntanos brevemente cómo descubriste las necesidades de los
-usuarios y cómo llegaste a la definición final de tu producto. Es importante
-que detalles:
+* Historia de usuario 1: Yo como fanática de los libros quiero crear una cuenta en ReadingClub para conocer y dar diferentes opiniones de libros y así compartir reseñas de libros y conocer las opiniones de otras personas.
+* Historia de usuario 2: Yo como usuario de ReadingClub quiero publicar para dar mi opinión acerca de diferentes libros.
+* Historia de usuario 3: Yo como usuario que ya publicó una reseña quiero leer las diferentes reseñas de otros usuarios en la plataforma.
+* Historia de usuario 4: Yo como usuario que ya está logeado en la plataforma quiero poder cerrar sesión para que otros usuarios puedan ingresar para conocer nuevos libros.
-* Quiénes son los principales usuarios de producto.
-* Qué problema resuelve el producto / para qué le servirá a estos usuarios.
-### 5.3 Historias de usuario
+## 5. Comportamiento UI
-Una vez que entiendas las necesidades de tus usuarixs, escribe las Historias de
-Usuario que representen todo lo que necesitan hacer/ver en la Red Social. Cada
-una de tus Historias de Usuario debe tener:
+### Creación de cuenta de usuario:
+
+* Ingreso a través de data almacenada en Firebase.
+* Creación de cuentas de usuario con correo y contraseña y a través de cuentas de Google.
-* **Criterios de Aceptación:** todo lo que debe ocurrir para satisfacer las
- necesidades del usuario.
+### Dashboard:
-* **Definición de terminado:** todos los aspectos técnicos que deben cumplirse
- para que, como equipo, sepan que esa historia está terminada y lista
- para publicarse. **Todas** tus Historias de Usuario (salvo excepciones), deben
- incluir estos aspectos en su Definición de Terminado (más todo lo que
- necesiten agregar):
+* Las publicaciones en el muro son en tiempo real.
+* Se pueden editar las publicaciones propias.
+* Se puede dar like a las publicaciones y ver el conteo de likes.
+* Se pueden eliminar las publicaciones propias y se pide confirmación para eliminar.
- - Debe ser una SPA.
- - Debe ser _responsive_.
- - Deben haber recibido _code review_ de al menos una compañera de otro equipo.
- - Hicieron los _test_ unitarios
- - Testearon manualmente buscando errores e imperfecciones simples.
- - Hicieron _pruebas_ de usabilidad e incorporaron el _feedback_ de los
- usuarios como mejoras.
- - Desplegaron su aplicación y etiquetaron la versión (git tag).
+## 6. Producto final:
-### 5.4 Diseño de la Interfaz de Usuario (prototipo de baja fidelidad)
+
+
+
-Debes definir cuál será el flujo que seguirá el usuario dentro de tu aplicación
-y, con eso, diseña la Interfaz de Usuario (UI por sus siglas en inglés) que
-siga este flujo.
-### 5.5 Responsive
+## 7. Pruebas unitarias:
-Debe verse bien en dispositivos de pantallas grandes
-(computadoras/es, laptops, etc.) y pequeñas (_tablets_, celulares, etc.). Te
-sugerimos seguir la técnica de _`mobile first`_ (más detalles sobre esta técnica
-al final).
-### 5.6 Consideraciones del comportamiento de la interfaz de usuario (UI)
-
-Estas consideraciones te ayudarán a escribir las Definiciones de Terminado de
-tus H.U.:
-#### Creación de cuenta de usuario e inicio de sesión
-
-* _Login_ con Firebase:
- - Para el _login_ y las publicaciones en el muro puedes utilizar [Firebase](https://firebase.google.com/products/database/)
- - Creación de cuenta de acceso y autenticación con cuenta de correo y
- contraseña, y también con una cuenta de Google.
-* Validaciones:
- - Solamente se permite el acceso a usuarios con cuentas válidas.
- - No pueden haber usuarios repetidos.
- - La cuenta de usuario debe ser un correo electrónico válido.
- - Lo que se escriba en el campo (_input_) de contraseña debe ser secreto.
-* Comportamiento:
- - Al enviarse el formulario de registro o inicio de sesión, debe validarse.
- - Si hay errores, se deben mostrar mensajes descriptivos para ayudar al
- usuario a corregirlos.
-
-#### Muro/timeline
-
-* Validaciones:
- - Al publicar, se debe validar que exista contenido en el _input_.
-* Comportamiento:
- - Al recargar la aplicación, se debe verificar si el usuario está _logueado_
- antes de mostrar contenido.
- - Poder publicar un _post_.
- - Poder dar y quitar _like_ a una publicación. Máximo uno por usuario.
- - Llevar un conteo de los _likes_.
- - Poder eliminar un post específico.
- - Pedir confirmación antes de eliminar un _post_.
- - Al dar _click_ para editar un _post_, debe cambiar el texto por un _input_
- que permita editar el texto y luego guardar los cambios.
- - Al guardar los cambios debe cambiar de vuelta a un texto normal pero con la
- información editada.
- - Al recargar la página debo de poder ver los textos editados.
-
-### 5.7 Consideraciones técnicas Front-end
-
-* Separar la manipulación del DOM de la lógica (Separación de responsabilidades).
-* Contar con múltiples vistas. Para esto, tu aplicación debe ser una
- [Single Page Application (SPA)](https://es.wikipedia.org/wiki/Single-page_application)
-* Alterar y persistir datos. Los datos que agregues o modifiques deberán
- persistir a lo largo de la aplicación. Te recomendamos que uses
- [Firebase](https://firebase.google.com/) para eso también.
-
-#### Pruebas unitarias (unit tests)
-
-* Recuerda que no hay un _setup_ de **tests** definido, dependerá de
- la estructura de tu proyecto. Algo que no debes de olvidar es pensar en éstas
- pruebas, te pueden ayudar a definir la estructura y nomenclatura de tu lógica.
-
-* Los tests unitarios deben cubrir un mínimo del 70% de _statements_, _functions_,
- _lines_, y _branches_.
-
-### 5.8 Consideraciones técnicas UX
-
-* Hacer al menos 2 entrevistas con usuarios.
-* Hacer un prototipo de baja fidelidad.
-* Asegurarte de que la implementación en código siga los lineamientos del
- diseño.
-* Hacer sesiones de _testing de usabilidad_ con el producto en HTML.
-
-## 6. Hacker edition
-
-Las secciones llamadas _Hacker Edition_ son **opcionales**. Si **terminaste**
-con todo lo anterior y te queda tiempo, intenta completarlas. Así podrás
-profundizar y/o ejercitar más sobre los objetivos de aprendizaje del proyecto.
-
-* Permite crear posts con imágenes.
-* Permite buscar usuarios, agregar y eliminar "amigos".
-* Permite definir la privacidad de los _posts_ (público o solamente para amigos).
-* Permite ver su muro de cualquier usuario "no-amigo" (solamente los
- posts _públicos_).
-* Permite comentar o responder una publicación.
-* Permite editar perfil.
-
-## 7. Entrega
-
-El proyecto será _entregado_ subiendo tu código a GitHub (`commit`/`push`) y la
-interfaz será desplegada usando GitHub pages u otro servicio de hosting que
-puedas haber encontrado en el camino.
-
-***
-
-## 8. Pistas, tips y Lecturas complementarias
-
-### Mobile first
-
-El concepto de [_mobile first_](https://www.mediaclick.es/blog/diseno-web-responsive-design-y-la-importancia-del-mobile-first/)
-hace referencia a un proceso de diseño y desarrollo donde partimos de cómo se ve
-y cómo funciona la aplicación en un dispositivo móvil primero, y más adelante se
-ve como adaptar la aplicación a pantallas progresivamente grandes y
-características específicas del entorno desktop. Esto es en contraposición al
-modelo tradicional, donde primero se diseñaban los websites (o webapps) para
-desktop y después se trataba de _arrugar_ el diseño para que entre en pantallas
-más chicas. La clave acá es asegurarse de que desde el principio diseñan usando
-la vista _responsive_ de las herramientas de desarrollador (developer tools) del
-navegador. De esa forma, partimos de cómo se ve y comporta la aplicación en una
-pantalla y entorno móvil.
-
-### Múltiples vistas
-
-En proyectos anteriores nuestras aplicaciones habían estado compuestas de una
-sola _vista_ principal (una sóla _página_). En este proyecto se introduce la
-necesidad de tener que dividir nuestra interfaz en varias _vistas_ o _páginas_
-y ofrecer una manera de navegar entre estas vistas. Este problema se puede
-afrontar de muchas maneras: con archivos HTML independientes (cada uno con su
-URL) y links tradicionales, manteniendo estado en memoria y rederizando
-condicionalmente (sin refrescar la página), [manipulando el historial del
-navegador](https://developer.mozilla.org/es/docs/DOM/Manipulando_el_historial_del_navegador)
-con [`window.history`](https://developer.mozilla.org/es/docs/Web/API/Window/history).
-En este proyecto te invitamos a explorar opciones y decidir una opción
-de implementación.
-
-### Escritura de datos
-
-En los proyectos anteriores hemos consumido (leído) datos, pero todavía no
-habíamos escrito datos (salvar cambios, crear datos, borrar, ...). En este
-proyecto tendrás que crear (salvar) nuevos datos, así como leer, actualizar y
-modificar datos existentes. Estos datos se podrán guardar de forma remota
-usando [Firebase](https://firebase.google.com/).
-
-Otras:
-
-* [Modulos: Export](https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/export)
-* [Modulos: Import](https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/import)
-* [Diseño web, responsive design y la importancia del mobile first - Media Click](https://www.mediaclick.es/blog/diseno-web-responsive-design-y-la-importancia-del-mobile-first/)
-* [Mobile First: el enfoque actual del diseño web móvil - 1and1](https://www.1and1.es/digitalguide/paginas-web/diseno-web/mobile-first-la-nueva-tendencia-del-diseno-web/)
-* [Mobile First - desarrolloweb.com](https://desarrolloweb.com/articulos/mobile-first-responsive.html)
-* [Mobile First Is NOT Mobile Only - Nielsen Norman Group](https://www.nngroup.com/articles/mobile-first-not-mobile-only/)
diff --git a/package.json b/package.json
index 0c72f6c8..e69d1b20 100644
--- a/package.json
+++ b/package.json
@@ -11,24 +11,25 @@
"license": "MIT",
"scripts": {
"htmlhint": "htmlhint dist/*.html ",
- "eslint": "eslint --ext .js src/ test/",
+ "eslint:fix":"eslint --fix --ext. js src/ test/",
"stylelint": "stylelint --aei src/**/*.css",
- "pretest": "npm run htmlhint && npm run eslint && npm run stylelint",
"test": "jest --coverage",
- "start": "serve -s src/"
+ "start": "serve -s src/",
+ "deploy": "-d src"
},
+
"devDependencies": {
"@babel/core": "^7.11.4",
"@babel/preset-env": "^7.11.0",
- "babel-jest": "^27.0.1",
+ "babel-jest": "^27.5.1",
"eslint": "^8.3.0",
"eslint-config-airbnb-base": "^15.0.0",
"eslint-plugin-import": "^2.18.2",
"eslint-plugin-jest": "^25.3.0",
"htmlhint": "^1.0.0",
- "jest": "^27.0.1",
+ "jest": "^27.5.1",
"regenerator-runtime": "^0.13.1",
- "serve": "^13.0.2",
+ "serve": "^14.1.2",
"stylelint": "^14.1.0",
"stylelint-config-recommended": "^6.0.0"
},
@@ -39,5 +40,8 @@
"createdAt": "2022-11-30T16:52:37.204Z",
"version": "5.5.0",
"commit": "51e941edf1cc991930aefd7dd9c406a7c43741c1"
+ },
+ "dependencies": {
+ "firebase": "^9.15.0"
}
-}
\ No newline at end of file
+}
diff --git a/responsive.txt b/responsive.txt
new file mode 100644
index 00000000..ac6613f2
--- /dev/null
+++ b/responsive.txt
@@ -0,0 +1,6 @@
+/*Responsive*/
+.llamarImagenesdiv{
+ display: flex;
+ flex: wrap;
+ gap: 20px;
+}
\ No newline at end of file
diff --git a/src/_Mock_@firebase/auth.js b/src/_Mock_@firebase/auth.js
new file mode 100644
index 00000000..c5d02c34
--- /dev/null
+++ b/src/_Mock_@firebase/auth.js
@@ -0,0 +1,8 @@
+export const signInWithPopup = () => Promise.resolve();
+export const getAuth = () => {}; // es un objeto vacío
+export const GoogleAuthProvider = class {}; // son un tipo de objeto que contiene funciones
+
+export const signOut = () => Promise.resolve();
+export const signInWithEmailAndPassword = jest.fn(() => Promise.resolve());
+
+export const createUserWithEmailAndPassword = Promise.resolve();
\ No newline at end of file
diff --git a/src/images/1erlike.png b/src/images/1erlike.png
new file mode 100644
index 00000000..0fb7f274
Binary files /dev/null and b/src/images/1erlike.png differ
diff --git a/src/images/2dolike.png b/src/images/2dolike.png
new file mode 100644
index 00000000..634bc994
Binary files /dev/null and b/src/images/2dolike.png differ
diff --git a/src/images/Final1.png b/src/images/Final1.png
new file mode 100644
index 00000000..3a6b0f7d
Binary files /dev/null and b/src/images/Final1.png differ
diff --git a/src/images/Final2.png b/src/images/Final2.png
new file mode 100644
index 00000000..8972e2b8
Binary files /dev/null and b/src/images/Final2.png differ
diff --git a/src/images/Prototipo1.png b/src/images/Prototipo1.png
new file mode 100644
index 00000000..e5586b9d
Binary files /dev/null and b/src/images/Prototipo1.png differ
diff --git a/src/images/Prototipo2.png b/src/images/Prototipo2.png
new file mode 100644
index 00000000..c728a6ba
Binary files /dev/null and b/src/images/Prototipo2.png differ
diff --git a/src/images/Prototipo3.png b/src/images/Prototipo3.png
new file mode 100644
index 00000000..b04eedc3
Binary files /dev/null and b/src/images/Prototipo3.png differ
diff --git a/src/images/btnGoogle.png b/src/images/btnGoogle.png
new file mode 100644
index 00000000..510e6192
Binary files /dev/null and b/src/images/btnGoogle.png differ
diff --git a/src/images/cerrar-sesion.png b/src/images/cerrar-sesion.png
new file mode 100644
index 00000000..27c0a967
Binary files /dev/null and b/src/images/cerrar-sesion.png differ
diff --git a/src/images/close.png b/src/images/close.png
new file mode 100644
index 00000000..b865a199
Binary files /dev/null and b/src/images/close.png differ
diff --git a/src/images/delete.png b/src/images/delete.png
new file mode 100644
index 00000000..7f98700b
Binary files /dev/null and b/src/images/delete.png differ
diff --git a/src/images/editar.png b/src/images/editar.png
new file mode 100644
index 00000000..9274a976
Binary files /dev/null and b/src/images/editar.png differ
diff --git a/src/images/final3.png b/src/images/final3.png
new file mode 100644
index 00000000..f079857a
Binary files /dev/null and b/src/images/final3.png differ
diff --git a/src/images/logo.png b/src/images/logo.png
new file mode 100644
index 00000000..425e0ba3
Binary files /dev/null and b/src/images/logo.png differ
diff --git a/src/images/logout.png b/src/images/logout.png
new file mode 100644
index 00000000..c280d10a
Binary files /dev/null and b/src/images/logout.png differ
diff --git a/src/images/prototipobaja.jpg b/src/images/prototipobaja.jpg
new file mode 100644
index 00000000..52d664ba
Binary files /dev/null and b/src/images/prototipobaja.jpg differ
diff --git a/src/images/user.png b/src/images/user.png
new file mode 100644
index 00000000..83dc81d9
Binary files /dev/null and b/src/images/user.png differ
diff --git a/src/index.html b/src/index.html
index 788db3c9..13f6e57f 100644
--- a/src/index.html
+++ b/src/index.html
@@ -1,12 +1,21 @@
+
- Document
+
+
+ Social Network
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/lib/Components/_redirects b/src/lib/Components/_redirects
new file mode 100644
index 00000000..f8243379
--- /dev/null
+++ b/src/lib/Components/_redirects
@@ -0,0 +1 @@
+/* /index.html 200
\ No newline at end of file
diff --git a/src/lib/Components/dashboard.js b/src/lib/Components/dashboard.js
new file mode 100644
index 00000000..bd3d8d64
--- /dev/null
+++ b/src/lib/Components/dashboard.js
@@ -0,0 +1,242 @@
+import { onNavigate } from '../../main.js';
+import {
+ submitPost,
+ logOut,
+ getAllPosts,
+ deletePost,
+ currentUserInfo,
+ getTask,
+ updateTask,
+ giveLike,
+ dislike,
+} from '../index.js';
+
+export const login = () => {
+ const divLogin = document.createElement('div');
+ divLogin.setAttribute('id', 'div-login');
+ const viewLogin = `
+
+
+
+
+
+
+ 
+
+ 
+ 
+