diff --git a/staff/joseramon-rodriguez/shapes/minesweeper/App.jsx b/staff/joseramon-rodriguez/shapes/minesweeper/App.jsx
new file mode 100644
index 000000000..04a1e4324
--- /dev/null
+++ b/staff/joseramon-rodriguez/shapes/minesweeper/App.jsx
@@ -0,0 +1,33 @@
+function App() {
+ const matrix = new Array(8)
+
+ for (let i = 0; i < matrix.length; i++) {
+ const cell = {
+ isBomb: false,
+ isClicked: false,
+ bombAside: 0,
+ }
+
+ matrix[i] = new Array(8).fill(cell)
+ }
+
+ const [board, setBoard] = React.useState(matrix)
+
+ return <>
+
+
+
+ {board.map((row, i) => row.map((cell, j) =>
+
+
+ )).flat(Infinity)}
+
+
+
+
+ >
+
+}
\ No newline at end of file
diff --git a/staff/joseramon-rodriguez/shapes/minesweeper/index.css b/staff/joseramon-rodriguez/shapes/minesweeper/index.css
new file mode 100644
index 000000000..140607ba5
--- /dev/null
+++ b/staff/joseramon-rodriguez/shapes/minesweeper/index.css
@@ -0,0 +1,15 @@
+.board {
+ display: grid;
+ border: 2px solid black;
+ width: 400px;
+ height: 400px;
+ gap: 1px;
+}
+
+.clicked-cell {
+ background-color: transparent;
+}
+
+.no-clicked-cell {
+ background-color: gray;
+}
\ No newline at end of file
diff --git a/staff/joseramon-rodriguez/shapes/minesweeper/index.html b/staff/joseramon-rodriguez/shapes/minesweeper/index.html
new file mode 100644
index 000000000..a83d8bdb0
--- /dev/null
+++ b/staff/joseramon-rodriguez/shapes/minesweeper/index.html
@@ -0,0 +1,25 @@
+
+
+
+
+
+
+ Mine sweeper
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/staff/joseramon-rodriguez/shapes/minesweeper/index.jsx b/staff/joseramon-rodriguez/shapes/minesweeper/index.jsx
new file mode 100644
index 000000000..07b35ce7e
--- /dev/null
+++ b/staff/joseramon-rodriguez/shapes/minesweeper/index.jsx
@@ -0,0 +1,3 @@
+const root = ReactDOM.createRoot(document.querySelector('#root'))
+
+root.render()
\ No newline at end of file
diff --git a/staff/joseramon-rodriguez/shapes/tic-tac-toe/index.jsx b/staff/joseramon-rodriguez/shapes/tic-tac-toe/index.jsx
index 42eba7f3d..179ff0b05 100644
--- a/staff/joseramon-rodriguez/shapes/tic-tac-toe/index.jsx
+++ b/staff/joseramon-rodriguez/shapes/tic-tac-toe/index.jsx
@@ -18,24 +18,24 @@ function App() {
function play(row, column) {
console.log('click')
- //TODO FIX BOARD STATE -> ASK
+
const prevBoard = board
- const board = []
+ const newBoard = []
for (let i = 0; i < prevBoard.length; i++)
- board[i] = new Array(prevBoard[0].length).fill(0)
+ newBoard[i] = new Array(prevBoard[0].length).fill(0)
for (const i in prevBoard)
for (const j in prevBoard[i])
- board[i][j] = prevBoard[i][j]
+ newBoard[i][j] = prevBoard[i][j]
if (turn % 2 === 0)
- board[row][column] = 1
+ newBoard[row][column] = 1
else
- board[row][column] = 2
+ newBoard[row][column] = 2
- setBoard(board)
- setTurn(turn++)
+ setBoard(newBoard)
+ setTurn(turn + 1)
}
return <>
@@ -45,7 +45,7 @@ function App() {
gridTemplateColumns: `repeat(${board.length}, 1fr)`,
gridTemplateRows: `repeat(${board.length}, 1fr)`
}}>
- {board.map((row, i) => row.map((column, j) => play(i, j)}>{getCellChar(board[i][j])}
)).flat(Infinity)}
+ {board.map((row, i) => row.map((column, j) => play(i, j)}>{getCellChar(board[i][j])}
)).flat(Infinity)}