Code Integration and Styles

.firebaserc

@@ -0,0 +1,5 @@
+{
+  "projects": {
+    "default": "socialnetwork-15a5f"
+  }
+}

Readme.md

@@ -137,40 +137,44 @@ El objetivo de usar Firestore en este proyecto, es que aprendes a manejar y pers
     > - Se hicieron pruebas de usuabilidad y se implementó el feedback si se 
     >   consideró necesario.
 
-## Objetivos de aprendizaje
-
-Antes de empezar el proyecto, recuerda agregar tus objetivos de aprendizaje pendientes de tu proyecto
-anterior en la siguiente sección.
+### Objetivos de aprendizajes pendientes Ania
 
-### Objetivos de aprendizajes pendientes
+[/] Diseñar la aplicación pensando y entendiendo al usuario.
+[/] Planear y ejecutar tests de usabilidad.
+[ ] Testear funciones (funciones puras).
 
+[/] Manipular arrays (filter | map | sort | reduce).
+[/] Manipular objects (key | value).
+[ ] Entender la diferencia entre expression y statements.
+[ ] Utilizar funciones (parámetros | argumentos | valor de retorno).
+[ ] Entender la diferencia entre tipos de datos atómicos y estructurados.
 
 ### HTML y CSS
 
-* [ ] [HTML semántico](https://developer.mozilla.org/en-US/docs/Glossary/Semantics#Semantics_in_HTML)
+* [/] [HTML semántico](https://developer.mozilla.org/en-US/docs/Glossary/Semantics#Semantics_in_HTML)
 * [ ] [CSS `flexbox`](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
 * [ ] Construir tu aplicación respetando el diseño realizado (maquetación).
 
 ### DOM y Web APIs
 
-* [ ] [Manipulación dinámica del DOM](https://developer.mozilla.org/es/docs/Referencia_DOM_de_Gecko/Introducci%C3%B3n)
+* [/] [Manipulación dinámica del DOM](https://developer.mozilla.org/es/docs/Referencia_DOM_de_Gecko/Introducci%C3%B3n)
 * [ ] [History API](https://developer.mozilla.org/es/docs/DOM/Manipulando_el_historial_del_navegador)
 * [ ] [`localStorage`]
 
 ### Javascript
 
-* [ ] [Uso de callbacks](https://developer.mozilla.org/es/docs/Glossary/Callback_function)
-* [ ] [Consumo de Promesas](https://scotch.io/tutorials/javascript-promises-for-dummies#toc-consuming-promises)
-* [ ] Uso ES modules
+* [/] [Uso de callbacks](https://developer.mozilla.org/es/docs/Glossary/Callback_function)
+* [/] [Consumo de Promesas](https://scotch.io/tutorials/javascript-promises-for-dummies#toc-consuming-promises)
+* [/] Uso ES modules
 ([`import`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import)
 | [`export`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export))
 
 ### Firebase
 
-* [ ] [Firestore](https://firebase.google.com/docs/firestore)
+* [/] [Firestore](https://firebase.google.com/docs/firestore)
 * [ ] [Firebase Auth](https://firebase.google.com/docs/auth/web/start)
-* [ ] [Firebase security rules](https://firebase.google.com/docs/rules)
-* [ ] [Uso de onSnapshot](https://firebase.google.com/docs/firestore/query-data/listen)
+* [/] [Firebase security rules](https://firebase.google.com/docs/rules)
+* [/] [Uso de onSnapshot](https://firebase.google.com/docs/firestore/query-data/listen)
 | [onAuthStateChanged](https://firebase.google.com/docs/auth/web/start#set_an_authentication_state_observer_and_get_user_data)
 
 ### Testing
@@ -181,7 +185,7 @@ anterior en la siguiente sección.
 
 ### Colaboración en Github
 
-* [ ] Branches
+* [/] Branches
 * [ ] Pull Requests
 * [ ] Tags
 
@@ -194,9 +198,162 @@ anterior en la siguiente sección.
 
 ### Buenas prácticas de desarrollo
 
-* [ ] Modularización
+* [/] Modularización
 * [ ] Nomenclatura / Semántica
 * [ ] Linting
+## Objetivos de aprendizaje
+### Objetivos de aprendizajes pendientes Liz
+
+
+### HTML y CSS
+
+* [X] [HTML semántico](https://developer.mozilla.org/en-US/docs/Glossary/Semantics#Semantics_in_HTML)
+* [X] [CSS flexbox](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
+* [X] Construir tu aplicación respetando el diseño realizado (maquetación).
+
+### DOM y Web APIs
+
+* [X] [Manipulación dinámica del DOM](https://developer.mozilla.org/es/docs/Referencia_DOM_de_Gecko/Introducci%C3%B3n)
+* [ ] [History API](https://developer.mozilla.org/es/docs/DOM/Manipulando_el_historial_del_navegador)
+* [ ] [localStorage]
+
+### Javascript
+
+* [X] [Uso de callbacks](https://developer.mozilla.org/es/docs/Glossary/Callback_function)
+* [X] [Consumo de Promesas](https://scotch.io/tutorials/javascript-promises-for-dummies#toc-consuming-promises)
+* [X] Uso ES modules
+([import](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import)
+| [export](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export))
+
+### Firebase
+
+* [X] [Firestore](https://firebase.google.com/docs/firestore)
+* [X] [Firebase Auth](https://firebase.google.com/docs/auth/web/start)
+* [X] [Firebase security rules](https://firebase.google.com/docs/rules)
+* [X] [Uso de onSnapshot](https://firebase.google.com/docs/firestore/query-data/listen)
+| [onAuthStateChanged](https://firebase.google.com/docs/auth/web/start#set_an_authentication_state_observer_and_get_user_data)
+
+### Testing
+
+* [ ] [Testeo de tus funciones](https://jestjs.io/docs/es-ES/getting-started)
+* [ ] [Testeo asíncrono](https://jestjs.io/docs/es-ES/asynchronous)
+* [ ] [Mocking](https://jestjs.io/docs/es-ES/manual-mocks)
+
+### Colaboración en Github
+
+* [X] Branches
+* [X] Pull Requests
+* [ ] Tags
+
+### Organización en Github
+
+* [ ] Projects
+* [ ] Issues
+* [ ] Labels
+* [ ] Milestones
+
+### Buenas prácticas de desarrollo
+
+* [X] Modularización
+* [X] Nomenclatura / Semántica
+* [X] Linting
+
+ITZEL PAOLA TAPIA
+### HTML y CSS
+
+* [x] [HTML semántico](https://developer.mozilla.org/en-US/docs/Glossary/Semantics#Semantics_in_HTML)
+* [x] [CSS `flexbox`](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
+* [x] Construir tu aplicación respetando el diseño realizado (maquetación).
+
+### DOM y Web APIs
+
+* [x] [Manipulación dinámica del DOM](https://developer.mozilla.org/es/docs/Referencia_DOM_de_Gecko/Introducci%C3%B3n)
+* [-] [History API](https://developer.mozilla.org/es/docs/DOM/Manipulando_el_historial_del_navegador)
+* [-] [`localStorage`]
+
+### Javascript
+
+* [-] [Uso de callbacks](https://developer.mozilla.org/es/docs/Glossary/Callback_function)
+* [-] [Consumo de Promesas](https://scotch.io/tutorials/javascript-promises-for-dummies#toc-consuming-promises)
+* [-] Uso ES modules
+([`import`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import)
+| [`export`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export))
+
+### Firebase
+
+* [-] [Firestore](https://firebase.google.com/docs/firestore)
+* [x] [Firebase Auth](https://firebase.google.com/docs/auth/web/start)
+* [-] [Firebase security rules](https://firebase.google.com/docs/rules)
+* [-] [Uso de onSnapshot](https://firebase.google.com/docs/firestore/query-data/listen)
+| [-]onAuthStateChanged](https://firebase.google.com/docs/auth/web/start#set_an_authentication_state_observer_and_get_user_data)
+
+### Testing
+
+* [ ] [Testeo de tus funciones](https://jestjs.io/docs/es-ES/getting-started)
+* [ ] [Testeo asíncrono](https://jestjs.io/docs/es-ES/asynchronous)
+* [ ] [Mocking](https://jestjs.io/docs/es-ES/manual-mocks)
+
+### Colaboración en Github
+
+* [x] Branches
+* [x] Pull Requests
+* [ -] Tags
+
+### Organización en Github
+
+* [ ] Projects
+* [ ] Issues
+* [ ] Labels
+* [ ] Milestones
+
+### Buenas prácticas de desarrollo
+
+* [-] Modularización
+* [x] Nomenclatura / Semántica
+* [ ] Linting
+
+Jimena
+## HTML y CSS
+
+* [x] [HTML semántico](https://developer.mozilla.org/en-US/docs/Glossary/Semantics#Semantics_in_HTML)
+* [x] [CSS flexbox](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
+* [x] Construir tu aplicación respetando el diseño realizado (maquetación).
+
+### DOM y Web APIs
+
+* [ ] [Manipulación dinámica del DOM](https://developer.mozilla.org/es/docs/Referencia_DOM_de_Gecko/Introducci%C3%B3n)
+* [ ] [History API](https://developer.mozilla.org/es/docs/DOM/Manipulando_el_historial_del_navegador)
+* [ ] [localStorage]
+
+### Javascript
+
+* [ ] [Uso de callbacks](https://developer.mozilla.org/es/docs/Glossary/Callback_function)
+* [ ] [Consumo de Promesas](https://scotch.io/tutorials/javascript-promises-for-dummies#toc-consuming-promises)
+* [ x] Uso ES modules
+([import](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import)
+| [export](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export))
+
+### Firebase
+
+* [ ] [Firestore](https://firebase.google.com/docs/firestore)
+* [x ] [Firebase Auth](https://firebase.google.com/docs/auth/web/start)
+* [ ] [Firebase security rules](https://firebase.google.com/docs/rules)
+* [ ] [Uso de onSnapshot](https://firebase.google.com/docs/firestore/query-data/listen)
+| [onAuthStateChanged](https://firebase.google.com/docs/auth/web/start#set_an_authentication_state_observer_and_get_user_data)
+
+### Testing
+
+* [ ] [Testeo de tus funciones](https://jestjs.io/docs/es-ES/getting-started)
+* [ ] [Testeo asíncrono](https://jestjs.io/docs/es-ES/asynchronous)
+* [ ] [Mocking](https://jestjs.io/docs/es-ES/manual-mocks)
+
+### Colaboración en Github
+
+* [ x] Branches
+* [ ] Pull Requests
+* [ ] Tags
+
+
 
 ***
 

_mocks_/firebase-mock.js

@@ -0,0 +1,34 @@
+
+/* const firestore = {
+    auth: () => {
+        return {
+            signInWithPopup: (provider) => {
+                return new Promise((resolve, reject) => {
+                    resolve('datauser')
+
+
+                })
+            }
+        }
+    }
+} */
+//Creando un mock manual
+/* const firebase = {
+    auth: () => {
+        return {
+            signInWithPopup: (provider) => {
+                return new Promise((resolve, reject) => {
+                    resolve('datauser')
+
+
+                })
+            }
+        }
+    },
+
+
+}
+
+export default jest.fn(() => {
+    return firebase
+}) */

database.rules.json

@@ -0,0 +1,6 @@
+{
+  "rules": {
+    ".read": "auth != null",
+    ".write": "auth != null"
+  }
+}

firebase.json

@@ -0,0 +1,16 @@
+{
+  "database": {
+    "rules": "database.rules.json"
+  },
+  "hosting": {
+    "public": "src",
+    "ignore": [
+      "firebase.json",
+      "**/.*",
+      "**/node_modules/**"
+    ]
+  },
+  "storage": {
+    "rules": "storage.rules"
+  }
+}

package.json

@@ -12,8 +12,6 @@
   "scripts": {
     "htmlhint": "htmlhint dist/*.html ",
     "eslint": "eslint --ext .js src/ test/",
-    "stylelint": "stylelint --aei src/**/*.css",
-    "pretest": "npm run htmlhint && npm run eslint && npm run stylelint",
     "test": "jest --coverage",
     "start": "serve src/"
   },
@@ -32,5 +30,8 @@
     "serve": "^11.0.2",
     "stylelint": "^10.1.0",
     "stylelint-config-recommended": "^2.2.0"
+  },
+  "dependencies": {
+    "bulma": "^0.8.2"
   }
-}
+}

src/404.html

@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>Page Not Found</title>
+
+    <style media="screen">
+      body { background: #ECEFF1; color: rgba(0,0,0,0.87); font-family: Roboto, Helvetica, Arial, sans-serif; margin: 0; padding: 0; }
+      #message { background: white; max-width: 360px; margin: 100px auto 16px; padding: 32px 24px 16px; border-radius: 3px; }
+      #message h3 { color: #888; font-weight: normal; font-size: 16px; margin: 16px 0 12px; }
+      #message h2 { color: #ffa100; font-weight: bold; font-size: 16px; margin: 0 0 8px; }
+      #message h1 { font-size: 22px; font-weight: 300; color: rgba(0,0,0,0.6); margin: 0 0 16px;}
+      #message p { line-height: 140%; margin: 16px 0 24px; font-size: 14px; }
+      #message a { display: block; text-align: center; background: #039be5; text-transform: uppercase; text-decoration: none; color: white; padding: 16px; border-radius: 4px; }
+      #message, #message a { box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); }
+      #load { color: rgba(0,0,0,0.4); text-align: center; font-size: 13px; }
+      @media (max-width: 600px) {
+        body, #message { margin-top: 0; background: white; box-shadow: none; }
+        body { border-top: 16px solid #ffa100; }
+      }
+    </style>
+  </head>
+  <body>
+    <div id="message">
+      <h2>404</h2>
+      <h1>Page Not Found</h1>
+      <p>The specified file was not found on this website. Please check the URL for mistakes and try again.</p>
+      <h3>Why am I seeing this?</h3>
+      <p>This page was generated by the Firebase Command-Line Interface. To modify it, edit the <code>404.html</code> file in your project's configured <code>public</code> directory.</p>
+    </div>
+  </body>
+</html>