53 lines
1.0 KiB
JavaScript
53 lines
1.0 KiB
JavaScript
import React from "react"
|
|
import ReactDOM from "react-dom/client"
|
|
|
|
import axios from "axios"
|
|
|
|
import "./index.css"
|
|
|
|
const API_ENDPOINT = import.meta.env.PROD ? "/api" : `http://${window.location.hostname}:3000/api`
|
|
|
|
const App = () => {
|
|
const [loading, setLoading] = React.useState(true)
|
|
const [randomWord, setRandomWord] = React.useState(null)
|
|
|
|
async function loadRandom({
|
|
random = true,
|
|
} = {}) {
|
|
setLoading(true)
|
|
|
|
let { data } = await axios({
|
|
url: API_ENDPOINT,
|
|
method: "GET",
|
|
params: {
|
|
random,
|
|
},
|
|
})
|
|
|
|
setLoading(false)
|
|
|
|
setRandomWord(data)
|
|
}
|
|
|
|
React.useEffect(() => {
|
|
loadRandom()
|
|
}, [])
|
|
|
|
return <div className="app">
|
|
{
|
|
loading ? <p>Loading...</p> : <h1>{randomWord}</h1>
|
|
}
|
|
|
|
<footer>
|
|
<a href="https://git.ragestudio.net/srgooglo/monstercanker">GitHub</a>
|
|
<a href={API_ENDPOINT}>API</a>
|
|
</footer>
|
|
</div>
|
|
}
|
|
|
|
ReactDOM.createRoot(document.getElementById("root")).render(
|
|
<React.StrictMode>
|
|
<App />
|
|
</React.StrictMode>,
|
|
)
|