PR Xel #1
PR Xel #1
Conversation
Components style
Components style
Master clone
randome location setTimeout
Components style
imports ordered
Components style
ready for deploy
|
@merunga @lupomontero @AdrianaHY este proyecto esta terminado tal vez quieran darle un vistazo al código y compartir algo de feedback adicional comparto el link de la implementación: https://conquering-planets.netlify.app/ |
There was a problem hiding this comment.
Algo que me gusto mucho fue el diseño. Tu código es fácil de leer, La primer recomendación que tengo es sobre la creación de mucho archivos .css , una alternativa puede ser el uso de css modules, una segunda recomendación es incorporar eslint para buenenas practicas, me gusto el uso de Redux muy Pro.
| import React from "react"; | ||
| import { BrowserRouter, Switch, Route } from "react-router-dom"; | ||
|
|
||
| import configureStore from './store/configureStore'; | ||
| import { Provider } from 'react-redux'; | ||
|
|
||
| import HomeView from './components/homeView/HomeView'; | ||
| import Instructions from './components/instructions/Instructions'; | ||
| import GeneralInfo from './components/General-Info/general-info/GeneralInfo'; | ||
| import GameView from "./components/GameView/GameView"; | ||
|
|
||
| import './App.css'; |
| <Switch> | ||
| <Route exact path="/" render={() => <HomeView />} /> | ||
| <Route path="/instructions" render={() => <Instructions />} /> | ||
| <Route path="/general-info" render={() => <GeneralInfo />} /> | ||
| <Route path='/game' render={() => <GameView />} /> | ||
| </Switch> |
There was a problem hiding this comment.
para Modularizar aun más puedes trasladar tus rutas a otro archivo
| import React from 'react'; | ||
| import ovni4 from '../../images/ovni4.png'; | ||
| import Btn from '../button/Button'; | ||
| import './game-over.css'; |
There was a problem hiding this comment.
| import './game-over.css'; | |
| import './gameover.css'; |
| <div className='game-over-view'> | ||
| <h1 className='text-game-over'>JUEGO TERMINADO</h1> | ||
| <h2 className='text-game-over-2'>!Felicidades haz ganado!</h2> | ||
| <img src={ovni4} alt="end" className='ovni4' /> |
There was a problem hiding this comment.
Recuerda que los buscadores usan la descripción para indexar imágenes
| <h1 className='text-game-over'>JUEGO TERMINADO</h1> | ||
| <h2 className='text-game-over-2'>!Felicidades haz ganado!</h2> | ||
| <img src={ovni4} alt="end" className='ovni4' /> | ||
| <Btn name="volver a jugar" route='/general-info' classLink='link-instructions' classBtn='btn-instruction' /> |
There was a problem hiding this comment.
me gusta que reutilizas los componentes
| </div> | ||
| <div className='container-place-planets'> | ||
| <div className='text-place-planet planets'> | ||
| <p className='text-general-info'>Acomoda tus planetas en el tablero</p> |
There was a problem hiding this comment.
| <p className='text-general-info'>Acomoda tus planetas en el tablero</p> | |
| <p className='text-general-info'> | |
| Acomoda tus planetas en el tablero | |
| </p> |
| function Planet(props) { | ||
| return ( | ||
| <> | ||
| <div className={props.classBtn}></div> |
There was a problem hiding this comment.
destructuración
| function Planet(props) { | |
| return ( | |
| <> | |
| <div className={props.classBtn}></div> | |
| function Planet({classBtn}) { | |
| return ( | |
| <> | |
| <div className={classBtn}></div> |
| @@ -0,0 +1,100 @@ | |||
| /* .container-instruction-view{ | |||
| @@ -0,0 +1,34 @@ | |||
| const columns = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J']; | |||
| const rows = ['A', 1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; | |||
|
|
|||
There was a problem hiding this comment.
te recomiendo definir mejor el nombre del archivo
| guessLocation: false | ||
| }); | ||
| } else { | ||
| console.log('ya no puedes guardar mas ubicaciones'); |
There was a problem hiding this comment.
| console.log('ya no puedes guardar mas ubicaciones'); | |
No description provided.