diff --git a/.prettierrc b/.prettierrc
new file mode 100644
index 0000000..544138b
--- /dev/null
+++ b/.prettierrc
@@ -0,0 +1,3 @@
+{
+ "singleQuote": true
+}
diff --git a/package.json b/package.json
index 1d89e14..eb37f51 100644
--- a/package.json
+++ b/package.json
@@ -41,5 +41,8 @@
"createdAt": "2023-06-06T21:37:46.504Z",
"version": "6.3.0",
"commit": "a942adeb868f1fe54b86e34cc4fc4ddb0601700d"
+ },
+ "dependencies": {
+ "firebase": "^10.1.0"
}
-}
\ No newline at end of file
+}
diff --git a/src/components/firebase.js b/src/components/firebase.js
new file mode 100644
index 0000000..a7083a4
--- /dev/null
+++ b/src/components/firebase.js
@@ -0,0 +1,56 @@
+import { initializeApp } from 'firebase/app';
+import { getFirestore, collection, addDoc } from 'firebase/firestore';
+import { getAuth, signInWithPopup, GoogleAuthProvider } from 'firebase/auth';
+
+// Import the functions you need from the SDKs you need
+
+// TODO: Add SDKs for Firebase products that you want to use
+// https://firebase.google.com/docs/web/setup#available-libraries
+
+// Your web app's Firebase configuration
+// For Firebase JS SDK v7.20.0 and later, measurementId is optional
+const firebaseConfig = {
+ apiKey: 'AIzaSyDhmNVMP2orY3iOmOT6DdaVABzLyzydVLY',
+ authDomain: 'redis-ccc00.firebaseapp.com',
+ projectId: 'redis-ccc00',
+ storageBucket: 'redis-ccc00.appspot.com',
+ messagingSenderId: '718676390172',
+ appId: '1:718676390172:web:516edc445106e832a98ad9',
+ measurementId: 'G-JQF50P4QXX',
+};
+
+// Initialize Firebase
+const app = initializeApp(firebaseConfig);
+const db = getFirestore(app);
+const provider = new GoogleAuthProvider();
+const auth = getAuth(app);
+
+export const googleLogin = () => {
+ signInWithPopup(auth, provider)
+ .then((result) => {
+ // This gives you a Google Access Token. You can use it to access the Google API.
+ const credential = GoogleAuthProvider.credentialFromResult(result);
+ const token = credential.accessToken;
+ // The signed-in user info.
+ const user = result.user;
+ // IdP data available using getAdditionalUserInfo(result)
+ // ...
+ console.log(user);
+ })
+ .catch((error) => {
+ // Handle Errors here.
+ const errorCode = error.code;
+ const errorMessage = error.message;
+ // The email of the user's account used.
+ const email = error.customData.email;
+ // The AuthCredential type that was used.
+ const credential = GoogleAuthProvider.credentialFromError(error);
+ // ...
+ console.log(errorMessage);
+ console.log(errorCode);
+ });
+};
+export const savePosts = (post) => {
+ addDoc(collection(db, 'posts'), { post });
+};
+export const getPosts = () => console.log('Get Posts');
diff --git a/src/components/signIn.js b/src/components/signIn.js
new file mode 100644
index 0000000..4aad227
--- /dev/null
+++ b/src/components/signIn.js
@@ -0,0 +1,68 @@
+import { googleLogin } from './firebase';
+export const signIn = (onNavigate) => {
+ // Se crean los elementos de HTML
+
+ const signInDiv = document.createElement('div');
+ signInDiv.classList.add('signInDiv');
+ const imgContainer = document.createElement('div');
+ imgContainer.classList.add('imgContainer');
+ const imageSignIn = document.createElement('img');
+ imageSignIn.classList.add('imageSignIn');
+ imageSignIn.src = '../image/imagesignIn.jpg';
+ // se crea un select para almacenar el formulario
+ const formSignIn = document.createElement('div');
+ formSignIn.classList.add('formSignIn');
+ const description = document.createElement('h1');
+ description.classList.add('description');
+ const sentence = document.createElement('h2');
+ sentence.classList.add('sentence');
+
+ const email = document.createElement('input');
+ email.classList.add('email');
+ const password = document.createElement('input');
+ password.classList.add('password');
+ const signInButton = document.createElement('button');
+ const googleButton = document.createElement('button');
+ const dontYouHaveAnAccount = document.createElement('p');
+ dontYouHaveAnAccount.classList.add('dontYouHaceAnAccount');
+ const signUpButton = document.createElement('button');
+
+ // Se inserta el nombre a los elementos creados
+ description.textContent =
+ 'Únete a nuestra red de apoyo y reduce el derroche alimentario.';
+ email.placeholder = 'Correo Electrónico';
+ password.placeholder = 'Contraseña';
+ signInButton.textContent = 'Inicia sesión';
+ googleButton.textContent = 'Acceder con Google';
+ dontYouHaveAnAccount.textContent = '¿No tienes una cuenta?';
+ signUpButton.textContent = 'Registrate';
+
+ // Se crean los eventos que permitiran la navegación
+ signInButton.addEventListener('click', () => {
+ onNavigate('/wall');
+ });
+
+
+ googleButton.addEventListener('click', (e) => {
+ e.preventDefault();
+ googleLogin();
+ onNavigate('/wall');
+ });
+ signUpButton.addEventListener('click', () => {
+ onNavigate('/signup');
+ });
+
+ // Se insertan los hijos
+ formSignIn.appendChild(email);
+ formSignIn.appendChild(password);
+ formSignIn.appendChild(signInButton);
+ formSignIn.appendChild(googleButton);
+ formSignIn.appendChild(dontYouHaveAnAccount);
+ formSignIn.appendChild(signUpButton);
+ imgContainer.appendChild(imageSignIn);
+ signInDiv.appendChild(imgContainer);
+ signInDiv.appendChild(description);
+ signInDiv.appendChild(formSignIn);
+
+ return signInDiv;
+};
diff --git a/src/components/signUp.js b/src/components/signUp.js
new file mode 100644
index 0000000..e4ca6d3
--- /dev/null
+++ b/src/components/signUp.js
@@ -0,0 +1,40 @@
+export const signUp = (onNavigate) => {
+ const singUpDiv = document.createElement('div');
+ const signUpButton = document.createElement('button');
+ const backToLogin = document.createElement('button');
+ const signUpText = document.createElement('h3');
+ const usersName = document.createElement('input');
+ const usersEmail = document.createElement('input');
+ const usersPassword = document.createElement('input');
+ const termsCheckbox = document.createElement('input');
+ const termsText = document.createElement('p');
+ const doYouHaveAnAccount = document.createElement('p');
+
+ doYouHaveAnAccount.textContent = '¿Ya tienes una cuenta?';
+ termsText.textContent = 'Acepto Términos, Condiciones y política de Privacidad';
+ termsCheckbox.type = 'checkbox';
+ signUpText.textContent = '¡Regístrate!';
+ usersName.placeholder = 'Nombre y Apellidos';
+ usersEmail.placeholder = 'Correo Electrónico';
+ usersPassword.placeholder = 'Contraseña';
+ signUpButton.textContent = 'Crear cuenta';
+ backToLogin.textContent = 'Inicia sesión';
+
+ backToLogin.addEventListener('click', () => {
+ onNavigate('/');
+ });
+ signUpButton.addEventListener('click', () => {
+ onNavigate('/wall');
+ });
+
+ singUpDiv.appendChild(signUpText);
+ singUpDiv.appendChild(usersName);
+ singUpDiv.appendChild(usersEmail);
+ singUpDiv.appendChild(usersPassword);
+ singUpDiv.appendChild(termsCheckbox);
+ singUpDiv.appendChild(termsText);
+ singUpDiv.appendChild(signUpButton);
+ singUpDiv.appendChild(doYouHaveAnAccount);
+ singUpDiv.appendChild(backToLogin);
+ return singUpDiv;
+};
diff --git a/src/components/wall.js b/src/components/wall.js
new file mode 100644
index 0000000..c76e4fa
--- /dev/null
+++ b/src/components/wall.js
@@ -0,0 +1,33 @@
+import { savePosts, getPosts} from './firebase.js';
+
+export const wall = (onNavigate) => {
+ const wallDiv = document.createElement('div');
+ const allPosts = document.createElement('form')
+ const signOutButton = document.createElement('button');
+ const postButton = document.createElement('button');
+ const post = document.createElement('textarea');
+
+ post.placeholder = 'Escribe tu publicación';
+ post.rows = '4';
+ postButton.textContent = 'Publicar';
+ signOutButton.textContent = 'Cerrar sesión';
+
+ allPosts.addEventListener('submit', (e) => {
+ e.preventDefault();
+ savePosts(post.value);
+ });
+ getPosts();
+ signOutButton.addEventListener('click', () => {
+ onNavigate('/');
+ });
+
+ allPosts.append(post, postButton);
+ wallDiv.appendChild(allPosts);
+ wallDiv.appendChild(signOutButton);
+
+<<<<<<< HEAD
+ return wallDiv;
+=======
+ return wallDiv;
+>>>>>>> main
+};
diff --git a/src/image/imageninicio.jpg b/src/image/imageninicio.jpg
new file mode 100644
index 0000000..17a03a8
Binary files /dev/null and b/src/image/imageninicio.jpg differ
diff --git a/src/image/imagesignIn.jpg b/src/image/imagesignIn.jpg
new file mode 100644
index 0000000..c2c7477
Binary files /dev/null and b/src/image/imagesignIn.jpg differ
diff --git a/src/index.html b/src/index.html
index 788db3c..6ba9fe4 100644
--- a/src/index.html
+++ b/src/index.html
@@ -4,9 +4,12 @@
- Document
+ Social Network
+
+
+