maaike's code samples

2021-09-04 21:22:51 +02:00
parent 0189d40676
commit b89b9dfb3f
70 changed files with 2737 additions and 0 deletions
@@ -0,0 +1,22 @@
+<html>
+  <head> </head>
+  <body>
+    <div id="content">
+      <h1>AJAX in action!</h1>
+      <button type="button" onclick="call()">Go go greek God!</button>
+    </div>
+    <script>
+      function call() {
+        let xhttp = new XMLHttpRequest();
+        let url = "some valid url";
+        xhttp.load = function () {
+          if (this.status == 200 && this.readyState == 4) {
+            document.getElementById("content").innerHTML = this.responseText;
+          }
+        };
+        xhttp.open("GET", url, true);
+        xhttp.send();
+      }
+    </script>
+  </body>
+</html>
@@ -0,0 +1,13 @@
+{
+  "name": "Malika",
+  "age": 50,
+  "profession": "programmer",
+  "languages": ["JavaScript", "C#", "Python"],
+  "address": {
+    "street": "Some street",
+    "number": 123,
+    "zipcode": "3850AA",
+    "city": "Utrecht",
+    "country": "The Netherlands"
+  }
+}
@@ -0,0 +1,10 @@
+const express = require('express');
+const app = express();
+
+app.get('/', (request, response) => {
+  response.send('Hello Express!');
+});
+
+app.listen(3000, () => {
+  console.log('Express app at http://localhost:3000');
+});
@@ -0,0 +1,22 @@
+<html>
+  <head>
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
+  </head>
+  <body>
+    <p>Let's play a game!</p>
+    <p>Of hide and seek...</p>
+    <p class="easy">I'm easy to find!</p>
+    <button id="hidebutton">Great idea</button>
+    <button id="revealbutton">Found you!</button>
+    <script>
+      $(document).ready(function () {
+        $("#hidebutton").click(function () {
+          $("p").hide();
+        });
+        $("#revealbutton").click(function () {
+          $(".easy").show();
+        });
+      });
+    </script>
+  </body>
+</html>
@@ -0,0 +1,11 @@
+const http = require('http');
+
+http.createServer(function(req, res){
+    res.writeHead(200, {'Content-Type': 'text/html'}); //header status code
+    let name = 'maaike';
+    res.write(`Finally, hello ${name}`); //body
+    res.end();
+}).listen(5000); //listen to port 8080
+
+console.log('Listening on port 8080...');
+
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+  <script src="https://cdn.jsdelivr.net/npm/vue"></script>
+
+  <body>
+    <div id="app">
+      <maaike></maaike>
+    </div>
+
+    <script>
+      Vue.component("maaike", {
+        template: "<p>Maaike says: good job!</p>",
+      });
+
+      new Vue({ el: "#app" });
+    </script>
+  </body>
+</html>
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html>
+  <script src="https://cdn.jsdelivr.net/npm/vue"></script>
+
+  <body>
+    <div id="app">
+      <p v-if="!hide">
+        Let's play hide and seek. <br />
+        Go to the console and type: <br />
+        obj._data.hide = true <br />
+      </p>
+    </div>
+
+    <script>
+      var obj = new Vue({
+        el: "#app",
+        data: {
+          hide: false,
+        },
+      });
+    </script>
+  </body>
+</html>