diff --git a/fetch/programmer-humour/index.html b/fetch/programmer-humour/index.html
new file mode 100644
index 000000000..a16281acb
--- /dev/null
+++ b/fetch/programmer-humour/index.html
@@ -0,0 +1,14 @@
+
+
+
+
+
+
+ Programmer humour
+
+
+
+
+
+
+
diff --git a/fetch/programmer-humour/script.js b/fetch/programmer-humour/script.js
new file mode 100644
index 000000000..e1d37cd93
--- /dev/null
+++ b/fetch/programmer-humour/script.js
@@ -0,0 +1,28 @@
+// get the json using Fetch
+const endPoint = "https://xkcd.now.sh/?comic=latest";
+async function fetchComic() {
+ const response = await fetch(endPoint);
+ // incorporating handling error
+ if (!response.ok) {
+ throw new Error(`request failed: ${response.status}`);
+ }
+ return await response.json();
+}
+
+async function setup() {
+ try {
+ const data = await fetchComic();
+ console.log(data);
+
+ const comicImage = document.getElementById("comic");
+ comicImage.src = data.img;
+ comicImage.title = data.title;
+ comicImage.alt = data.alt;
+ } catch (error) {
+ console.error(error);
+ document.getElementById("error-message").textContent =
+ "Sorry, something went wrong loading the comic. Please try again later.";
+ }
+}
+
+window.onload = setup;
diff --git a/fetch/programmer-humour/style.css b/fetch/programmer-humour/style.css
new file mode 100644
index 000000000..5aa23a59a
--- /dev/null
+++ b/fetch/programmer-humour/style.css
@@ -0,0 +1,15 @@
+body {
+ font-family: sans-serif;
+ text-align: center;
+ padding: 40px;
+}
+
+#comic {
+ max-width: 90%;
+ border: 1px solid #ccc;
+ margin-top: 20px;
+}
+
+#error-message {
+ color: red;
+}
\ No newline at end of file