diff options
| author | Jan Tuomi <jans.tuomi@gmail.com> | 2021-06-30 11:33:40 +0300 |
|---|---|---|
| committer | Jan Tuomi <jans.tuomi@gmail.com> | 2021-06-30 11:33:40 +0300 |
| commit | f021b52028f5965516671b7f53e7e71543a8ae52 (patch) | |
| tree | 62a0f9499bd75c1bc46de09fda3a0e0ce092d70d /frontend/pages/index.tsx | |
| parent | ac31a7d9d43d3dcaa37906569dcb8eaf8429b3bf (diff) | |
Do things
Diffstat (limited to 'frontend/pages/index.tsx')
| -rw-r--r-- | frontend/pages/index.tsx | 47 |
1 files changed, 47 insertions, 0 deletions
diff --git a/frontend/pages/index.tsx b/frontend/pages/index.tsx new file mode 100644 index 0000000..4f3f4af --- /dev/null +++ b/frontend/pages/index.tsx @@ -0,0 +1,47 @@ +import Head from "next/head"; +import { ReactElement, useEffect, useState } from "react"; +import { io } from "socket.io-client"; +import styles from "../styles/Home.module.css"; +import * as config from "../config"; + +const socket = io(config.backendUrl); + +const Home = (): ReactElement => { + const [value, setValue] = useState<number | undefined>(undefined); + + useEffect(() => { + socket.on("connect", () => { + console.log("connected:", socket.id); + }); + socket.on("disconnect", (reason: string) => { + console.log("disconnected, reason:", reason); + }); + socket.on("update", (arg: number) => { + console.log("update:", arg); + setValue(arg); + }); + }); + + const increment = () => { + socket.emit("increment"); + }; + + return ( + <div className={styles.container}> + <Head> + <title>tomi.science</title> + <meta name="description" content="Tomi Koskinen's academic portfolio" /> + <link rel="icon" href="/favicon.ico" /> + </Head> + <div> + value: + {value} + </div> + <div> + <button onClick={increment}>increment</button> + </div> + </div> + ); +}; + +export default Home; |