diff --git a/app/backend/InputOutputHandler.tsx b/app/backend/InputOutputHandler.tsx
index bcdd034..fc9b9d6 100644
--- a/app/backend/InputOutputHandler.tsx
+++ b/app/backend/InputOutputHandler.tsx
@@ -9,7 +9,7 @@ import { getWeather } from "./weather";
 import { changeHistory, getHistory } from "./database";
 
 const InputOutputBackend: React.FC = () => {
-  // # variables
+  //#region variables
   type Message = {
     role: string
     content: string
@@ -37,7 +37,7 @@ const InputOutputBackend: React.FC = () => {
   }
 
   console.log(setSelectedIndex)
-
+  //#region useEffect
   useEffect(() => {
     setMessages(chatHistory.chats[chatHistory.selectedIndex].messages)
   }, [chatHistory.selectedIndex])
@@ -86,6 +86,7 @@ const InputOutputBackend: React.FC = () => {
     }
   }, [chatHistory])
 
+  //#region functions
   const getWeatherHere = async () => {
     setWeatherData(await getWeather({ "unit_type": preferredMeasurement, "city": localStorage.getItem("weatherInfo") || "New York" }))
     console.log("Got the Data!")
@@ -104,7 +105,7 @@ const InputOutputBackend: React.FC = () => {
     }
     setChatHistoryTriggered(true)
   }
-
+  //#region system-prompt
   useEffect(() => {
     console.log("creating system prompt")
     console.log(weatherData)
@@ -133,7 +134,7 @@ const InputOutputBackend: React.FC = () => {
     console.log(messages)
   }, [systemMessage])
 
-
+  //#region more variables and functions
   const conversationRef = useRef<HTMLDivElement>(null)
   const [copyClicked, setCopyClicked] = useState(false)
   const [accessToken, setAccessToken] = useState("")
@@ -144,7 +145,7 @@ const InputOutputBackend: React.FC = () => {
   const [isRecording, setIsRecording] = useState(false)
   const mediaRecorderRef = useRef<MediaRecorder | null>(null)
   const audioChunks = useRef<Blob[]>([])
-
+  //#region chat functions
   useEffect(() => {
     getNewToken()
 
@@ -266,7 +267,7 @@ const InputOutputBackend: React.FC = () => {
       }
     }
   }
-
+  //#region speech recognition 
   const startRecording = async (): Promise<string> => {
     const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
     const mediaRecorder = new MediaRecorder(stream);
@@ -309,7 +310,7 @@ const InputOutputBackend: React.FC = () => {
       stopRecording();
     }
   };
-
+  //#region chat buttons
   const handleStopClick = () => {
     endGetWorker()
     getNewToken()
@@ -356,7 +357,7 @@ const InputOutputBackend: React.FC = () => {
     setCopyClicked(false)
   }
 
-
+  //#region The "html" return
   return (
     <>
       <ConversationFrontend