diff --git a/webapp/src/App.js b/webapp/src/App.js
index cca8a24..d7cc372 100644
--- a/webapp/src/App.js
+++ b/webapp/src/App.js
@@ -1,54 +1,30 @@
- import React, { useState } from 'react';
-import Container from '@mui/material/Container';
+import React from 'react';
+import Navbar from './components/navbar/NavBar';
+import AddUser from './components/adduser/AddUser';
+import Login from './components/login/Login';
+import { AuthProvider } from './components/authcontext';
+import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
+import StartButton from './components/startbutton/StartButton';
import Game from './components/game/Game';
-function App() {
- const [showLogin, setShowLogin] = useState(true);
-
- const handleToggleView = () => {
- setShowLogin(!showLogin);
- };
+import Home from './components/home/Home';
+import Footer from './components/footer/Footer';
+const App = () => {
return (
-
-
-
-
-
- {/*showLogin ? :
-
- {showLogin ? (
-
- Don't have an account? Register here.
-
- ) : (
-
- Already have an account? Login here.
-
- )}
-
- */}
-
-
+
+
+
+
+ } />
+ } />
+ } />
+ } />
+ } />
+
+
+
+
);
-}
-
-export default App;
-
-/*
-import React from 'react';
-import GenerateQuestion from './components/GenerateQuestion'; // Asegúrate de importar GenerateQuestion correctamente
-import Login from './components/Login';
-import CssBaseline from '@mui/material/CssBaseline';
-import Container from '@mui/material/Container';
-import Typography from '@mui/material/Typography';
-import Footer from './components/Footer';
-function App() {
- return (
+};
-
-
-
- Welcome to the 2024 edition of the Software Architecture course
-
- { Aquí se muestra el componente GenerateQuestion */
-
+export default App;
\ No newline at end of file
diff --git a/webapp/src/components/game/Game.js b/webapp/src/components/game/Game.js
index 390ad00..e00ca77 100644
--- a/webapp/src/components/game/Game.js
+++ b/webapp/src/components/game/Game.js
@@ -1,5 +1,5 @@
// Importa React, useState para manejar el estado, axios para hacer solicitudes HTTP, y componentes de Material UI para la interfaz.
-import React, { useState } from 'react';
+import React, { useState,useEffect } from 'react';
import axios from 'axios';
import { Container, Typography, Button, Snackbar,Grid,Box } from '@mui/material';
import MuiAlert from '@mui/material/Alert';
@@ -9,9 +9,12 @@ const apiEndpoint = process.env.REACT_APP_API_URI || 'http://localhost:8000';
const Game = () => {
+ useEffect(() => {
+ fetchQuestionAndAnswers();
+ }, []); // Pasar un array vacío como segundo argumento para que `useEffect` se ejecute solo una vez al montar el componente.
- const buttonColors = ['#ff0000', '#00008b', '#0000ff', '#00ff00'];
-
+
+ const buttonColors = ['#3D348B', '#7678ED', '#F35B04', '#172A3A'];
const [question, setQuestion] = useState('');
const [answers, setAnswers] = useState([]);
const [loadingMessage, setLoadingMessage] = useState('');
@@ -65,9 +68,11 @@ const Game = () => {
{question}
)}
-
{loadingMessage && ({loadingMessage})}
{/* Muestra la pregunta y las respuesta si existen */}
diff --git a/webapp/src/components/home/Home.js b/webapp/src/components/home/Home.js
new file mode 100644
index 0000000..6bbc3c0
--- /dev/null
+++ b/webapp/src/components/home/Home.js
@@ -0,0 +1,17 @@
+import React from 'react';
+import Navbar from '../navbar/NavBar';
+import StartButton from '../startbutton/StartButton';
+import Typography from '@mui/material/Typography';
+import Footer from '../footer/Footer';
+const Home = () => {
+ return (
+
+
+
+
+
+
+ );
+};
+
+export default Home;
\ No newline at end of file
diff --git a/webapp/src/components/home/home.css b/webapp/src/components/home/home.css
new file mode 100644
index 0000000..d177342
--- /dev/null
+++ b/webapp/src/components/home/home.css
@@ -0,0 +1,14 @@
+body {
+ margin: 0;
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+ 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+ sans-serif;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ }
+
+ code {
+ font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+ monospace;
+ }
+
\ No newline at end of file
diff --git a/webapp/src/index.js b/webapp/src/index.js
index 8bc30f4..3ea19f1 100644
--- a/webapp/src/index.js
+++ b/webapp/src/index.js
@@ -1,53 +1,16 @@
import React from 'react';
-import ReactDOM from 'react-dom/client';
+import ReactDOM from 'react-dom';
import './index.css';
+import App from './App';
import reportWebVitals from './reportWebVitals';
-import Navbar from './components/navbar/NavBar';
-import AddUser from './components/adduser/AddUser';
-import Login from './components/login/Login';
-import { AuthProvider } from './components/authcontext';
-import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
-import CssBaseline from '@mui/material/CssBaseline';
-import Typography from '@mui/material/Typography';
-import StartButton from './components/startbutton/StartButton';
-import Game from './components/game/Game';
-const root = ReactDOM.createRoot(document.getElementById('root'));
-root.render(
+ReactDOM.render(
-
-
-
-
-
- Bienvenidos al curso 2024 de arquitectura de software somos el grupo :
-
- wiq_es04c
-
- } />
- } />
- } />
- } />
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
-
-
+ ,
+ document.getElementById('root')
);
reportWebVitals();
\ No newline at end of file