diff --git a/backend/heats.go b/backend/heats.go
index c3c34bf..31c0288 100644
--- a/backend/heats.go
+++ b/backend/heats.go
@@ -10,10 +10,11 @@ import (
 )
 
 type Surfer struct {
-	Athlete  Athlete `json:"surfer"`
-	Color    string  `json:"color"`
-	Priority string  `json:"priority"`
-	Score    string  `json:"score"`
+	Name     string `json:"name"`
+	Category string `json:"category"`
+	Color    string `json:"color"`
+	Priority string `json:"priority"`
+	Score    string `json:"score"`
 }
 
 type Heat struct {
@@ -34,6 +35,10 @@ func heatName(heat Heat) string {
 func (app *App) SaveHeat(c *gin.Context) {
 	var heat Heat
 
+	// body, _ := io.ReadAll(c.Request.Body)
+
+	// log.Printf("save: %+v", string(body))
+
 	err := c.ShouldBind(&heat)
 
 	if err != nil {
diff --git a/backend/http.go b/backend/http.go
index 48b47c5..a5b87f1 100644
--- a/backend/http.go
+++ b/backend/http.go
@@ -93,4 +93,5 @@ func (app *App) RegisterApiRoutes() {
 	// api.GET("/runningheat", app.LoadRunning)
 	api.GET("/loadsurfers", app.LoadSurfers)
 	api.POST("/savesurfer", app.SaveSurfer)
+	api.POST("/deletesurfer", app.DeleteSurfer)
 }
diff --git a/backend/surfers.go b/backend/surfers.go
index d9058ec..a8a67e0 100644
--- a/backend/surfers.go
+++ b/backend/surfers.go
@@ -15,7 +15,7 @@ type Athlete struct {
 }
 
 func surferName(athlete Athlete) string {
-	str := fmt.Sprintf("%s.%s", athlete.Name, athlete.Category)
+	str := fmt.Sprintf("%s-%s", athlete.Name, athlete.Category)
 	str = strings.ReplaceAll(str, " ", "_")
 	return str
 }
@@ -50,3 +50,26 @@ func (app *App) SaveSurfer(c *gin.Context) {
 
 	c.JSON(http.StatusOK, gin.H{"status": "saved"})
 }
+
+func (app *App) DeleteSurfer(c *gin.Context) {
+	var athlete Athlete
+
+	err := c.ShouldBind(&athlete)
+
+	if err != nil {
+		log.Printf("req error: %+v", err)
+		c.JSON(http.StatusBadRequest, gin.H{"error": err.Error()})
+		return
+	}
+
+	log.Printf("surfer: %+v", athlete)
+
+	err = app.DB.Delete("Surfers", surferName(athlete))
+	if err != nil {
+		log.Printf("set error: %+v", err)
+		c.JSON(http.StatusInternalServerError, gin.H{"status": fmt.Sprintf("Error: %+v", err)})
+		return
+	}
+
+	c.JSON(http.StatusOK, gin.H{"status": "deleted"})
+}
diff --git a/frontend/src/lib/select.svelte b/frontend/src/lib/select.svelte
index a086bce..7bcb404 100644
--- a/frontend/src/lib/select.svelte
+++ b/frontend/src/lib/select.svelte
@@ -6,18 +6,17 @@
 	export let handleSelect;
 	export let element;
 
-	console.log(`options: ${JSON.stringify(options)}`)
-
+	console.log(`options: ${JSON.stringify(options)}`);
 </script>
 
 <label class="label" for={id}>{label}</label>
 <select name={id} {id} bind:value on:change={handleSelect}>
 	{#each options as option}
 		{#if element}
-			<option value={option}>{option[element]}</option>
+			<option value={option[element]}>{option[element]}</option>
 		{:else}
 			<option value={option}>{option}</option>
-		{/if}	
+		{/if}
 	{/each}
 </select>
 
diff --git a/frontend/src/routes/setup/+page.svelte b/frontend/src/routes/setup/+page.svelte
index 4a4c905..ac6a8c4 100644
--- a/frontend/src/routes/setup/+page.svelte
+++ b/frontend/src/routes/setup/+page.svelte
@@ -44,10 +44,12 @@
 	}
 
 	async function loadHeats() {
+		heats = [];
 		const res = await fetch(`/api/loadheats`);
 		const data = await res.json();
 		for (let i in data) {
 			heats[i] = data[i];
+			heats = heats;
 			console.log(`${i} loadHeats: ${JSON.stringify(data[i])}`);
 		}
 	}
@@ -76,7 +78,7 @@
 			if (data[i].category === category) {
 				athletes.push(data[i]);
 				console.log(`${i} loadSurfers: ${JSON.stringify(data[i])}`);
-			} 
+			}
 		}
 		athletes = athletes;
 		console.log(`category: ${JSON.stringify(athletes)}`);
@@ -144,7 +146,11 @@
 			return;
 		}
 
-		heat.surfers = surfer_list;
+		console.log(`saving heat: ${JSON.stringify(heat)}`);
+
+		// heat.surfers = surfer_list;
+
+		console.log(`saving complete heat: ${JSON.stringify(heat)}`);
 
 		const res = await fetch(`/api/saveheat`, {
 			method: 'POST',
@@ -240,7 +246,7 @@
 
 <hr />
 <div class="list">
-	{#each heats as h, id}
+	{#each heats || [] as h, id}
 		<div class="surfer">
 			<Button handleClick={() => setHeat(id)} label="{h.round} {h.number} {h.category}" />
 			<Button handleClick={() => deleteHeat(id)} label="X" />
diff --git a/frontend/src/routes/surfers/+page.svelte b/frontend/src/routes/surfers/+page.svelte
index d8ded15..92df5d0 100644
--- a/frontend/src/routes/surfers/+page.svelte
+++ b/frontend/src/routes/surfers/+page.svelte
@@ -10,30 +10,44 @@
 
 	let surfer = {};
 
-	$: value = '';
+	// $: value = '';
 
 	function resetSurfer() {
 		surfer = {
 			firstname: '',
 			lastname: '',
-			name: '',
 			category: ''
 		};
 	}
 
 	async function loadSurfers() {
+		surfers = [];
 		const res = await fetch(`/api/loadsurfers`);
 		const data = await res.json();
 		for (let i in data) {
-			const flname = data[i].name.split(" ");
+			const flname = data[i].name.split('.');
 			data[i].firstname = flname[0];
 			data[i].lastname = flname[1];
 			surfers[i] = data[i];
-			
+			surfers = surfers;
 			console.log(`${i} retval: ${JSON.stringify(data[i])}`);
 		}
 	}
 
+	async function deleteSurfer(surfer) {
+		console.log(`deleting: ${JSON.stringify(surfer)}`);
+		const res = await fetch(`/api/deletesurfer`, {
+			method: 'POST',
+			body: JSON.stringify(surfer),
+			headers: {
+				'Content-Type': 'application/json'
+			}
+		});
+
+		console.log(`deleted surfer: ${JSON.stringify(res)}`);
+		loadSurfers();
+	}
+
 	async function save() {
 		if (surfer.firstname === '') {
 			alert('Must have a name');
@@ -50,11 +64,14 @@
 			return;
 		}
 
-		surfer.name = `${surfer.firstname} ${surfer.lastname}`
+		surfer.name = `${surfer.firstname} ${surfer.lastname}`;
 
 		const res = await fetch(`/api/savesurfer`, {
 			method: 'POST',
-			body: JSON.stringify(surfer),
+			body: JSON.stringify({
+				name: `${surfer.firstname}.${surfer.lastname}`,
+				category: surfer.category
+			}),
 			headers: {
 				'Content-Type': 'application/json'
 			}
@@ -86,10 +103,8 @@
 
 <hr />
 
-<label for="surfer">{JSON.stringify(surfer)}</label>
-
-<hr />
-
 {#each surfers as s}
-	<label for={s}>{s.firstname} {s.lastname} - {s.category}</label><br />
+	<Button label="{s.firstname} {s.lastname} - {s.category}" />
+	<Button handleClick={() => deleteSurfer(s)} label="X" />
+	<br />
 {/each}}