diff --git a/fetch/programmer-humour/index.html b/fetch/programmer-humour/index.html
new file mode 100644
index 000000000..d34d101ac
--- /dev/null
+++ b/fetch/programmer-humour/index.html
@@ -0,0 +1,18 @@
+
+
+
+
+
+
+ Programmer humour
+
+
+
+
+
+ Programmer humour
+ ![]()
+
+
+
+
\ No newline at end of file
diff --git a/fetch/programmer-humour/script.js b/fetch/programmer-humour/script.js
new file mode 100644
index 000000000..26e07be66
--- /dev/null
+++ b/fetch/programmer-humour/script.js
@@ -0,0 +1,35 @@
+const endpointAPI = "https://xkcd.now.sh/?comic=latest";
+async function fetchData(endpointAPI) {
+ try {
+ const response = await fetch(endpointAPI);
+ if (!response.ok) {
+ throw new Error(`Error! Status: ${response.status}`);
+ }
+
+ const data = await response.json();
+
+ console.log(data);
+ return data;
+ } catch (error) {
+ console.error("Could not fetch data", error);
+ }
+}
+
+async function loadComic() {
+ try {
+ const data = await fetchData(endpointAPI);
+ if (!data) {
+ throw new Error("No data received from the API.");
+ }
+ const imgEl = document.querySelector("img");
+ imgEl.src = data.img;
+ imgEl.title = data.title;
+ imgEl.alt = data.alt;
+ } catch (error) {
+ console.error("Error loading comic:", error);
+ document.querySelector("h1").textContent =
+ "Image failed loading. Please try again later";
+ }
+}
+
+loadComic();
diff --git a/fetch/programmer-humour/style.css b/fetch/programmer-humour/style.css
new file mode 100644
index 000000000..393e74d15
--- /dev/null
+++ b/fetch/programmer-humour/style.css
@@ -0,0 +1,15 @@
+body {
+ background-color: #e0f5f5;
+ font-family: sans-serif;
+ text-align: center;
+ padding: 2rem;
+}
+
+h1 {
+ color: #1a6b6b;
+ font-size: 3rem;
+}
+
+/* img {
+ margin: 0 auto;
+} */
\ No newline at end of file