diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..f673a71
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5502
+}
\ No newline at end of file
diff --git a/Aufgaben/Aufgabe_09_2020-06-24/client.js b/Aufgaben/Aufgabe_09_2020-06-24/client.js
new file mode 100644
index 0000000..cdfe4ec
--- /dev/null
+++ b/Aufgaben/Aufgabe_09_2020-06-24/client.js
@@ -0,0 +1,96 @@
+"use strict";
+var clientSide;
+(function (clientSide) {
+    document.querySelector("#getJson").addEventListener("click", communicateJson);
+    document.querySelector("#getHtml").addEventListener("click", communicateHtml);
+    //communicate("https://theoneandgis.herokuapp.com/");
+    async function communicate(_path) {
+        let formData = new FormData(document.forms[0]);
+        let url = "https://theoneandgis.herokuapp.com" + _path;
+        //let url: string = "http://localhost:8100" + _path;
+        let query = new URLSearchParams(formData);
+        url += "?" + query.toString();
+        let response = await fetch(url);
+        let responseUrl;
+        if (_path == "/json") {
+            responseUrl = await response.json();
+            console.log(responseUrl);
+            document.getElementById("htmlResponse").innerHTML = JSON.stringify(responseUrl);
+        }
+        if (_path == "/html") {
+            let responseUrl = await response.text();
+            console.log("html-log: " + responseUrl);
+            document.getElementById("htmlResponse").innerHTML = responseUrl;
+        }
+    }
+    function communicateJson() {
+        communicate("/json");
+    }
+    function communicateHtml() {
+        communicate("/html");
+    }
+})(clientSide || (clientSide = {}));
+/*namespace tutorial09 {
+
+    /*console.log(formData.get("vorname"));
+
+    for (let entry of formData) {
+        console.log(entry);
+        console.log("name: " + entry[0]);
+        console.log("value: " + entry[1]);
+    }
+
+    // Trennlinie
+
+    (<HTMLButtonElement>document.querySelector("#getHtml")).addEventListener("click", startCommunication);
+
+    function startCommunication(): void {
+        communicate("http://localhost:8100");
+    }
+
+    async function communicate(_url: RequestInfo): Promise<void> {
+
+        // let response: Response = await fetch(_url);
+        // let jsonObj = await response.json();
+
+        let formData: FormData = new FormData(document.forms[0]);
+        let formquery: URLSearchParams = new URLSearchParams(<any>formData);
+        _url += "?" + formquery.toString();
+        console.log("_url: " + _url);
+        //let url: string = "https://theoneandgis.herokuapp.com/";
+        //let query: URLSearchParams = new URLSearchParams(<any>formData);
+
+        //url += "?" + query.toString();
+
+        //debugger;
+
+        //let response: Response = await fetch(_url);
+        let response: Response = await fetch("Data.json");
+        console.log("response: " + response);
+        console.log(response);
+        let theAnswer: string = await response.text;
+        //let text: string = theAnswer
+        
+
+        console.log("theAnswer: " + theAnswer);
+        //let query: URLSearchParams = new URLSearchParams(theAnswer);
+        //console.log(query.toString());
+        //console.log( new URLSearchParams(theAnswer).values() );
+        //console.log(query.keys() );
+        //let queryvorname: string = query.get("/?vorname")!;
+        //let querynachname: string = query.get("nachname")!;
+
+        //console.log(queryvorname);
+        //console.log(querynachname);
+
+        (<HTMLDivElement>document.querySelector("#htmlResponse")).innerHTML = `${theAnswer}`;
+
+
+        // await fetch(url);
+        console.log(theAnswer);
+    }
+
+    console.log("hello");
+
+}*/
+//# sourceMappingURL=client.js.map
\ No newline at end of file
diff --git a/Aufgaben/Aufgabe_09_2020-06-24/client.js.map b/Aufgaben/Aufgabe_09_2020-06-24/client.js.map
new file mode 100644
index 0000000..5dd67e4
--- /dev/null
+++ b/Aufgaben/Aufgabe_09_2020-06-24/client.js.map
@@ -0,0 +1 @@
+{"version":3,"file":"client.js","sourceRoot":"","sources":["client.ts"],"names":[],"mappings":";AACA,IAAU,UAAU,CAuCnB;AAvCD,WAAU,UAAU;IAEI,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAE,CAAC,gBAAgB,CAAC,OAAO,EAAE,eAAe,CAAC,CAAC;IAC/E,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAE,CAAC,gBAAgB,CAAC,OAAO,EAAE,eAAe,CAAC,CAAC;IAEnG,qDAAqD;IAErD,KAAK,UAAU,WAAW,CAAC,KAAa;QAEpC,IAAI,QAAQ,GAAa,IAAI,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;QACzD,IAAI,GAAG,GAAW,oCAAoC,GAAG,KAAK,CAAC;QAC/D,oDAAoD;QACpD,IAAI,KAAK,GAAoB,IAAI,eAAe,CAAM,QAAQ,CAAC,CAAC;QAEhE,GAAG,IAAI,GAAG,GAAG,KAAK,CAAC,QAAQ,EAAE,CAAC;QAE9B,IAAI,QAAQ,GAAa,MAAM,KAAK,CAAC,GAAG,CAAC,CAAC;QAC1C,IAAI,WAAmB,CAAC;QAExB,IAAI,KAAK,IAAI,OAAO,EAAE;YAClB,WAAW,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAC;YACpC,OAAO,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;YACR,QAAQ,CAAC,cAAc,CAAC,cAAc,CAAE,CAAC,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;SACrG;QAED,IAAI,KAAK,IAAI,OAAO,EAAE;YAClB,IAAI,WAAW,GAAW,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAC;YAChD,OAAO,CAAC,GAAG,CAAC,YAAY,GAAG,WAAW,CAAC,CAAC;YACvB,QAAQ,CAAC,cAAc,CAAC,cAAc,CAAE,CAAC,SAAS,GAAG,WAAW,CAAC;SACrF;IACL,CAAC;IAED,SAAS,eAAe;QACpB,WAAW,CAAC,OAAO,CAAC,CAAC;IACzB,CAAC;IACD,SAAS,eAAe;QACpB,WAAW,CAAC,OAAO,CAAC,CAAC;IACzB,CAAC;AAEL,CAAC,EAvCS,UAAU,KAAV,UAAU,QAuCnB;AAcD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8DG"}
\ No newline at end of file
diff --git a/Aufgaben/Aufgabe_09_2020-06-24/client.ts b/Aufgaben/Aufgabe_09_2020-06-24/client.ts
new file mode 100644
index 0000000..330399e
--- /dev/null
+++ b/Aufgaben/Aufgabe_09_2020-06-24/client.ts
@@ -0,0 +1,119 @@
+
+namespace clientSide {
+
+    (<HTMLButtonElement>document.querySelector("#getJson")).addEventListener("click", communicateJson);
+    (<HTMLButtonElement>document.querySelector("#getHtml")).addEventListener("click", communicateHtml);
+
+    //communicate("https://theoneandgis.herokuapp.com/");
+
+    async function communicate(_path: string): Promise<void> {
+
+        let formData: FormData = new FormData(document.forms[0]);
+        let url: string = "https://theoneandgis.herokuapp.com" + _path;
+        //let url: string = "http://localhost:8100" + _path;
+        let query: URLSearchParams = new URLSearchParams(<any>formData);
+
+        url += "?" + query.toString();
+
+        let response: Response = await fetch(url);
+        let responseUrl: string;
+    
+        if (_path == "/json") {
+            responseUrl = await response.json();
+            console.log(responseUrl);
+            (<HTMLDivElement>document.getElementById("htmlResponse")).innerHTML = JSON.stringify(responseUrl);
+        }
+
+        if (_path == "/html") {
+            let responseUrl: string = await response.text();
+            console.log("html-log: " + responseUrl);
+            (<HTMLDivElement>document.getElementById("htmlResponse")).innerHTML = responseUrl;
+        }       
+    }
+
+    function communicateJson(): void {
+        communicate("/json");
+    }
+    function communicateHtml(): void {
+        communicate("/html");
+    }
+
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+/*namespace tutorial09 {
+
+    /*console.log(formData.get("vorname"));
+
+    for (let entry of formData) {
+        console.log(entry);
+        console.log("name: " + entry[0]);
+        console.log("value: " + entry[1]);
+    }
+
+    // Trennlinie
+
+    (<HTMLButtonElement>document.querySelector("#getHtml")).addEventListener("click", startCommunication);
+
+    function startCommunication(): void {
+        communicate("http://localhost:8100");
+    }
+
+    async function communicate(_url: RequestInfo): Promise<void> {
+
+        // let response: Response = await fetch(_url);
+        // let jsonObj = await response.json();
+
+        let formData: FormData = new FormData(document.forms[0]);
+        let formquery: URLSearchParams = new URLSearchParams(<any>formData);
+        _url += "?" + formquery.toString();
+        console.log("_url: " + _url);
+        //let url: string = "https://theoneandgis.herokuapp.com/";
+        //let query: URLSearchParams = new URLSearchParams(<any>formData);
+
+        //url += "?" + query.toString();
+
+        //debugger;
+
+        //let response: Response = await fetch(_url);
+        let response: Response = await fetch("Data.json");
+        console.log("response: " + response);
+        console.log(response);
+        let theAnswer: string = await response.text;
+        //let text: string = theAnswer
+        
+
+        console.log("theAnswer: " + theAnswer);
+        //let query: URLSearchParams = new URLSearchParams(theAnswer);
+        //console.log(query.toString());
+        //console.log( new URLSearchParams(theAnswer).values() );
+        //console.log(query.keys() );
+        //let queryvorname: string = query.get("/?vorname")!;
+        //let querynachname: string = query.get("nachname")!;
+
+        //console.log(queryvorname);
+        //console.log(querynachname);
+
+        (<HTMLDivElement>document.querySelector("#htmlResponse")).innerHTML = `${theAnswer}`;
+
+
+        // await fetch(url);
+        console.log(theAnswer);
+    }
+
+    console.log("hello");
+
+}*/
+
+
diff --git a/Aufgaben/Aufgabe_09_2020-06-24/form.html b/Aufgaben/Aufgabe_09_2020-06-24/form.html
new file mode 100644
index 0000000..219dfce
--- /dev/null
+++ b/Aufgaben/Aufgabe_09_2020-06-24/form.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <script src="client.js" defer></script>
+    <title>Formulare Kapitel 09</title>
+</head>
+<body>
+
+    <form method="" action="https://theoneandgis.herokuapp.com">
+        <label for="vorname">Name</label> <br>
+        <input type="text" id="vorname" name="vorname" value="Ben"> <br>
+        <label for="nachname">Geburtsjahr</label> <br>
+        <input type="text" id="nachname" name="nachname" value="Uchiha"> <br>
+        <button type="submit">Submit</button>
+        <button type="button" id="getHtml">HTML Button</button>
+        <button type="button" id="getJson">JSON Button</button>
+    </form>
+
+    <div id="htmlResponse"></div>
+
+    <hr>    
+
+</body>
+</html>
+
+<style>
+    button,label,input,div {
+        margin: 10px;
+    }
+</style>
\ No newline at end of file
diff --git a/Aufgaben/Aufgabe_09_2020-06-24/server.js b/Aufgaben/Aufgabe_09_2020-06-24/server.js
new file mode 100644
index 0000000..d119c92
--- /dev/null
+++ b/Aufgaben/Aufgabe_09_2020-06-24/server.js
@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ServerSide = void 0;
+const Http = require("http");
+const url = require("url");
+var ServerSide;
+(function (ServerSide) {
+    console.log("Starting server");
+    let port = Number(process.env.PORT);
+    // der als numerisches Objekt abgespeichert werden soll
+    if (!port)
+        port = 8100;
+    let server = Http.createServer();
+    server.addListener("request", handleRequest);
+    server.addListener("listening", handleListen);
+    server.listen(port);
+    function handleListen() {
+        console.log("Listening");
+    }
+    function handleRequest(_request, _response) {
+        console.log("http://localhost:8100" + `${_request.url}`);
+        let myData = url.parse(`${_request.url}`, true);
+        let myQuery = myData.query;
+        let splitThis = _request.url.slice(0, 5);
+        let myJsonString = JSON.stringify(myQuery);
+        // Damit ich im Hinterkopf behalte, dass das so funktioniert
+        // console.log("myQuery.vorname: " + myQuery.vorname );
+        // console.log("myQuery.nachname: " + myQuery.nachname);
+        if (splitThis == "/html") {
+            _response.setHeader("content-type", "application/json");
+            _response.setHeader("Access-Control-Allow-Origin", "*");
+        }
+        else if (splitThis == "/json") {
+            _response.setHeader("content-type", "text/html");
+            _response.setHeader("Access-Control-Allow-Origin", "*");
+        }
+        console.log(myJsonString);
+        _response.write(myJsonString);
+        _response.end();
+    }
+})(ServerSide = exports.ServerSide || (exports.ServerSide = {}));
+//# sourceMappingURL=server.js.map
\ No newline at end of file
diff --git a/Aufgaben/Aufgabe_09_2020-06-24/server.js.map b/Aufgaben/Aufgabe_09_2020-06-24/server.js.map
new file mode 100644
index 0000000..e9e6fa0
--- /dev/null
+++ b/Aufgaben/Aufgabe_09_2020-06-24/server.js.map
@@ -0,0 +1 @@
+{"version":3,"file":"server.js","sourceRoot":"","sources":["server.ts"],"names":[],"mappings":";;;AAAA,6BAA6B;AAC7B,2BAA2B;AAG3B,IAAiB,UAAU,CAyC1B;AAzCD,WAAiB,UAAU;IACvB,OAAO,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IAC/B,IAAI,IAAI,GAAW,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;IAC5C,uDAAuD;IACvD,IAAI,CAAC,IAAI;QACL,IAAI,GAAG,IAAI,CAAC;IAEhB,IAAI,MAAM,GAAgB,IAAI,CAAC,YAAY,EAAE,CAAC;IAC9C,MAAM,CAAC,WAAW,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC;IAC7C,MAAM,CAAC,WAAW,CAAC,WAAW,EAAE,YAAY,CAAC,CAAC;IAC9C,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAEpB,SAAS,YAAY;QACjB,OAAO,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B,CAAC;IAED,SAAS,aAAa,CAAC,QAA8B,EAAE,SAA8B;QACjF,OAAO,CAAC,GAAG,CAAC,uBAAuB,GAAG,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,CAAC;QAEzD,IAAI,MAAM,GAA2B,GAAG,CAAC,KAAK,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE,EAAE,IAAI,CAAC,CAAC;QACxE,IAAI,OAAO,GAAmB,MAAM,CAAC,KAAK,CAAC;QAC3C,IAAI,SAAS,GAAoB,QAAQ,CAAC,GAAI,CAAC,KAAK,CAAC,CAAC,EAAG,CAAC,CAAC,CAAC;QAC5D,IAAI,YAAY,GAAW,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;QAEnD,4DAA4D;QAC5D,uDAAuD;QACvD,wDAAwD;QAExD,IAAI,SAAS,IAAI,OAAO,EAAE;YACtB,SAAS,CAAC,SAAS,CAAC,cAAc,EAAE,kBAAkB,CAAC,CAAC;YACxD,SAAS,CAAC,SAAS,CAAC,6BAA6B,EAAE,GAAG,CAAC,CAAC;SAC3D;aACI,IAAI,SAAS,IAAI,OAAO,EAAE;YAC3B,SAAS,CAAC,SAAS,CAAC,cAAc,EAAE,WAAW,CAAC,CAAC;YACjD,SAAS,CAAC,SAAS,CAAC,6BAA6B,EAAE,GAAG,CAAC,CAAC;SAC3D;QAED,OAAO,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC;QAC1B,SAAS,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;QAC9B,SAAS,CAAC,GAAG,EAAE,CAAC;IACpB,CAAC;AACL,CAAC,EAzCgB,UAAU,GAAV,kBAAU,KAAV,kBAAU,QAyC1B"}
\ No newline at end of file
diff --git a/Aufgaben/Aufgabe_09_2020-06-24/server.ts b/Aufgaben/Aufgabe_09_2020-06-24/server.ts
new file mode 100644
index 0000000..082b4f1
--- /dev/null
+++ b/Aufgaben/Aufgabe_09_2020-06-24/server.ts
@@ -0,0 +1,46 @@
+import * as Http from "http";
+import * as url from "url";
+import { ParsedUrlQuery } from "querystring";
+
+export namespace ServerSide {
+    console.log("Starting server");                                                                    
+    let port: number = Number(process.env.PORT);                                                        
+    // der als numerisches Objekt abgespeichert werden soll
+    if (!port)                                                                                          
+        port = 8100;                                                                                    
+
+    let server: Http.Server = Http.createServer();                                                      
+    server.addListener("request", handleRequest);                                                       
+    server.addListener("listening", handleListen);                                                      
+    server.listen(port);                                                                                
+
+    function handleListen(): void {                                                                     
+        console.log("Listening");                                                                       
+    }
+
+    function handleRequest(_request: Http.IncomingMessage, _response: Http.ServerResponse): void {     
+        console.log("http://localhost:8100" + `${_request.url}`);   
+        
+        let myData: url.UrlWithParsedQuery = url.parse(`${_request.url}`, true);
+        let myQuery: ParsedUrlQuery = myData.query;
+        let splitThis: string = (<string>_request.url).slice(0 , 5);
+        let myJsonString: string = JSON.stringify(myQuery);
+        
+        // Damit ich im Hinterkopf behalte, dass das so funktioniert
+        // console.log("myQuery.vorname: " + myQuery.vorname );
+        // console.log("myQuery.nachname: " + myQuery.nachname);
+
+        if (splitThis == "/html") {
+            _response.setHeader("content-type", "application/json");
+            _response.setHeader("Access-Control-Allow-Origin", "*"); 
+        }
+        else if (splitThis == "/json") {
+            _response.setHeader("content-type", "text/html");
+            _response.setHeader("Access-Control-Allow-Origin", "*"); 
+        }
+
+        console.log(myJsonString); 
+        _response.write(myJsonString);    
+        _response.end();                                                                                
+    }
+}
diff --git a/Steckbrief/steckbrief.htm b/Steckbrief/steckbrief.htm
index 3599c4a..32a81c8 100644
--- a/Steckbrief/steckbrief.htm
+++ b/Steckbrief/steckbrief.htm
@@ -15,6 +15,8 @@ body {
 	<!-- Hier die Links zu den gelösten Aufgaben einstellen, aktuelle oben, alte stehen lassen! Format: Aufgabenbezeichnung, Datum -->
 	<a href="https://github.com/YamiDesu/GIS-SoSe-2020/issues" target="_blank">									 	Github Reposiroty → Issues 		<br> </a>
 	
+	<a href="https://yamidesu.github.io/GIS-SoSe-2020/Aufgaben/Aufgabe_09_2020-06-24/form.html" target="_blank">    	Aufgabe_09_2020-06-24  			 </a> &
+	<a href="https://github.com/YamiDesu/GIS-SoSe-2020/blob/master/Aufgaben/Aufgabe_08_2020-06-17/test.ts" target="_blank"> Server.ts				<br> </a>
 	<a href="https://yamidesu.github.io/GIS-SoSe-2020/Aufgaben/Aufgabe_08_2020-06-17/tutorial.html" target="_blank"> 	Aufgabe_08_2020-06-17 		<br> </a>
 	<a href="https://yamidesu.github.io/GIS-SoSe-2020/Aufgaben/Aufgabe_07_2020-06-10/shop.html" target="_blank"> 		Aufgabe_07_2020-06-10 		<br> </a>
 	<a href="https://yamidesu.github.io/GIS-SoSe-2020/Aufgaben/Aufgabe_06_2020-06-03/shop.html" target="_blank"> 		Aufgabe_06_2020-06-03 		<br> </a>
diff --git a/favicon.ico b/favicon.ico
new file mode 100644
index 0000000..4108b1c
Binary files /dev/null and b/favicon.ico differ
diff --git a/package.json b/package.json
index 7172b64..04674f2 100644
--- a/package.json
+++ b/package.json
@@ -3,10 +3,12 @@
   "version": "1.0.0",
   "description": "Diese Datei soll mir helfen, mit Heruko arbeiten zu können.",
   "main": "index.js",
-  "dependencies": {},
+  "dependencies": {
+    "@types/node": "^14.0.13"
+  },
   "devDependencies": {},
   "scripts": {
-    "start": "node Aufgaben/Aufgabe_08_2020-06-17/server.js"
+    "start": "node Aufgaben/Aufgabe_09_2020-06-24/server.js"
   },
   "repository": {
     "type": "git",