diff --git a/backend/cmd/main.go b/backend/cmd/main.go index f06640a..5ccb016 100644 --- a/backend/cmd/main.go +++ b/backend/cmd/main.go @@ -12,18 +12,15 @@ import ( // The button state as represented in memory type ButtonState struct { - PressCount int `json:"pressCount"` + pressCount int } // This is what a handler with a receiver looks like // Keep in mind that concurrent state access is not (usually) safe // And will in pracice be guarded by a mutex func (b *ButtonState) pressHandler(w http.ResponseWriter, r *http.Request) { - if r.Method != "POST" { - b.PressCount++ - } - - response, err := json.Marshal(b) + b.pressCount++ + response, err := json.Marshal(b.pressCount) if err != nil { http.Error(w, err.Error(), http.StatusInternalServerError) return @@ -41,13 +38,13 @@ func handler(w http.ResponseWriter, r *http.Request) { func main() { database.DbConnect() - b := &ButtonState{PressCount: 0} + b := &ButtonState{pressCount: 0} // Mounting the handlers fs := http.FileServer(http.Dir("static")) http.Handle("/", fs) http.HandleFunc("/hello", handler) - http.HandleFunc("/api/button", b.pressHandler) + http.HandleFunc("/button", b.pressHandler) // Start the server on port 8080 println("Currently listening on http://localhost:8080") diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 20e5f1f..9d045e1 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -1,9 +1,11 @@ +import { useState } from "react"; import reactLogo from "./assets/react.svg"; import viteLogo from "/vite.svg"; import "./App.css"; -import { CountButton } from "./Components/CountButton"; function App(): JSX.Element { + const [count, setCount] = useState(0); + return ( <>
@@ -16,7 +18,13 @@ function App(): JSX.Element {

Vite + React

- +

Edit src/App.tsx and save to test HMR

diff --git a/frontend/src/Components/CountButton.tsx b/frontend/src/Components/CountButton.tsx deleted file mode 100644 index cce55af..0000000 --- a/frontend/src/Components/CountButton.tsx +++ /dev/null @@ -1,39 +0,0 @@ -import { useState, useEffect } from "react"; - -// Interface for the response from the server -// This should eventually reside in a dedicated file -interface CountResponse { - pressCount: number; -} - -// Some constants for the button -const BUTTON_ENDPOINT = "/api/button"; - -// A simple button that counts how many times it's been pressed -export function CountButton(): JSX.Element { - const [count, setCount] = useState(NaN); - - // useEffect with a [] dependency array runs only once - useEffect(() => { - async function getCount(): Promise { - const response = await fetch(BUTTON_ENDPOINT); - const data = (await response.json()) as CountResponse; - setCount(data.pressCount); - } - void getCount(); - }, []); - - // This is what runs on every button click - function press(): void { - async function pressPost(): Promise { - await fetch(BUTTON_ENDPOINT, { method: "POST" }); - const response = await fetch(BUTTON_ENDPOINT); - const data = (await response.json()) as CountResponse; - setCount(data.pressCount); - } - void pressPost(); - } - - // Return some JSX with the button and associated handler - return ; -} diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts index f8ec812..d366e8c 100644 --- a/frontend/vite.config.ts +++ b/frontend/vite.config.ts @@ -4,19 +4,4 @@ import react from "@vitejs/plugin-react-swc"; // https://vitejs.dev/config/ export default defineConfig({ plugins: [react()], - // build: { - // outDir: '../server/public' // Override default outDir('dist') - // }, - server: { - port: 3000, - open: true, - proxy: { - "/api": { - target: "http://localhost:8080/api", - changeOrigin: true, - secure: false, - rewrite: (path): string => path.replace(/^\/api/, ""), - }, - }, - }, });