0?u.join(":"):null;n.scroll=s,n.scrollTarget=l}else if(0===a.indexOf("show:")){var u,c=(u=a.substr(5).split(":")).pop();l=u.length>0?u.join(":"):null,n.show=c,n.showTarget=l}else if(0===a.indexOf("focus-scroll:")){var f=a.substr(13);n.focusScroll="true"==f}else 0==i?n.swapStyle=a:y("Unknown modifier in hx-swap: "+a)}}return n}function cr(e){return"multipart/form-data"===re(e,"hx-encoding")||h(e,"form")&&"multipart/form-data"===Q(e,"enctype")}function hr(e,t,r){var n=null;return C(t,(function(o){null==n&&(n=o.encodeParameters(e,r,t))})),null!=n?n:cr(t)?or(r):ar(r)}function T(e){return{tasks:[],elts:[e]}}function vr(e,t){var r=e[0],n=e[e.length-1];if(t.scroll){var o=null;t.scrollTarget&&(o=le(r,t.scrollTarget)),"top"===t.scroll&&(r||o)&&((o=o||r).scrollTop=0),"bottom"===t.scroll&&(n||o)&&((o=o||n).scrollTop=o.scrollHeight)}if(t.show){if(o=null,t.showTarget){var i=t.showTarget;"window"===t.showTarget&&(i="body"),o=le(r,i)}"top"===t.show&&(r||o)&&(o=o||r).scrollIntoView({block:"start",behavior:Y.config.scrollBehavior}),"bottom"===t.show&&(n||o)&&(o=o||n).scrollIntoView({block:"end",behavior:Y.config.scrollBehavior})}}function dr(e,t,r,n){if(null==n&&(n={}),null==e)return n;var o=ee(e,t);if(o){var i,a=o.trim(),s=r;if("unset"===a)return null;for(var l in 0===a.indexOf("javascript:")?(a=a.substr(11),s=!0):0===a.indexOf("js:")&&(a=a.substr(3),s=!0),0!==a.indexOf("{")&&(a="{"+a+"}"),i=s?gr(e,(function(){return Function("return ("+a+")")()}),{}):S(a))i.hasOwnProperty(l)&&null==n[l]&&(n[l]=i[l])}return dr(u(e),t,r,n)}function gr(e,t,r){return Y.config.allowEval?t():(ue(e,"htmx:evalDisallowedError"),r)}function mr(e,t){return dr(e,"hx-vars",!0,t)}function pr(e,t){return dr(e,"hx-vals",!1,t)}function xr(e){return se(mr(e),pr(e))}function yr(e,t,r){if(null!==r)try{e.setRequestHeader(t,r)}catch(n){e.setRequestHeader(t,encodeURIComponent(r)),e.setRequestHeader(t+"-URI-AutoEncoded","true")}}function br(e){if(e.responseURL&&"undefined"!=typeof URL)try{var t=new URL(e.responseURL);return t.pathname+t.search}catch(t){ue(te().body,"htmx:badResponseUrl",{url:e.responseURL})}}function R(e,t){return e.getAllResponseHeaders().match(t)}function wr(e,t,r){return e=e.toLowerCase(),r?r instanceof Element||L(r,"String")?ce(e,t,null,null,{targetOverride:s(r),returnPromise:!0}):ce(e,t,s(r.source),r.event,{handler:r.handler,headers:r.headers,values:r.values,targetOverride:s(r.target),swapOverride:r.swap,returnPromise:!0}):ce(e,t,null,null,{returnPromise:!0})}function Sr(e){for(var t=[];e;)t.push(e),e=e.parentElement;return t}function Er(e,t,r){var n,o;return"function"==typeof URL?(o=new URL(t,document.location.href),n=document.location.origin===o.origin):(o=t,n=g(t,document.location.origin)),!(Y.config.selfRequestsOnly&&!n)&&fe(e,"htmx:validateUrl",se({url:o,sameHost:n},r))}function ce(e,t,r,n,o,i){var a=null,s=null;if((o=null!=o?o:{}).returnPromise&&"undefined"!=typeof Promise)var l=new Promise((function(e,t){a=e,s=t}));null==r&&(r=te().body);var u=o.handler||Tr;if(!oe(r))return ne(a),l;var c=o.targetOverride||ge(r);if(null==c||c==he)return ue(r,"htmx:targetError",{target:ee(r,"hx-target")}),ne(s),l;var f=ie(r),h=f.lastButtonClicked;if(h){var d=Q(h,"formaction");null!=d&&(t=d);var v=Q(h,"formmethod");null!=v&&(e=v)}if(!i&&!1===fe(r,"htmx:confirm",{target:c,elt:r,path:t,verb:e,triggeringEvent:n,etc:o,issueRequest:function(){return ce(e,t,r,n,o,!0)}}))return ne(a),l;var g=r,p=re(r,"hx-sync"),m=null,x=!1;if(p){var b=p.split(":"),y=b[0].trim();if(g="this"===y?de(r,"hx-sync"):le(r,y),p=(b[1]||"drop").trim(),f=ie(g),"drop"===p&&f.xhr&&!0!==f.abortable)return ne(a),l;if("abort"===p){if(f.xhr)return ne(a),l;x=!0}else"replace"===p?fe(g,"htmx:abort"):0===p.indexOf("queue")&&(m=(p.split(" ")[1]||"last").trim())}if(f.xhr){if(!f.abortable){if(null==m){if(n){var w=ie(n);w&&w.triggerSpec&&w.triggerSpec.queue&&(m=w.triggerSpec.queue)}null==m&&(m="last")}return null==f.queuedRequests&&(f.queuedRequests=[]),"first"===m&&0===f.queuedRequests.length||"all"===m?f.queuedRequests.push((function(){ce(e,t,r,n,o)})):"last"===m&&(f.queuedRequests=[],f.queuedRequests.push((function(){ce(e,t,r,n,o)}))),ne(a),l}fe(g,"htmx:abort")}var E=new XMLHttpRequest;f.xhr=E,f.abortable=x;var S=function(){f.xhr=null,f.abortable=!1,null!=f.queuedRequests&&f.queuedRequests.length>0&&f.queuedRequests.shift()()},_=re(r,"hx-prompt");if(_){var C=prompt(_);if(null===C||!fe(r,"htmx:prompt",{prompt:C,target:c}))return ne(a),S(),l}var R=re(r,"hx-confirm");if(R&&!confirm(R))return ne(a),S(),l;var T=sr(r,c,C);o.headers&&(T=se(T,o.headers));var A=nr(r,e),O=A.errors,q=A.values;o.values&&(q=se(q,o.values));var L=se(q,xr(r)),H=lr(L,r);"get"===e||cr(r)||(T["Content-Type"]="application/x-www-form-urlencoded"),Y.config.getCacheBusterParam&&"get"===e&&(H["org.htmx.cache-buster"]=Q(c,"id")||"true"),null!=t&&""!==t||(t=te().location.href);var k=dr(r,"hx-request"),N=ie(r).boosted,I=Y.config.methodsThatUseUrlParams.indexOf(e)>=0,M={boosted:N,useUrlParams:I,parameters:H,unfilteredParameters:L,headers:T,target:c,verb:e,errors:O,withCredentials:o.credentials||k.credentials||Y.config.withCredentials,timeout:o.timeout||k.timeout||Y.config.timeout,path:t,triggeringEvent:n};if(!fe(r,"htmx:configRequest",M))return ne(a),S(),l;if(t=M.path,e=M.verb,T=M.headers,H=M.parameters,I=M.useUrlParams,(O=M.errors)&&O.length>0)return fe(r,"htmx:validation:halted",M),ne(a),S(),l;var P=t.split("#"),D=P[0],F=P[1],X=t;if(I&&(X=D,0!==Object.keys(H).length&&(X.indexOf("?")<0?X+="?":X+="&",X+=ar(H),F&&(X+="#"+F))),!Er(r,X,M))return ue(r,"htmx:invalidPath",M),ne(s),l;if(E.open(e.toUpperCase(),X,!0),E.overrideMimeType("text/html"),E.withCredentials=M.withCredentials,E.timeout=M.timeout,k.noHeaders);else for(var B in T)if(T.hasOwnProperty(B)){var U=T[B];yr(E,B,U)}var W={xhr:E,target:c,requestConfig:M,etc:o,boosted:N,pathInfo:{requestPath:t,finalRequestPath:X,anchor:F}};if(E.onload=function(){try{var e=Sr(r);if(W.pathInfo.responsePath=br(E),u(r,W),Kt(j,V),fe(r,"htmx:afterRequest",W),fe(r,"htmx:afterOnLoad",W),!oe(r)){for(var t=null;e.length>0&&null==t;){var n=e.shift();oe(n)&&(t=n)}t&&(fe(t,"htmx:afterRequest",W),fe(t,"htmx:afterOnLoad",W))}ne(a),S()}catch(e){throw ue(r,"htmx:onLoadError",se({error:e},W)),e}},E.onerror=function(){Kt(j,V),ue(r,"htmx:afterRequest",W),ue(r,"htmx:sendError",W),ne(s),S()},E.onabort=function(){Kt(j,V),ue(r,"htmx:afterRequest",W),ue(r,"htmx:sendAbort",W),ne(s),S()},E.ontimeout=function(){Kt(j,V),ue(r,"htmx:afterRequest",W),ue(r,"htmx:timeout",W),ne(s),S()},!fe(r,"htmx:beforeRequest",W))return ne(a),S(),l;var j=Jt(r),V=Zt(r);ae(["loadstart","loadend","progress","abort"],(function(e){ae([E,E.upload],(function(t){t.addEventListener(e,(function(t){fe(r,"htmx:xhr:"+e,{lengthComputable:t.lengthComputable,loaded:t.loaded,total:t.total})}))}))})),fe(r,"htmx:beforeSend",W);var z=I?null:hr(E,r,H);return E.send(z),l}function Cr(e,t){var r=t.xhr,n=null,o=null;if(R(r,/HX-Push:/i)?(n=r.getResponseHeader("HX-Push"),o="push"):R(r,/HX-Push-Url:/i)?(n=r.getResponseHeader("HX-Push-Url"),o="push"):R(r,/HX-Replace-Url:/i)&&(n=r.getResponseHeader("HX-Replace-Url"),o="replace"),n)return"false"===n?{}:{type:o,path:n};var i=t.pathInfo.finalRequestPath,a=t.pathInfo.responsePath,s=re(e,"hx-push-url"),l=re(e,"hx-replace-url"),u=ie(e).boosted,c=null,f=null;return s?(c="push",f=s):l?(c="replace",f=l):u&&(c="push",f=a||i),f?"false"===f?{}:("true"===f&&(f=a||i),t.pathInfo.anchor&&-1===f.indexOf("#")&&(f=f+"#"+t.pathInfo.anchor),{type:c,path:f}):{}}function Tr(e,t){var r=t.xhr,n=t.target,o=t.etc;if(t.requestConfig,fe(e,"htmx:beforeOnLoad",t)){if(R(r,/HX-Trigger:/i)&&Ue(r,"HX-Trigger",e),R(r,/HX-Location:/i)){jt();var i=r.getResponseHeader("HX-Location");return 0===i.indexOf("{")&&(d=S(i),i=d.path,delete d.path),void wr("GET",i,d).then((function(){_t(i)}))}var a=R(r,/HX-Refresh:/i)&&"true"===r.getResponseHeader("HX-Refresh");if(R(r,/HX-Redirect:/i))return location.href=r.getResponseHeader("HX-Redirect"),void(a&&location.reload());if(a)location.reload();else{R(r,/HX-Retarget:/i)&&(t.target=te().querySelector(r.getResponseHeader("HX-Retarget")));var s=Cr(e,t),l=r.status>=200&&r.status<400&&204!==r.status,u=r.response,c=r.status>=400,f=Y.config.ignoreTitle,h=se({shouldSwap:l,serverResponse:u,isError:c,ignoreTitle:f},t);if(fe(n,"htmx:beforeSwap",h)){if(n=h.target,u=h.serverResponse,c=h.isError,f=h.ignoreTitle,t.target=n,t.failed=c,t.successful=!c,h.shouldSwap){286===r.status&&Ke(e),C(e,(function(t){u=t.transformResponse(u,r,e)})),s.type&&jt();var d,v=o.swapOverride;R(r,/HX-Reswap:/i)&&(v=r.getResponseHeader("HX-Reswap")),(d=fr(e,v)).hasOwnProperty("ignoreTitle")&&(f=d.ignoreTitle),n.classList.add(Y.config.swappingClass);var g=null,p=null,m=function(){try{var o,i=document.activeElement,a={};try{a={elt:i,start:i?i.selectionStart:null,end:i?i.selectionEnd:null}}catch(i){}R(r,/HX-Reselect:/i)&&(o=r.getResponseHeader("HX-Reselect"));var l=T(n);if(Fe(d.swapStyle,n,e,u,l,o),a.elt&&!oe(a.elt)&&Q(a.elt,"id")){var c=document.getElementById(Q(a.elt,"id")),h={preventScroll:void 0!==d.focusScroll?!d.focusScroll:!Y.config.defaultFocusScroll};if(c){if(a.start&&c.setSelectionRange)try{c.setSelectionRange(a.start,a.end)}catch(i){}c.focus(h)}}if(n.classList.remove(Y.config.swappingClass),ae(l.elts,(function(e){e.classList&&e.classList.add(Y.config.settlingClass),fe(e,"htmx:afterSwap",t)})),R(r,/HX-Trigger-After-Swap:/i)){var v=e;oe(e)||(v=te().body),Ue(r,"HX-Trigger-After-Swap",v)}var m=function(){if(ae(l.tasks,(function(e){e.call()})),ae(l.elts,(function(e){e.classList&&e.classList.remove(Y.config.settlingClass),fe(e,"htmx:afterSettle",t)})),s.type&&("push"===s.type?(_t(s.path),fe(te().body,"htmx:pushedIntoHistory",{path:s.path})):(zt(s.path),fe(te().body,"htmx:replacedInHistory",{path:s.path}))),t.pathInfo.anchor){var n=E("#"+t.pathInfo.anchor);n&&n.scrollIntoView({block:"start",behavior:"auto"})}if(l.title&&!f){var o=E("title");o?o.innerHTML=l.title:window.document.title=l.title}if(vr(l.elts,d),R(r,/HX-Trigger-After-Settle:/i)){var i=e;oe(e)||(i=te().body),Ue(r,"HX-Trigger-After-Settle",i)}ne(g)};d.settleDelay>0?setTimeout(m,d.settleDelay):m()}catch(i){throw ue(e,"htmx:swapError",t),ne(p),i}},x=Y.config.globalViewTransitions;if(d.hasOwnProperty("transition")&&(x=d.transition),x&&fe(e,"htmx:beforeTransition",t)&&"undefined"!=typeof Promise&&document.startViewTransition){var b=new Promise((function(e,t){g=e,p=t})),y=m;m=function(){document.startViewTransition((function(){return y(),b}))}}d.swapDelay>0?setTimeout(m,d.swapDelay):m()}c&&ue(e,"htmx:responseError",se({error:"Response Status Error Code "+r.status+" from "+t.pathInfo.requestPath},t))}}}}var Rr={};function Or(){return{init:function(e){return null},onEvent:function(e,t){return!0},transformResponse:function(e,t,r){return e},isInlineSwap:function(e){return!1},handleSwap:function(e,t,r,n){return!1},encodeParameters:function(e,t,r){return null}}}function qr(e,t){t.init&&t.init(r),Rr[e]=se(Or(),t)}function Hr(e){delete Rr[e]}function Lr(e,t,r){if(null==e)return t;null==t&&(t=[]),null==r&&(r=[]);var n=ee(e,"hx-ext");return n&&ae(n.split(","),(function(e){if("ignore:"!=(e=e.replace(/ /g,"")).slice(0,7)){if(r.indexOf(e)<0){var n=Rr[e];n&&t.indexOf(n)<0&&t.push(n)}}else r.push(e.slice(7))})),Lr(u(e),t,r)}var Ar=!1;function Nr(e){Ar||"complete"===te().readyState?e():te().addEventListener("DOMContentLoaded",e)}function Ir(){!1!==Y.config.includeIndicatorStyles&&te().head.insertAdjacentHTML("beforeend","")}function Pr(){var e=te().querySelector('meta[name="htmx-config"]');return e?S(e.content):null}function kr(){var e=Pr();e&&(Y.config=se(Y.config,e))}return te().addEventListener("DOMContentLoaded",(function(){Ar=!0})),Nr((function(){kr(),Ir();var e=te().body;Pt(e);var t=te().querySelectorAll("[hx-trigger='restored'],[data-hx-trigger='restored']");e.addEventListener("htmx:abort",(function(e){var t=ie(e.target);t&&t.xhr&&t.xhr.abort()}));var r=window.onpopstate;window.onpopstate=function(e){e.state&&e.state.htmx?(Gt(),ae(t,(function(e){fe(e,"htmx:restored",{document:te(),triggerEvent:fe})}))):r&&r(e)},setTimeout((function(){fe(e,"htmx:load",{}),e=null}),0)})),Y}()},__WEBPACK_AMD_DEFINE_ARRAY__=[],void 0===(__WEBPACK_AMD_DEFINE_RESULT__="function"==typeof(__WEBPACK_AMD_DEFINE_FACTORY__=t)?__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports,__WEBPACK_AMD_DEFINE_ARRAY__):__WEBPACK_AMD_DEFINE_FACTORY__)||(module.exports=__WEBPACK_AMD_DEFINE_RESULT__)}},__webpack_module_cache__={};function __webpack_require__(e){var t=__webpack_module_cache__[e];if(void 0!==t)return t.exports;var r=__webpack_module_cache__[e]={exports:{}};return __webpack_modules__[e].call(r.exports,r,r.exports,__webpack_require__),r.exports}var __webpack_exports__={};(()=>{"use strict";var e=__webpack_require__(28),t=__webpack_require__(957);t.init(e),t.handlers.set("/clicked",'\n Hey!\n '),t.handlers.set("/clicked2",'\n Okay then!\n '),t.handlers.set("/clicked3",'\n Stop it now.\n '),t.handlers.set("/clicked4",'\n Just stop pls..\n '),t.handlers.set("/clicked5",'\n Sus.\n '),t.handlers.set("/clicked6",'\n I\'m done.\n ')})()})();
\ No newline at end of file
diff --git a/dist/style.css b/dist/style.css
index 4acaa53..4e2afc0 100644
--- a/dist/style.css
+++ b/dist/style.css
@@ -1 +1 @@
-:root{--color-pink:#e62ac6;--color-pink-opaque:rgba(230,42,198,.6);--color-bg:#0f0020;--color-bg-footer:#080007;--color-text:#f1f1f1;--color-anchor:#e72c4b;--color-project-bg:hsla(0,0%,7%,.4);--color-project-bg-hover:hsla(0,0%,7%,.8);--color-pre:rgba(22,27,34,.4);--wrapper-width:1280px;--project-gap:2rem;--project-min-width:380px;--project-columns:3}html{font-family:Roboto,Arial,sans-serif}body{background:var(--color-bg);color:var(--color-text);margin:0}h1,h2{--color:var(--color-pink);font-size:2.4rem;text-shadow:0 2px 1px var(--color-pink);transition:all .3s}h1:hover{text-shadow:0 5px 10px var(--color-pink)}h2{font-size:1.5rem;text-shadow:0 1px 1px var(--color-pink)}p,ul li{font-size:1rem;line-height:1.6rem;text-shadow:0 1px 0 var(--color-pink-opaque)}ul li{line-height:1.8rem}pre{background:var(--color-pre);display:inline;padding:6px 12px}a{color:var(--color-anchor);text-decoration:none;text-shadow:none;transition:color .15s}a:hover{color:var(--color-pink)}a.title{color:#fff}.wrapper{max-width:var(--wrapper-width)}main{align-items:center;background-image:url(../img/ernest-marcinko-pixelated-opaque.png);background-position-x:center;background-position-y:40px;background-repeat:no-repeat;background-size:auto;display:flex;flex-direction:column;margin:0 auto 5rem;padding:24px}section{width:100%}section.intro{margin:10rem auto;text-align:center}.socials a svg path{fill:#fff;transition:fill .2s}.socials a:hover svg path{fill:var(--color-pink)}.socials{gap:18px}.flexy,.socials{display:flex;justify-content:center}.flexy{flex-wrap:wrap;gap:2rem;width:100%}.projects .project{background:var(--color-project-bg);border-radius:4px;box-shadow:0 0 2px 1px var(--color-pink);box-sizing:border-box;max-width:calc(100%/var(--project-columns) - (var(--project-columns) - 1)*var(--project-gap)/var(--project-columns));min-width:var(--project-min-width);padding:8px 24px;transition:all .3s;width:100%}.projects .project.active,.projects .project:hover{background:var(--color-project-bg-hover);box-shadow:0 0 20px 4px var(--color-pink)}.projects .project .title{align-items:center;display:flex;gap:1rem}.projects .project img{border-radius:32px;height:64px;width:64px}footer{background:var(--color-bg-footer);margin:none;overflow:auto;padding:24px}.footer-container{margin:0 auto}footer .row{max-width:480px}@media only screen and (max-width:480px){main{background-position-x:center;background-position-y:40px}.projects .project{min-width:320px}.footer-container{justify-content:left}}
\ No newline at end of file
+:root{--color-pink:#e62ac6;--color-pink-opaque:rgba(230,42,198,.6);--color-bg:#0f0020;--color-bg-footer:#080007;--color-text:#f1f1f1;--color-anchor:#e72c4b;--color-project-bg:hsla(0,0%,7%,.4);--color-project-bg-hover:hsla(0,0%,7%,.8);--color-pre:rgba(22,27,34,.4);--wrapper-width:1280px;--project-gap:2rem;--project-min-width:380px;--project-columns:3}html{font-family:Roboto,Arial,sans-serif}body{background:var(--color-bg);color:var(--color-text);margin:0}h1,h2{--color:var(--color-pink);font-size:2.4rem;text-shadow:0 2px 1px var(--color-pink);transition:all .3s}h1:hover{text-shadow:0 5px 10px var(--color-pink)}h2{font-size:1.5rem;text-shadow:0 1px 1px var(--color-pink)}p,ul li{font-size:1rem;line-height:1.6rem;text-shadow:0 1px 0 var(--color-pink-opaque)}ul li{line-height:1.8rem}pre{background:var(--color-pre);display:inline;padding:6px 12px}a{color:var(--color-anchor);text-decoration:none;text-shadow:none;transition:color .15s}a:hover{color:var(--color-pink)}a.title{color:#fff}.wrapper{max-width:var(--wrapper-width)}main{align-items:center;background-image:url(../img/ernest-marcinko-pixelated-opaque.png);background-position-x:center;background-position-y:40px;background-repeat:no-repeat;background-size:auto;display:flex;flex-direction:column;margin:0 auto 5rem;padding:24px}section{width:100%}section.intro{margin:10rem auto;text-align:center}section.htmx-serverless{background:#000000a8;max-width:640px}.socials a svg path{fill:#fff;transition:fill .2s}.socials a:hover svg path{fill:var(--color-pink)}.socials{display:flex;gap:18px;justify-content:center}section.htmx-serverless button{background:#1585ef;border:none;border-radius:2em;color:#fff;cursor:pointer;font-size:1em;font-weight:700;padding:1em 2em}.flexy{display:flex;flex-wrap:wrap;gap:2rem;justify-content:center;width:100%}.projects .project{background:var(--color-project-bg);border-radius:4px;box-shadow:0 0 2px 1px var(--color-pink);box-sizing:border-box;max-width:calc(100%/var(--project-columns) - (var(--project-columns) - 1)*var(--project-gap)/var(--project-columns));min-width:var(--project-min-width);padding:8px 24px;transition:all .3s;width:100%}.projects .project.active,.projects .project:hover{background:var(--color-project-bg-hover);box-shadow:0 0 20px 4px var(--color-pink)}.projects .project .title{align-items:center;display:flex;gap:1rem}.projects .project img{border-radius:32px;height:64px;width:64px}footer{background:var(--color-bg-footer);margin:none;overflow:auto;padding:24px}.footer-container{margin:0 auto}footer .row{max-width:480px}@media only screen and (max-width:480px){main{background-position-x:center;background-position-y:40px}.projects .project{min-width:320px}.footer-container{justify-content:left}}
\ No newline at end of file
diff --git a/package.json b/package.json
index a308dc0..9ca5296 100644
--- a/package.json
+++ b/package.json
@@ -28,6 +28,8 @@
"cssnano": "^6.0.1",
"esc": "^0.0.3",
"flappybird-ts": "^0.1.2",
+ "htmx.org": "^1.9.6",
+ "htmx-serverless": "^0.1.5",
"nodemon": "^2.0.22",
"postcss": "^8.4.23",
"webpack": "^5.84.0",
diff --git a/server.js b/server.js
index 5d5b17e..f48a1fb 100644
--- a/server.js
+++ b/server.js
@@ -34,6 +34,16 @@ app.get('/typewriter', function(req, res) {
});
});
+app.get('/htmx-serverless', function(req, res) {
+ var att = {
+ title: 'HTMX without a Server',
+ description: 'HTMX Serverless is a small addon to define static HTMX request and responses without a Server'
+ };
+ res.render('pages/htmx-serverless',{
+ att: att,
+ });
+});
+
app.get('/flappybird', function(req, res) {
var att = {
title: 'Flappy Bird in TypeScript by Ernest Marcinko',
@@ -58,6 +68,8 @@ app.get('/sitemap.xml', async function(req, res) {
smstream.write({ url: '/', changefreq: 'monthly', priority: 1});
smstream.write({ url: '/typewriter', changefreq: 'monthly', priority: 0.6});
+ smstream.write({ url: '/flappybird', changefreq: 'monthly', priority: 0.6});
+ smstream.write({ url: '/htmx-serverless', changefreq: 'monthly', priority: 0.6});
smstream.write({ url: '/aicookieclicker', changefreq: 'monthly', priority: 0.6});
// cache the response
diff --git a/src/htmx-serverless.js b/src/htmx-serverless.js
new file mode 100644
index 0000000..8374122
--- /dev/null
+++ b/src/htmx-serverless.js
@@ -0,0 +1,35 @@
+import htmx from "htmx.org";
+import htmxServerless from "htmx-serverless";
+
+htmxServerless.init(htmx);
+
+htmxServerless.handlers.set('/clicked',
+ `
+ Hey!
+ `
+);
+htmxServerless.handlers.set('/clicked2',
+ `
+ Okay then!
+ `
+);
+htmxServerless.handlers.set('/clicked3',
+ `
+ Stop it now.
+ `
+);
+htmxServerless.handlers.set('/clicked4',
+ `
+ Just stop pls..
+ `
+);
+htmxServerless.handlers.set('/clicked5',
+ `
+ Sus.
+ `
+);
+htmxServerless.handlers.set('/clicked6',
+ `
+ I'm done.
+ `
+);
\ No newline at end of file
diff --git a/src/style.css b/src/style.css
index 2769a8d..8054bad 100644
--- a/src/style.css
+++ b/src/style.css
@@ -98,6 +98,11 @@ section.intro {
margin: 10rem auto;
}
+section.htmx-serverless {
+ background: #000000a8;
+ max-width: 640px;;
+}
+
.socials a svg path {
fill: white;
transition: fill 0.2s;
@@ -113,6 +118,17 @@ section.intro {
justify-content: center;
}
+section.htmx-serverless button {
+ padding: 1em 2em;
+ color: white;
+ background: #1585ef;
+ border: none;
+ border-radius: 2em;
+ cursor: pointer;
+ font-size: 1em;
+ font-weight: 700;
+}
+
.flexy {
display: flex;
flex-wrap: wrap;
diff --git a/src/tt.js b/src/tt.js
new file mode 100644
index 0000000..6f60287
--- /dev/null
+++ b/src/tt.js
@@ -0,0 +1 @@
+!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t();else if("function"==typeof define&&define.amd)define([],t);else{var n=t();for(var o in n)("object"==typeof exports?exports:e)[o]=n[o]}}(window,(()=>(()=>{"use strict";var e={967:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.default=class{constructor(e){this.handlers=new Map,this.init(e)}init(e){null==e||e.defineExtension("serverless",{onEvent:this.onEvent.bind(this),transformResponse:this.transformResponse.bind(this)})}onEvent(e,t){var n,o,i;if(void 0!==t.detail.xhr&&this.shouldIntercept(null===(i=null===(o=null===(n=null==t?void 0:t.detail)||void 0===n?void 0:n.elt)||void 0===o?void 0:o["htmx-internal-data"])||void 0===i?void 0:i.path))if("htmx:beforeSend"===e){const e=t.detail.xhr;e.send=()=>{e.dispatchEvent(new Event("loadstart")),e.dispatchEvent(new Event("load")),e.dispatchEvent(new Event("loadend")),e.readyState,XMLHttpRequest.DONE}}else"htmx:beforeSwap"===e&&(t.detail.shouldSwap=!0)}transformResponse(e,t,n){var o,i;return this.shouldIntercept(null===(o=null==n?void 0:n["htmx-internal-data"])||void 0===o?void 0:o.path)?this.handlers.get(null===(i=null==n?void 0:n["htmx-internal-data"])||void 0===i?void 0:i.path):e}shouldIntercept(e){return e=null!=e?e:"",this.handlers.has(e)}}},607:function(e,t,n){var o=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});const i=new(o(n(967)).default)(window.htmx);window.htmxServerless=i,t.default=function(){return!1}}},t={},n=function n(o){var i=t[o];if(void 0!==i)return i.exports;var r=t[o]={exports:{}};return e[o].call(r.exports,r,r.exports,n),r.exports}(607);return n.default})()));
\ No newline at end of file
diff --git a/views/pages/flappybird.ejs b/views/pages/flappybird.ejs
index ab83982..993c42c 100644
--- a/views/pages/flappybird.ejs
+++ b/views/pages/flappybird.ejs
@@ -8,7 +8,7 @@
Flappy Bird TS
You can integrate this Flappy Bird game to your project
- YouTube Video | Github repository | npm
+ YouTube Video | Github repository | npm
npm i flappybird-ts --save-dev
<< Back Home
diff --git a/views/pages/htmx-serverless.ejs b/views/pages/htmx-serverless.ejs
new file mode 100644
index 0000000..bfe5d11
--- /dev/null
+++ b/views/pages/htmx-serverless.ejs
@@ -0,0 +1,36 @@
+
+
+
+ <%- include('../parts/head'); %>
+
+
+
+
+
+ HTMX Serverless
+
+
Click the button to do things
+
+ Click to change the buttons!
+
+ The button changes via HTMX without server queries.
+ Github repository | npm
+
+
+
+
+ HTMX boosted
+
+ HTMX without a server? Yes, it is possible! Although HTMX is designed focusing on server-client connections,
+ in some cases it is convenient to define static responses to certain requests.
+
+
+ This is what the htmx-serverless library can do.
+
+ << Back Home
+
+
+
+ <%- include('../parts/footer'); %>
+
+
\ No newline at end of file
diff --git a/views/pages/index.ejs b/views/pages/index.ejs
index a0187f0..0ff7235 100644
--- a/views/pages/index.ejs
+++ b/views/pages/index.ejs
@@ -17,7 +17,7 @@
c0-3.774,3.982-6.22,7.348-4.514l126.06,63.881C304.363,229.873,304.298,235.248,300.506,237.056z"/>
-
+
@@ -31,6 +31,18 @@
+
+
+ HTMX without a Server
+
+
The HTMX Serverless extensions adds a quick way to bypass certain requests.
+
With HTMX Serverless you can define your own responses on the frontend based on the request path.
+
+
Syntactically indentical to jQuery , but much smaller with only the essential features.
@@ -64,7 +76,7 @@
Using a javascript neural network (brain.js) to play Cookie Clicker, also experimenting with a Genetic alrorithm.
@@ -77,7 +89,7 @@
@@ -102,11 +114,11 @@
-
+
This website
It's a work of art, I know.
-
Feel free to use this as you template, the full site source can be found in the Github Repository
+
Feel free to use this as you template, the full site source can be found in the Github Repository
Don't forget to remove or replace the Google Tag Manager codes in the index.html file
diff --git a/views/pages/typewriter.ejs b/views/pages/typewriter.ejs
index 1413df0..829e5d9 100644
--- a/views/pages/typewriter.ejs
+++ b/views/pages/typewriter.ejs
@@ -9,7 +9,7 @@
Native javascript TypeWriter
This is a simple, small (~2.3kB) yet powerful TypeWriter effect written in native javascript.
It can write, delete, clear, pause, can chain and also has events and many more.
- Github repository | YouTube Video | npm
+ Github repository | YouTube Video | npm
npm i @anag0/typewriter --save-dev
diff --git a/views/parts/footer.ejs b/views/parts/footer.ejs
index 888b187..d0e5a4f 100644
--- a/views/parts/footer.ejs
+++ b/views/parts/footer.ejs
@@ -6,14 +6,14 @@
Most of the time I work on my products, sometimes I create educational style YouTube videos for fun.
This site was built with node.js ,
the complete source is available in the
- github repository .
+ github repository .
diff --git a/webpack.config.js b/webpack.config.js
index 59faccb..8d43ea8 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -40,5 +40,12 @@ export default [{
path: path.resolve(__dirname, 'dist'),
filename: 'flappybird.js',
},
+},
+{
+ entry: './src/htmx-serverless.js',
+ output: {
+ path: path.resolve(__dirname, 'dist'),
+ filename: 'htmx-serverless.js',
+ },
}
];
\ No newline at end of file