Learn react code example
Example 1: what is react
This is a formatted version of Komadori's answer
(https://tinyurl.com/Komadori)
React is a JavaScript library for building user interfaces.
It is maintained by Facebook and a community of
individual developers and companies.
React can be used as a base in the development of single-page
or mobile applications.
Example 2: react js documentation
//With node and npm already installed for basic start
npx create-react-app my-app-name
// if you want to use npm
npx create-react-app my-app-name --npm
//if you want to use typescript
npx create-react-app my-app-name --template typescript
yarn start // app will be hosted on localhost:3000
/* start making changes at ./my-app-name/src/App.js
React documentation: https://reactjs.org/docs/hello-world.html
*/
Example 3: React js tutorial
npx create-react-app my-app
cd my-app
cd src
rm -f *
del *
cd ..
Example 4: react quick tutorial
ReactDOM.render(
<Hello />,
document.getElementById("root")
);
Example 5: create tic tac toe game in react using jsx files
useEffect(()=>{
//checking winner row and col
for (let i = 0; i <= 2; i++){
const idx = (i % 3) * 3 // -> 0,3,6
//check row
if ( (table[idx] + table[idx+1] + table[idx+2] )=== 9 || (table[idx] + table[idx+1] + table[idx+2] ) === 15){
setWinner([idx,idx+1,idx+2])
gameOver()
}
//check col
if ((table[i] + table[i+3] + table[i+6] )=== 9 || (table[i] + table[i+3] + table[i+6] ) === 15){
setWinner([i,i+3,i+6])
gameOver()
}
}
//checking winner diagonal
if ((table[0] + table[4] + table[8] ) === 15 || (table[0] + table[4] + table[8] ) === 9 ){
setWinner([0, 4, 8])
gameOver()
}
if ((table[2] + table[4] + table[6] ) === 9 || (table[2] + table[4] + table[6] ) ===15){
setWinner([2, 4, 6])
gameOver()
}
// check if table completed
if (table.indexOf(0) === -1){
gameOver()
}
}, [table])