From f021b52028f5965516671b7f53e7e71543a8ae52 Mon Sep 17 00:00:00 2001
From: Jan Tuomi <jans.tuomi@gmail.com>
Date: Wed, 30 Jun 2021 11:33:40 +0300
Subject: Do things

---
 frontend/pages/index.tsx | 47 +++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 47 insertions(+)
 create mode 100644 frontend/pages/index.tsx

(limited to 'frontend/pages/index.tsx')

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;
-- 
cgit v1.3

