- ID scansione:
- c7df82b4-0b21-4a64-b5de-3dc7a262b015Fatto
- URL inviato:
- https://swordflake.com/
- Report terminato:
Link · 1 trovati
I link in uscita identificati dalla pagina
| Link | Testo |
|---|---|
| https://github.com/swordflake | GitHub |
Variabili JavaScript · 15 trovate
Le variabili JavaScript globali caricate sull'oggetto finestra di una pagina sono variabili dichiarate all'esterno delle funzioni e accessibili da qualsiasi punto del codice nell'ambito corrente
| Nome | Tipo |
|---|---|
| onbeforetoggle | object |
| documentPictureInPicture | object |
| onscrollend | object |
| webpackChunk_N_E | object |
| __next_require__ | function |
| next | object |
| __NEXT_DATA__ | object |
| __SSG_MANIFEST_CB | function |
| __NEXT_P | object |
| _N_E | object |
Messaggi di log della console · 0 trovati
Messaggi registrati nella console Web
HTML
Il corpo HTML non elaborato della pagina
<!DOCTYPE html><html class="h-full antialiased js-focus-visible light" lang="en" style="color-scheme: light;" data-js-focus-visible=""><head><meta charset="utf-8"><meta name="viewport" content="width=device-width"><title>Swordflake - We build & design websites & applications</title><meta name="description" content="Website, mobile and desktop application development. We develop your projects as if they were our own."><meta name="theme-color" content="#7dd3fc"><link rel="icon" href="logo.svg" color="#7dd3fc"><link rel="mask-icon" href="logo.svg" color="#7dd3fc"><link rel="manifest" href="manifest.json"><meta name="next-head-count" content="8"><link rel="preload" href="/_next/static/css/fc8a550ef74ca237.css" as="style"><link rel="stylesheet" href="/_next/static/css/fc8a550ef74ca237.css" data-n-g=""><noscript data-n-css=""></noscript><script defer="" nomodule="" src="/_next/static/chunks/polyfills-c67a75d1b6f99dc8.js"></script><script src="/_next/static/chunks/webpack-b8f8d6679aaa5f42.js" defer=""></script><script src="/_next/static/chunks/framework-2c79e2a64abdb08b.js" defer=""></script><script src="/_next/static/chunks/main-91acc2ef8f7821a9.js" defer=""></script><script src="/_next/static/chunks/pages/_app-22253fc56f993e5b.js" defer=""></script><script src="/_next/static/chunks/pages/index-d27c659ce5a4f877.js" defer=""></script><script src="/_next/static/hGxFvn14uX4yXmyuUr3H9/_buildManifest.js" defer=""></script><script src="/_next/static/hGxFvn14uX4yXmyuUr3H9/_ssgManifest.js" defer=""></script></head><body class="flex min-h-full flex-col bg-white dark:bg-gray-950"><div id="__next"><script>!function(){try{var d=document.documentElement,c=d.classList;c.remove('light','dark');var e=localStorage.getItem('theme');if('system'===e||(!e&&true)){var t='(prefers-color-scheme: dark)',m=window.matchMedia(t);if(m.media!==t||m.matches){d.style.colorScheme = 'dark';c.add('dark')}else{d.style.colorScheme = 'light';c.add('light')}}else if(e){c.add(e|| '')}if(e==='light'||e==='dark')d.style.colorScheme=e}catch(e){}}()</script><div class="relative flex-none overflow-hidden px-6 lg:pointer-events-none lg:fixed lg:inset-0 lg:z-40 lg:flex lg:px-0"><div class="absolute inset-0 -z-10 overflow-hidden bg-gray-950 lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-[32rem]"><svg class="absolute -bottom-48 left-[-40%] h-[80rem] w-[180%] lg:-right-40 lg:bottom-auto lg:left-auto lg:top-[-40%] lg:h-[180%] lg:w-[80rem]" aria-hidden="true"><defs><radialGradient id=":r0:-desktop" cx="100%"><stop offset="0%" stop-color="rgba(56, 189, 248, 0.3)"></stop><stop offset="53.95%" stop-color="rgba(0, 71, 255, 0.09)"></stop><stop offset="100%" stop-color="rgba(10, 14, 23, 0)"></stop></radialGradient><radialGradient id=":r0:-mobile" cy="100%"><stop offset="0%" stop-color="rgba(56, 189, 248, 0.3)"></stop><stop offset="53.95%" stop-color="rgba(0, 71, 255, 0.09)"></stop><stop offset="100%" stop-color="rgba(10, 14, 23, 0)"></stop></radialGradient></defs><rect width="100%" height="100%" fill="url(#:r0:-desktop)" class="hidden lg:block"></rect><rect width="100%" height="100%" fill="url(#:r0:-mobile)" class="lg:hidden"></rect></svg><div class="absolute inset-x-0 bottom-0 right-0 h-px bg-white mix-blend-overlay lg:left-auto lg:top-0 lg:h-auto lg:w-px"></div></div><div class="relative flex w-full lg:pointer-events-auto lg:mr-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-[32rem] lg:overflow-y-auto lg:overflow-x-hidden lg:pl-[max(4rem,calc(50%-38rem))]"><div class="mx-auto max-w-lg lg:mx-0 lg:flex lg:w-96 lg:max-w-none lg:items-center lg:before:pt-6"><div class="pb-16 pt-20 sm:pb-20 sm:pt-32 lg:py-20"><div class="relative"><svg viewBox="0 0 881 211" fill="white" aria-hidden="true" class="pointer-events-none absolute -right-44 top-14 w-[55.0625rem] origin-top-right rotate-[30deg] overflow-visible opacity-70"><defs><filter id=":r1:"><feGaussianBlur in="SourceGraphic" stdDeviation=".5"></feGaussianBlur></filter></defs><path stroke="white" stroke-opacity="0.2" stroke-dasharray="1" stroke-dashoffset="1" pathLength="1" fill="transparent" d="M 247,103L261,86L307,104L357,36" class="invisible"></path><g class="opacity-0"><circle cx="247" cy="103" r="1" style="transform-origin: 15.4375rem 6.4375rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="261" cy="86" r="1" style="transform-origin: 16.3125rem 5.375rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="307" cy="104" r="1" style="transform-origin: 19.1875rem 6.5rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="357" cy="36" r="1" style="transform-origin: 22.3125rem 2.25rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><path stroke="white" stroke-opacity="0.2" stroke-dasharray="1" stroke-dashoffset="1" pathLength="1" fill="transparent" d="M 586,120L516,100L491,62L440,107L477,180L516,100" class="invisible"></path><g class="opacity-0"><circle cx="586" cy="120" r="1" style="transform-origin: 36.625rem 7.5rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="516" cy="100" r="1" style="transform-origin: 32.25rem 6.25rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="491" cy="62" r="1" style="transform-origin: 30.6875rem 3.875rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="440" cy="107" r="1" style="transform-origin: 27.5rem 6.6875rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="477" cy="180" r="1" style="transform-origin: 29.8125rem 11.25rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><path stroke="white" stroke-opacity="0.2" stroke-dasharray="1" stroke-dashoffset="1" pathLength="1" fill="transparent" d="M 733,100L803,120L879,113L823,164L803,120" class="invisible"></path><g class="opacity-0"><circle cx="733" cy="100" r="1" style="transform-origin: 45.8125rem 6.25rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="803" cy="120" r="1" style="transform-origin: 50.1875rem 7.5rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="879" cy="113" r="1" style="transform-origin: 54.9375rem 7.0625rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="823" cy="164" r="1" style="transform-origin: 51.4375rem 10.25rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="4" cy="4" r="1" filter="url(#:r1:)" style="transform-origin: 0.25rem 0.25rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="4" cy="44" r="1" style="transform-origin: 0.25rem 2.75rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="36" cy="22" r="1" style="transform-origin: 2.25rem 1.375rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="50" cy="146" r="1" filter="url(#:r1:)" style="transform-origin: 3.125rem 9.125rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="64" cy="43" r="1" filter="url(#:r1:)" style="transform-origin: 4rem 2.6875rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="76" cy="30" r="1" style="transform-origin: 4.75rem 1.875rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="101" cy="116" r="1" style="transform-origin: 6.3125rem 7.25rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="140" cy="36" r="1" style="transform-origin: 8.75rem 2.25rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="149" cy="134" r="1" style="transform-origin: 9.3125rem 8.375rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="162" cy="74" r="1" style="transform-origin: 10.125rem 4.625rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="171" cy="96" r="1" filter="url(#:r1:)" style="transform-origin: 10.6875rem 6rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="210" cy="56" r="1" filter="url(#:r1:)" style="transform-origin: 13.125rem 3.5rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="235" cy="90" r="1" style="transform-origin: 14.6875rem 5.625rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="275" cy="82" r="1" filter="url(#:r1:)" style="transform-origin: 17.1875rem 5.125rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="306" cy="6" r="1" style="transform-origin: 19.125rem 0.375rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="307" cy="64" r="1" filter="url(#:r1:)" style="transform-origin: 19.1875rem 4rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="380" cy="68" r="1" style="transform-origin: 23.75rem 4.25rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="380" cy="108" r="1" filter="url(#:r1:)" style="transform-origin: 23.75rem 6.75rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="391" cy="148" r="1" filter="url(#:r1:)" style="transform-origin: 24.4375rem 9.25rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="405" cy="18" r="1" style="transform-origin: 25.3125rem 1.125rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="412" cy="86" r="1" filter="url(#:r1:)" style="transform-origin: 25.75rem 5.375rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="426" cy="210" r="1" filter="url(#:r1:)" style="transform-origin: 26.625rem 13.125rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="427" cy="56" r="1" filter="url(#:r1:)" style="transform-origin: 26.6875rem 3.5rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="538" cy="138" r="1" style="transform-origin: 33.625rem 8.625rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="563" cy="88" r="1" filter="url(#:r1:)" style="transform-origin: 35.1875rem 5.5rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="611" cy="154" r="1" filter="url(#:r1:)" style="transform-origin: 38.1875rem 9.625rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="637" cy="150" r="1" style="transform-origin: 39.8125rem 9.375rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="651" cy="146" r="1" style="transform-origin: 40.6875rem 9.125rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="682" cy="70" r="1" filter="url(#:r1:)" style="transform-origin: 42.625rem 4.375rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="683" cy="128" r="1" style="transform-origin: 42.6875rem 8rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="781" cy="82" r="1" filter="url(#:r1:)" style="transform-origin: 48.8125rem 5.125rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="785" cy="158" r="1" style="transform-origin: 49.0625rem 9.875rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="832" cy="146" r="1" filter="url(#:r1:)" style="transform-origin: 52rem 9.125rem; opacity: 0.2; transform: scale(var(--motion-scale));"></circle></g><g class="opacity-0"><circle cx="852" cy="89" r="1" style="transform-origin: 53.25rem 5.5625rem; opacity: 1; transform: scale(var(--motion-scale));"></circle></g></svg><div><a href="/"><div class="flex items-center gap-3 text-white"><svg width="32" height="32" viewBox="0 0 128 128" fill="none"><path d="M60.5 23V55.5L37.5 33V0L60.5 23Z" fill="#7dd3fc"></path><path d="M23 60.5H55.5L32.5 37.5H0L23 60.5Z" fill="#7dd3fc"></path><path d="M23 67H55.5L32.5 90H0L23 67Z" fill="#7dd3fc"></path><path d="M60.5 104.5V72L37.5 94.5V128L60.5 104.5Z" fill="#7dd3fc"></path><path d="M67 104.5V72L90 94.5V128L67 104.5Z" fill="#7dd3fc"></path><path d="M94.5 90L72.5 67H105L127.5 90H94.5Z" fill="#7dd3fc"></path><path d="M105 60.5H72.5L94.5 37.5H127.5L105 60.5Z" fill="#7dd3fc"></path><path d="M67 23V55.5L90 33V0L67 23Z" fill="#7dd3fc"></path></svg><div class="text-2xl/tight font-semibold">Swordflake</div></div></a></div><h1 class="mt-14 font-display text-4xl/tight font-light text-white">We build & design <span class="text-sky-300">Websites & Apps</span></h1><p class="mt-4 text-sm/6 text-gray-300">Whether it’s for design or development we use the best practices available to deliver the highest quality projects. We are passionate about our work and are always seeking to perfect our craft and deepen our understanding of the tools we use.</p><a href="mailto:[email protected]" class="group relative isolate mt-8 flex items-center pr-1"><div required="" class="peer w-0 flex-auto bg-transparent px-4 py-2.5 text-[0.8125rem]/6 text-gray-500 focus:outline-none">Do you have a project?</div><button class="relative isolate flex-none rounded-md py-1.5 text-[0.8125rem]/6 font-semibold text-white pl-2.5 pr-[calc(9/16*1rem)]"><span class="absolute inset-0 rounded-md bg-gradient-to-b from-white/80 to-white opacity-10 transition-opacity group-hover:opacity-15"></span><span class="absolute inset-0 rounded-md opacity-7.5 shadow-[inset_0_1px_1px_white] transition-opacity group-hover:opacity-10"></span>Contact us <span aria-hidden="true">→</span></button><div class="absolute inset-0 -z-10 rounded-lg transition peer-focus:ring-4 peer-focus:ring-sky-300/15"></div><div class="absolute inset-0 -z-10 rounded-lg bg-white/2.5 ring-1 ring-white/15 transition peer-focus:ring-sky-300"></div></a><div class="mt-8 flex flex-wrap justify-center gap-x-1 gap-y-3 sm:gap-x-2 lg:justify-start"><a class="flex-none group relative isolate flex items-center rounded-lg px-2 py-0.5 text-[0.8125rem]/6 font-medium text-white/30 transition-colors hover:text-sky-300 gap-x-3" href="mailto:[email protected]"><span class="absolute inset-0 -z-10 scale-75 rounded-lg bg-white/5 opacity-0 transition group-hover:scale-100 group-hover:opacity-100"></span><svg viewBox="0 0 24 24" aria-hidden="true" fill="currentColor" class="flex-none h-4 w-4"><path fill-rule="evenodd" clip-rule="evenodd" d="M6.912 3a3 3 0 00-2.868 2.118l-2.411 7.838a3 3 0 00-.133.882V18a3 3 0 003 3h15a3 3 0 003-3v-4.162c0-.299-.045-.596-.133-.882l-2.412-7.838A3 3 0 0017.088 3H6.912zm13.823 9.75l-2.213-7.191A1.5 1.5 0 0017.088 4.5H6.912a1.5 1.5 0 00-1.434 1.059L3.265 12.75H6.11a3 3 0 012.684 1.658l.256.513a1.5 1.5 0 001.342.829h3.218a1.5 1.5 0 001.342-.83l.256-.512a3 3 0 012.684-1.658h2.844z"></path></svg><span class="self-baseline text-white">Email</span></a><a class="flex-none group relative isolate flex items-center rounded-lg px-2 py-0.5 text-[0.8125rem]/6 font-medium text-white/30 transition-colors hover:text-sky-300 gap-x-3" href="https://github.com/swordflake"><span class="absolute inset-0 -z-10 scale-75 rounded-lg bg-white/5 opacity-0 transition group-hover:scale-100 group-hover:opacity-100"></span><svg viewBox="0 0 16 16" aria-hidden="true" fill="currentColor" class="flex-none h-4 w-4"><path d="M8 .198a8 8 0 0 0-8 8 7.999 7.999 0 0 0 5.47 7.59c.4.076.547-.172.547-.384 0-.19-.007-.694-.01-1.36-2.226.482-2.695-1.074-2.695-1.074-.364-.923-.89-1.17-.89-1.17-.725-.496.056-.486.056-.486.803.056 1.225.824 1.225.824.714 1.224 1.873.87 2.33.666.072-.518.278-.87.507-1.07-1.777-.2-3.644-.888-3.644-3.954 0-.873.31-1.586.823-2.146-.09-.202-.36-1.016.07-2.118 0 0 .67-.214 2.2.82a7.67 7.67 0 0 1 2-.27 7.67 7.67 0 0 1 2 .27c1.52-1.034 2.19-.82 2.19-.82.43 1.102.16 1.916.08 2.118.51.56.82 1.273.82 2.146 0 3.074-1.87 3.75-3.65 3.947.28.24.54.73.54 1.48 0 1.07-.01 1.93-.01 2.19 0 .21.14.46.55.38A7.972 7.972 0 0 0 16 8.199a8 8 0 0 0-8-8Z"></path></svg><span class="self-baseline text-white">GitHub</span></a><a class="flex-none group relative isolate flex items-center rounded-lg px-2 py-0.5 text-[0.8125rem]/6 font-medium text-white/30 transition-colors hover:text-sky-300 gap-x-3" href="/rss/feed.xml"><span class="absolute inset-0 -z-10 scale-75 rounded-lg bg-white/5 opacity-0 transition group-hover:scale-100 group-hover:opacity-100"></span><svg viewBox="0 0 16 16" aria-hidden="true" fill="currentColor" class="flex-none h-4 w-4"><path fill-rule="evenodd" clip-rule="evenodd" d="M2.5 3a.5.5 0 0 1 .5-.5h.5c5.523 0 10 4.477 10 10v.5a.5.5 0 0 1-.5.5h-.5a.5.5 0 0 1-.5-.5v-.5A8.5 8.5 0 0 0 3.5 4H3a.5.5 0 0 1-.5-.5V3Zm0 4.5A.5.5 0 0 1 3 7h.5A5.5 5.5 0 0 1 9 12.5v.5a.5.5 0 0 1-.5.5H8a.5.5 0 0 1-.5-.5v-.5a4 4 0 0 0-4-4H3a.5.5 0 0 1-.5-.5v-.5Zm0 5a1 1 0 1 1 2 0 1 1 0 0 1-2 0Z"></path></svg><span class="self-baseline text-white">RSS</span></a></div></div></div></div></div></div><button type="button" aria-label="Switch to dark theme" class="group absolute right-4 top-4 z-50 -m-2.5 p-2.5"><span class="sr-only">Switch to dark theme</span><span class="absolute inset-1 scale-75 rounded-lg opacity-0 transition-all group-hover:scale-100 group-hover:opacity-100 dark:bg-white/5 lg:bg-gray-900/5"></span><svg class="h-6 w-6 text-white opacity-50 transition-opacity group-hover:opacity-100 lg:text-gray-900 lg:dark:text-white" width="36" height="36" viewBox="0 0 24 24"><defs><mask id="lineMdLightDarkLoop0"><circle cx="7.5" cy="7.5" r="5.5" fill="#fff"></circle><circle cx="7.5" cy="7.5" r="5.5"><animate fill="freeze" attributeName="cx" dur="0.4s" values="7.5;11"></animate><animate fill="freeze" attributeName="r" dur="0.4s" values="5.5;6.5"></animate></circle></mask><mask id="lineMdLightDarkLoop1"><g fill="#fff"><circle cx="12" cy="9" r="5.5"><animate fill="freeze" attributeName="cy" begin="1s" dur="0.5s" values="9;15"></animate></circle><g><g fill-opacity="0"><use href="#lineMdLightDarkLoop2" transform="rotate(-125 12 15)"></use><use href="#lineMdLightDarkLoop2" transform="rotate(-75 12 15)"></use><use href="#lineMdLightDarkLoop2" transform="rotate(-25 12 15)"></use><use href="#lineMdLightDarkLoop2" transform="rotate(25 12 15)"></use><use href="#lineMdLightDarkLoop2" transform="rotate(75 12 15)"></use><set attributeName="fill-opacity" begin="1.5s" to="1"></set></g><animateTransform attributeName="transform" dur="5s" repeatCount="indefinite" type="rotate" values="0 12 15;50 12 15"></animateTransform></g></g><path d="M0 10h26v5h-26z"></path><path fill="none" stroke="#fff" stroke-dasharray="26" stroke-dashoffset="26" stroke-linecap="round" stroke-width="2" d="M1 12h22"><animate attributeName="d" dur="6s" repeatCount="indefinite" values="M0 12h22;M2 12h22;M0 12h22"></animate><animate fill="freeze" attributeName="stroke-dashoffset" begin="0.5s" dur="0.4s" values="26;52"></animate></path></mask><symbol id="lineMdLightDarkLoop2"><path d="M0 0"><animate fill="freeze" attributeName="d" begin="1.5s" dur="0.4s" values="M11 18h2L12 20z;M10.5 21.5h3L12 24z"></animate></path></symbol></defs><g fill="currentColor"><rect width="13" height="13" x="1" y="1" mask="url(#lineMdLightDarkLoop0)"></rect><path d="M-2 11h28v13h-28z" mask="url(#lineMdLightDarkLoop1)" transform="rotate(-45 12 12)"></path></g></svg></button><div class="relative flex-auto"><div class="pointer-events-none absolute inset-0 z-50 overflow-hidden lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-[32rem] lg:overflow-visible"><svg class="absolute left-[max(0px,calc(50%-18.125rem))] top-0 h-full w-1.5 lg:left-full lg:ml-1 xl:left-auto xl:right-1 xl:ml-0" aria-hidden="true"><defs><pattern id=":r2:" width="6" height="8" patternUnits="userSpaceOnUse"><path d="M0 0H6M0 8H6" class="stroke-sky-900/10 dark:stroke-white/10 xl:stroke-white/10" fill="none"></path></pattern></defs><rect width="100%" height="100%" fill="url(#:r2:)"></rect></svg></div><main class="space-y-20 py-20 sm:space-y-32 sm:py-32"><article id="at-the-moment" class="scroll-mt-16" style="padding-bottom: 0px;"><div><header class="relative mb-10 xl:mb-0"><div class="pointer-events-none absolute left-[max(-0.5rem,calc(50%-18.625rem))] top-0 z-50 flex h-4 items-center justify-end gap-x-2 lg:left-0 lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-[32rem] xl:h-8"><a aria-label="2024-12-15" class="inline-flex" href="/#at-the-moment"><time datetime="2024-12-15T00:00:00.000Z" class="hidden xl:pointer-events-auto xl:block xl:text-2xs/4 xl:font-medium xl:text-white/50">Dec 15, 2024</time></a><div class="h-[0.0625rem] w-3.5 bg-gray-400 lg:-mr-3.5 xl:mr-0 xl:bg-gray-300"></div></div><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto"><div class="flex"><a aria-label="2024-12-15" class="inline-flex" href="/#at-the-moment"><time datetime="2024-12-15T00:00:00.000Z" class="text-2xs/4 font-medium text-gray-500 dark:text-white/50 xl:hidden">Dec 15, 2024</time></a></div></div></div></div></header><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto typography">
<h2><a href="/#at-the-moment">At the moment</a></h2>
<p>Swordflake is working on new projects. Don't forget to follow our updates.</p>
</div></div></div></div></article><article id="nine-types" class="scroll-mt-16" style="padding-bottom: 2.98438px;"><div><header class="relative mb-10 xl:mb-0"><div class="pointer-events-none absolute left-[max(-0.5rem,calc(50%-18.625rem))] top-0 z-50 flex h-4 items-center justify-end gap-x-2 lg:left-0 lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-[32rem] xl:h-8"><a aria-label="2024-04-01T00:00Z" class="inline-flex" href="/#nine-types"><time datetime="2024-04-01T00:00:00.000Z" class="hidden xl:pointer-events-auto xl:block xl:text-2xs/4 xl:font-medium xl:text-white/50">Apr 1, 2024</time></a><div class="h-[0.0625rem] w-3.5 bg-gray-400 lg:-mr-3.5 xl:mr-0 xl:bg-gray-300"></div></div><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto"><div class="flex"><a aria-label="2024-04-01T00:00Z" class="inline-flex" href="/#nine-types"><time datetime="2024-04-01T00:00:00.000Z" class="text-2xs/4 font-medium text-gray-500 dark:text-white/50 xl:hidden">Apr 1, 2024</time></a></div></div></div></div></header><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto typography">
<div class="relative mt-8 overflow-hidden rounded-xl bg-gray-50 dark:bg-gray-900 [&+*]:mt-8"><img alt="Nine Types" loading="lazy" width="650" height="372" decoding="async" data-nimg="1" src="/_next/static/media/ninetypes.e8b2b572.webp" style="color: transparent;"><div class="pointer-events-none absolute inset-0 rounded-xl ring-1 ring-inset ring-gray-900/10 dark:ring-white/10"></div></div>
<h2><a href="/#nine-types">Nine Types</a></h2>
</div></div></div></div></article><article id="ikigai" class="scroll-mt-16" style="padding-bottom: 7.34375px;"><div><header class="relative mb-10 xl:mb-0"><div class="pointer-events-none absolute left-[max(-0.5rem,calc(50%-18.625rem))] top-0 z-50 flex h-4 items-center justify-end gap-x-2 lg:left-0 lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-[32rem] xl:h-8"><a aria-label="2023-12-03T00:00Z" class="inline-flex" href="/#ikigai"><time datetime="2023-12-03T00:00:00.000Z" class="hidden xl:pointer-events-auto xl:block xl:text-2xs/4 xl:font-medium xl:text-white/50">Dec 3, 2023</time></a><div class="h-[0.0625rem] w-3.5 bg-gray-400 lg:-mr-3.5 xl:mr-0 xl:bg-gray-300"></div></div><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto"><div class="flex"><a aria-label="2023-12-03T00:00Z" class="inline-flex" href="/#ikigai"><time datetime="2023-12-03T00:00:00.000Z" class="text-2xs/4 font-medium text-gray-500 dark:text-white/50 xl:hidden">Dec 3, 2023</time></a></div></div></div></div></header><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto typography">
<div class="relative mt-8 overflow-hidden rounded-xl bg-gray-50 dark:bg-gray-900 [&+*]:mt-8"><img alt="Ikigai Mangas" loading="lazy" width="650" height="336" decoding="async" data-nimg="1" src="/_next/static/media/ikigai.02e40d46.webp" style="color: transparent;"><div class="pointer-events-none absolute inset-0 rounded-xl ring-1 ring-inset ring-gray-900/10 dark:ring-white/10"></div></div>
<h2><a href="/#ikigai">Ikigai</a></h2>
<p>In the Ikigai project, our goal was to reduce maintenance costs compared to the previous system and ensure data security by creating a database cluster. Despite being one of the largest projects we have undertaken so far, we have transformed it into a structure that consumes minimal server resources and ensures data security even if we lose one of the servers. Additionally, in the event of high load, we can directly add a new server to the cluster to handle the load. Development is still ongoing, but we couldn't resist sharing this project with you any longer. There are many more exciting features in the pipeline!</p>
<h3 id="-main-features"><svg viewBox="0 0 16 16" aria-hidden="true"><path fill="#38BDF8" d="M5.338 9.805c.11.418.439.747.857.857C7.282 10.948 8 11.44 8 12s-.718 1.052-1.805 1.338c-.418.11-.747.439-.857.857C5.052 15.281 4.56 16 4 16s-1.052-.718-1.338-1.805a1.205 1.205 0 0 0-.856-.857C.718 13.052 0 12.56 0 12s.718-1.052 1.806-1.338c.417-.11.746-.439.856-.857C2.948 8.718 3.441 8 4 8c.56 0 1.052.718 1.338 1.805Z"></path><path fill="#7DD3FC" d="M12.717 2.432c.1.42.43.75.85.852C15.026 3.633 16 4.27 16 5s-.975 1.367-2.432 1.716c-.42.101-.75.432-.851.852C12.367 9.025 11.729 10 11 10c-.729 0-1.367-.975-1.716-2.432-.101-.42-.431-.75-.851-.852C6.975 6.367 6 5.73 6 5c0-.73.975-1.367 2.433-1.717.42-.1.75-.43.85-.85C9.634.974 10.272 0 11 0c.73 0 1.367.975 1.717 2.432Z"></path></svg> Main Features</h3>
<ul>
<li>Advanced data caching methods.</li>
<li>Minimized server costs.</li>
<li>Ensured failover security.</li>
</ul>
</div></div></div></div></article><article id="alandal" class="scroll-mt-16" style="padding-bottom: 7.34375px;"><div><header class="relative mb-10 xl:mb-0"><div class="pointer-events-none absolute left-[max(-0.5rem,calc(50%-18.625rem))] top-0 z-50 flex h-4 items-center justify-end gap-x-2 lg:left-0 lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-[32rem] xl:h-8"><a aria-label="2023-07-01T00:00Z" class="inline-flex" href="/#alandal"><time datetime="2023-07-01T00:00:00.000Z" class="hidden xl:pointer-events-auto xl:block xl:text-2xs/4 xl:font-medium xl:text-white/50">Jul 1, 2023</time></a><div class="h-[0.0625rem] w-3.5 bg-gray-400 lg:-mr-3.5 xl:mr-0 xl:bg-gray-300"></div></div><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto"><div class="flex"><a aria-label="2023-07-01T00:00Z" class="inline-flex" href="/#alandal"><time datetime="2023-07-01T00:00:00.000Z" class="text-2xs/4 font-medium text-gray-500 dark:text-white/50 xl:hidden">Jul 1, 2023</time></a></div></div></div></div></header><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto typography">
<div class="relative mt-8 overflow-hidden rounded-xl bg-gray-50 dark:bg-gray-900 [&+*]:mt-8"><img alt="Alandal" loading="lazy" width="650" height="336" decoding="async" data-nimg="1" src="/_next/static/media/alandal.32846a46.webp" style="color: transparent;"><div class="pointer-events-none absolute inset-0 rounded-xl ring-1 ring-inset ring-gray-900/10 dark:ring-white/10"></div></div>
<h2><a href="/#alandal">Alandal</a></h2>
<p>Alandal is an entrepreneurial venture where you can read and purchase licensed novel and comic series. Our goal in this project was to create a system architecture that facilitates the addition of future developments. With features such as coin package sales, subscriptions, time-based content sharing, unlocking time-based content, analytics, and statistics, Alandal has established itself in the comic and novel community.</p>
<h3 id="-main-features-1"><svg viewBox="0 0 16 16" aria-hidden="true"><path fill="#38BDF8" d="M5.338 9.805c.11.418.439.747.857.857C7.282 10.948 8 11.44 8 12s-.718 1.052-1.805 1.338c-.418.11-.747.439-.857.857C5.052 15.281 4.56 16 4 16s-1.052-.718-1.338-1.805a1.205 1.205 0 0 0-.856-.857C.718 13.052 0 12.56 0 12s.718-1.052 1.806-1.338c.417-.11.746-.439.856-.857C2.948 8.718 3.441 8 4 8c.56 0 1.052.718 1.338 1.805Z"></path><path fill="#7DD3FC" d="M12.717 2.432c.1.42.43.75.85.852C15.026 3.633 16 4.27 16 5s-.975 1.367-2.432 1.716c-.42.101-.75.432-.851.852C12.367 9.025 11.729 10 11 10c-.729 0-1.367-.975-1.716-2.432-.101-.42-.431-.75-.851-.852C6.975 6.367 6 5.73 6 5c0-.73.975-1.367 2.433-1.717.42-.1.75-.43.85-.85C9.634.974 10.272 0 11 0c.73 0 1.367.975 1.717 2.432Z"></path></svg> Main Features</h3>
<ul>
<li>Subscription and coin system.</li>
<li>Time based content release.</li>
<li>Advanced analytics and statistics.</li>
</ul>
</div></div></div></div></article><article id="olympus" class="scroll-mt-16" style="padding-bottom: 5.64062px;"><div><header class="relative mb-10 xl:mb-0"><div class="pointer-events-none absolute left-[max(-0.5rem,calc(50%-18.625rem))] top-0 z-50 flex h-4 items-center justify-end gap-x-2 lg:left-0 lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-[32rem] xl:h-8"><a aria-label="2023-02-27T00:00Z" class="inline-flex" href="/#olympus"><time datetime="2023-02-27T00:00:00.000Z" class="hidden xl:pointer-events-auto xl:block xl:text-2xs/4 xl:font-medium xl:text-white/50">Feb 27, 2023</time></a><div class="h-[0.0625rem] w-3.5 bg-gray-400 lg:-mr-3.5 xl:mr-0 xl:bg-gray-300"></div></div><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto"><div class="flex"><a aria-label="2023-02-27T00:00Z" class="inline-flex" href="/#olympus"><time datetime="2023-02-27T00:00:00.000Z" class="text-2xs/4 font-medium text-gray-500 dark:text-white/50 xl:hidden">Feb 27, 2023</time></a></div></div></div></div></header><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto typography">
<div class="relative mt-8 overflow-hidden rounded-xl bg-gray-50 dark:bg-gray-900 [&+*]:mt-8"><img alt="Olympus Scans" loading="lazy" width="650" height="328" decoding="async" data-nimg="1" src="/_next/static/media/olympus.d951d457.webp" style="color: transparent;"><div class="pointer-events-none absolute inset-0 rounded-xl ring-1 ring-inset ring-gray-900/10 dark:ring-white/10"></div></div>
<h2><a href="/#olympus">Olympus</a></h2>
<p>Olympus is one of the biggest comic and novel websites that publishes content in Spanish. Our goal with this project was to make it as lightweight and agile as possible, reason is simple, it gets more than 36000 request per minute and we don't want to see any sluggish.</p>
<p>To achieve this, we had to utilise Browser and CSS. In short, Javascript is a heavy thing, and we tried to avoid it. Animations, transitions, icons are completely written in CSS. Reactivity was removed from most sections. The size of components on the site were kept small. This gave us a tremendous application with low browser rendering time. To relief the server from the requests, we utilise various caching methods both in and out of the server. We also had to rewrite the image processing and queuing systems because of the large number of visitors and content uploaders on the site at the same time.</p>
<h3 id="-main-features-2"><svg viewBox="0 0 16 16" aria-hidden="true"><path fill="#38BDF8" d="M5.338 9.805c.11.418.439.747.857.857C7.282 10.948 8 11.44 8 12s-.718 1.052-1.805 1.338c-.418.11-.747.439-.857.857C5.052 15.281 4.56 16 4 16s-1.052-.718-1.338-1.805a1.205 1.205 0 0 0-.856-.857C.718 13.052 0 12.56 0 12s.718-1.052 1.806-1.338c.417-.11.746-.439.856-.857C2.948 8.718 3.441 8 4 8c.56 0 1.052.718 1.338 1.805Z"></path><path fill="#7DD3FC" d="M12.717 2.432c.1.42.43.75.85.852C15.026 3.633 16 4.27 16 5s-.975 1.367-2.432 1.716c-.42.101-.75.432-.851.852C12.367 9.025 11.729 10 11 10c-.729 0-1.367-.975-1.716-2.432-.101-.42-.431-.75-.851-.852C6.975 6.367 6 5.73 6 5c0-.73.975-1.367 2.433-1.717.42-.1.75-.43.85-.85C9.634.974 10.272 0 11 0c.73 0 1.367.975 1.717 2.432Z"></path></svg> Main Features</h3>
<ul>
<li>Light and agile structure.</li>
<li>Advanced group, role and permission system.</li>
<li>Various caching methods.</li>
</ul>
</div></div></div></div></article><article id="sapphire-v2" class="scroll-mt-16" style="padding-bottom: 3.15625px;"><div><header class="relative mb-10 xl:mb-0"><div class="pointer-events-none absolute left-[max(-0.5rem,calc(50%-18.625rem))] top-0 z-50 flex h-4 items-center justify-end gap-x-2 lg:left-0 lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-[32rem] xl:h-8"><a aria-label="2022-10-06T00:00Z" class="inline-flex" href="/#sapphire-v2"><time datetime="2022-10-06T00:00:00.000Z" class="hidden xl:pointer-events-auto xl:block xl:text-2xs/4 xl:font-medium xl:text-white/50">Oct 6, 2022</time></a><div class="h-[0.0625rem] w-3.5 bg-gray-400 lg:-mr-3.5 xl:mr-0 xl:bg-gray-300"></div></div><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto"><div class="flex"><a aria-label="2022-10-06T00:00Z" class="inline-flex" href="/#sapphire-v2"><time datetime="2022-10-06T00:00:00.000Z" class="text-2xs/4 font-medium text-gray-500 dark:text-white/50 xl:hidden">Oct 6, 2022</time></a></div></div></div></div></header><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto typography">
<div class="relative mt-8 overflow-hidden rounded-xl bg-gray-50 dark:bg-gray-900 [&+*]:mt-8"><img alt="Swordflake Sapphire v2" loading="lazy" width="650" height="321" decoding="async" data-nimg="1" src="/_next/static/media/sapphire2-1.ae2e5391.webp" style="color: transparent;"><div class="pointer-events-none absolute inset-0 rounded-xl ring-1 ring-inset ring-gray-900/10 dark:ring-white/10"></div></div>
<h2><a href="/#sapphire-v2">Sapphire v2</a></h2>
<p>Sapphire v2 is a novel and comic reading website. Our goal with this project was to cover everything that every community in the industry, from small to large, could need.</p>
<p><code>v1</code> was an application that appealed to small groups and could be hosted on small servers, in <code>v2</code>, on the contrary, we wanted to address everything that could be needed in a large site, such as novels, comics, team recruitment, forums, blogs, coins, comment system, member moderation and banning system, public profiles and readlists.</p>
<h3 id="-main-features-3"><svg viewBox="0 0 16 16" aria-hidden="true"><path fill="#38BDF8" d="M5.338 9.805c.11.418.439.747.857.857C7.282 10.948 8 11.44 8 12s-.718 1.052-1.805 1.338c-.418.11-.747.439-.857.857C5.052 15.281 4.56 16 4 16s-1.052-.718-1.338-1.805a1.205 1.205 0 0 0-.856-.857C.718 13.052 0 12.56 0 12s.718-1.052 1.806-1.338c.417-.11.746-.439.856-.857C2.948 8.718 3.441 8 4 8c.56 0 1.052.718 1.338 1.805Z"></path><path fill="#7DD3FC" d="M12.717 2.432c.1.42.43.75.85.852C15.026 3.633 16 4.27 16 5s-.975 1.367-2.432 1.716c-.42.101-.75.432-.851.852C12.367 9.025 11.729 10 11 10c-.729 0-1.367-.975-1.716-2.432-.101-.42-.431-.75-.851-.852C6.975 6.367 6 5.73 6 5c0-.73.975-1.367 2.433-1.717.42-.1.75-.43.85-.85C9.634.974 10.272 0 11 0c.73 0 1.367.975 1.717 2.432Z"></path></svg> Main Features</h3>
<ul>
<li>Very comprehensive.</li>
<li>Highly flexible.</li>
</ul>
</div></div></div></div></article><article id="aoio" class="scroll-mt-16" style="padding-bottom: 3.15625px;"><div><header class="relative mb-10 xl:mb-0"><div class="pointer-events-none absolute left-[max(-0.5rem,calc(50%-18.625rem))] top-0 z-50 flex h-4 items-center justify-end gap-x-2 lg:left-0 lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-[32rem] xl:h-8"><a aria-label="2022-09-01T00:00Z" class="inline-flex" href="/#aoio"><time datetime="2022-09-01T00:00:00.000Z" class="hidden xl:pointer-events-auto xl:block xl:text-2xs/4 xl:font-medium xl:text-white/50">Sep 1, 2022</time></a><div class="h-[0.0625rem] w-3.5 bg-gray-400 lg:-mr-3.5 xl:mr-0 xl:bg-gray-300"></div></div><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto"><div class="flex"><a aria-label="2022-09-01T00:00Z" class="inline-flex" href="/#aoio"><time datetime="2022-09-01T00:00:00.000Z" class="text-2xs/4 font-medium text-gray-500 dark:text-white/50 xl:hidden">Sep 1, 2022</time></a></div></div></div></div></header><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto typography">
<div class="relative mt-8 overflow-hidden rounded-xl bg-gray-50 dark:bg-gray-900 [&+*]:mt-8"><img alt="A__o io" loading="lazy" width="650" height="321" decoding="async" data-nimg="1" src="/_next/static/media/a__o.9b60ca9b.webp" style="color: transparent;"><div class="pointer-events-none absolute inset-0 rounded-xl ring-1 ring-inset ring-gray-900/10 dark:ring-white/10"></div></div>
<h2><a href="/#aoio">A**o.io</a></h2>
<p>It was a project that would begin with novels and later include comic series. Our goal for this project was to create an extremely comprehensive and very flexible structure while maintaining speed and performance.</p>
<p>Since the content of the site is about novels, we created a custom JSON text editor. The reason we chose JSON was to increase the potential and flexibility of the project by embedding various data in the content. For example, the JSON Text Editor could be used to add comments, donations or bug reports to lines or paragraphs.</p>
<p>Unfortunately, this project didn't continue.</p>
</div></div></div></div></article><article id="iyzitool" class="scroll-mt-16" style="padding-bottom: 3.15625px;"><div><header class="relative mb-10 xl:mb-0"><div class="pointer-events-none absolute left-[max(-0.5rem,calc(50%-18.625rem))] top-0 z-50 flex h-4 items-center justify-end gap-x-2 lg:left-0 lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-[32rem] xl:h-8"><a aria-label="2022-08-24T00:00Z" class="inline-flex" href="/#iyzitool"><time datetime="2022-08-24T00:00:00.000Z" class="hidden xl:pointer-events-auto xl:block xl:text-2xs/4 xl:font-medium xl:text-white/50">Aug 24, 2022</time></a><div class="h-[0.0625rem] w-3.5 bg-gray-400 lg:-mr-3.5 xl:mr-0 xl:bg-gray-300"></div></div><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto"><div class="flex"><a aria-label="2022-08-24T00:00Z" class="inline-flex" href="/#iyzitool"><time datetime="2022-08-24T00:00:00.000Z" class="text-2xs/4 font-medium text-gray-500 dark:text-white/50 xl:hidden">Aug 24, 2022</time></a></div></div></div></div></header><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto typography">
<div class="relative mt-8 overflow-hidden rounded-xl bg-gray-50 dark:bg-gray-900 [&+*]:mt-8"><img alt="iyzitools" loading="lazy" width="650" height="321" decoding="async" data-nimg="1" src="/_next/static/media/iyzi.79729476.webp" style="color: transparent;"><div class="pointer-events-none absolute inset-0 rounded-xl ring-1 ring-inset ring-gray-900/10 dark:ring-white/10"></div></div>
<h2><a href="/#iyzitool">Iyzitool</a></h2>
<p>It was an archive of the online web tools. The aim was to offer these tools to users for free, without showing adverts. And respecting to the source by sharing their links and references.</p>
<p>For this reason, we need to make the project completely serverless and deployable at the edge, as we did in our <code>Life is self seeking</code> project, so that it does not cost and does not incur losses. The project contains dozens of tools, a few of them are; Antilog Calculator, Acid-test Ratio Calculator, Pixel & Character Counter, Size Converter, Tempeture Converter.</p>
<h3 id="-main-features-4"><svg viewBox="0 0 16 16" aria-hidden="true"><path fill="#38BDF8" d="M5.338 9.805c.11.418.439.747.857.857C7.282 10.948 8 11.44 8 12s-.718 1.052-1.805 1.338c-.418.11-.747.439-.857.857C5.052 15.281 4.56 16 4 16s-1.052-.718-1.338-1.805a1.205 1.205 0 0 0-.856-.857C.718 13.052 0 12.56 0 12s.718-1.052 1.806-1.338c.417-.11.746-.439.856-.857C2.948 8.718 3.441 8 4 8c.56 0 1.052.718 1.338 1.805Z"></path><path fill="#7DD3FC" d="M12.717 2.432c.1.42.43.75.85.852C15.026 3.633 16 4.27 16 5s-.975 1.367-2.432 1.716c-.42.101-.75.432-.851.852C12.367 9.025 11.729 10 11 10c-.729 0-1.367-.975-1.716-2.432-.101-.42-.431-.75-.851-.852C6.975 6.367 6 5.73 6 5c0-.73.975-1.367 2.433-1.717.42-.1.75-.43.85-.85C9.634.974 10.272 0 11 0c.73 0 1.367.975 1.717 2.432Z"></path></svg> Main Features</h3>
<ul>
<li>Fully serverless & deployable at edge, zero cost.</li>
<li>Light weight & blazing fast.</li>
<li>Does not collect visitor information.</li>
</ul>
</div></div></div></div></article><article id="invoice-maker" class="scroll-mt-16" style="padding-bottom: 3.15625px;"><div><header class="relative mb-10 xl:mb-0"><div class="pointer-events-none absolute left-[max(-0.5rem,calc(50%-18.625rem))] top-0 z-50 flex h-4 items-center justify-end gap-x-2 lg:left-0 lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-[32rem] xl:h-8"><a aria-label="2022-08-01T00:00Z" class="inline-flex" href="/#invoice-maker"><time datetime="2022-08-01T00:00:00.000Z" class="hidden xl:pointer-events-auto xl:block xl:text-2xs/4 xl:font-medium xl:text-white/50">Aug 1, 2022</time></a><div class="h-[0.0625rem] w-3.5 bg-gray-400 lg:-mr-3.5 xl:mr-0 xl:bg-gray-300"></div></div><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto"><div class="flex"><a aria-label="2022-08-01T00:00Z" class="inline-flex" href="/#invoice-maker"><time datetime="2022-08-01T00:00:00.000Z" class="text-2xs/4 font-medium text-gray-500 dark:text-white/50 xl:hidden">Aug 1, 2022</time></a></div></div></div></div></header><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto typography">
<div class="relative mt-8 overflow-hidden rounded-xl bg-gray-50 dark:bg-gray-900 [&+*]:mt-8"><img alt="invoice maker" loading="lazy" width="650" height="321" decoding="async" data-nimg="1" src="/_next/static/media/invoice.13b86ad9.webp" style="color: transparent;"><div class="pointer-events-none absolute inset-0 rounded-xl ring-1 ring-inset ring-gray-900/10 dark:ring-white/10"></div></div>
<h2><a href="/#invoice-maker">Invoice Maker</a></h2>
<p>Created as an online web tool, it is a free invoice creator tool that can be used through the site. Unfortunately, there are no English versions of the invoices issued in Turkey. Therefore, company owners who want to export are looking for a way to deliver their invoice to the other party.</p>
<p>In order to download the created invoice file from the browser, we first convert the created invoice to PDF with the help of a pollyfil. It works only for the purpose without collecting any visitor information on the site.</p>
<h3 id="-main-features-5"><svg viewBox="0 0 16 16" aria-hidden="true"><path fill="#38BDF8" d="M5.338 9.805c.11.418.439.747.857.857C7.282 10.948 8 11.44 8 12s-.718 1.052-1.805 1.338c-.418.11-.747.439-.857.857C5.052 15.281 4.56 16 4 16s-1.052-.718-1.338-1.805a1.205 1.205 0 0 0-.856-.857C.718 13.052 0 12.56 0 12s.718-1.052 1.806-1.338c.417-.11.746-.439.856-.857C2.948 8.718 3.441 8 4 8c.56 0 1.052.718 1.338 1.805Z"></path><path fill="#7DD3FC" d="M12.717 2.432c.1.42.43.75.85.852C15.026 3.633 16 4.27 16 5s-.975 1.367-2.432 1.716c-.42.101-.75.432-.851.852C12.367 9.025 11.729 10 11 10c-.729 0-1.367-.975-1.716-2.432-.101-.42-.431-.75-.851-.852C6.975 6.367 6 5.73 6 5c0-.73.975-1.367 2.433-1.717.42-.1.75-.43.85-.85C9.634.974 10.272 0 11 0c.73 0 1.367.975 1.717 2.432Z"></path></svg> Main Features</h3>
<ul>
<li>It works through the browser without the need to download.</li>
<li>Completely free compared to other platforms.</li>
<li>Does not collect visitor information.</li>
</ul>
</div></div></div></div></article><article id="life-is-self-seeking" class="scroll-mt-16" style="padding-bottom: 3.95312px;"><div><header class="relative mb-10 xl:mb-0"><div class="pointer-events-none absolute left-[max(-0.5rem,calc(50%-18.625rem))] top-0 z-50 flex h-4 items-center justify-end gap-x-2 lg:left-0 lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-[32rem] xl:h-8"><a aria-label="2022-07-19T00:00Z" class="inline-flex" href="/#life-is-self-seeking"><time datetime="2022-07-19T00:00:00.000Z" class="hidden xl:pointer-events-auto xl:block xl:text-2xs/4 xl:font-medium xl:text-white/50">Jul 19, 2022</time></a><div class="h-[0.0625rem] w-3.5 bg-gray-400 lg:-mr-3.5 xl:mr-0 xl:bg-gray-300"></div></div><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto"><div class="flex"><a aria-label="2022-07-19T00:00Z" class="inline-flex" href="/#life-is-self-seeking"><time datetime="2022-07-19T00:00:00.000Z" class="text-2xs/4 font-medium text-gray-500 dark:text-white/50 xl:hidden">Jul 19, 2022</time></a></div></div></div></div></header><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto typography">
<div class="relative mt-8 overflow-hidden rounded-xl bg-gray-50 dark:bg-gray-900 [&+*]:mt-8"><img alt="life is self seeking" loading="lazy" width="650" height="320" decoding="async" data-nimg="1" src="/_next/static/media/sylp.bbed69dd.webp" style="color: transparent;"><div class="pointer-events-none absolute inset-0 rounded-xl ring-1 ring-inset ring-gray-900/10 dark:ring-white/10"></div></div>
<h2><a href="/#life-is-self-seeking">Life is self seeking</a></h2>
<p>It is a blog site where articles on psychology and norms are shared. Our biggest priority in this project was to use the site in a serverless way, deploy it to the edge, and use it indefinitely without any cost.</p>
<p>In order to achieve something like this, we first need to decide how we will store our data, that is, our articles. We chose to use File-Based CMS for this project, but it was not working properly without running on the server, and we decided not to go for something like this because cloudflare, which the platform we will deploy, charges per server side function. After all, our goal was to be able to use our site indefinitely without any fee. Therefore, while building the project, we processed and used the data as Service Worker.</p>
<h3 id="-main-features-6"><svg viewBox="0 0 16 16" aria-hidden="true"><path fill="#38BDF8" d="M5.338 9.805c.11.418.439.747.857.857C7.282 10.948 8 11.44 8 12s-.718 1.052-1.805 1.338c-.418.11-.747.439-.857.857C5.052 15.281 4.56 16 4 16s-1.052-.718-1.338-1.805a1.205 1.205 0 0 0-.856-.857C.718 13.052 0 12.56 0 12s.718-1.052 1.806-1.338c.417-.11.746-.439.856-.857C2.948 8.718 3.441 8 4 8c.56 0 1.052.718 1.338 1.805Z"></path><path fill="#7DD3FC" d="M12.717 2.432c.1.42.43.75.85.852C15.026 3.633 16 4.27 16 5s-.975 1.367-2.432 1.716c-.42.101-.75.432-.851.852C12.367 9.025 11.729 10 11 10c-.729 0-1.367-.975-1.716-2.432-.101-.42-.431-.75-.851-.852C6.975 6.367 6 5.73 6 5c0-.73.975-1.367 2.433-1.717.42-.1.75-.43.85-.85C9.634.974 10.272 0 11 0c.73 0 1.367.975 1.717 2.432Z"></path></svg> Main Features</h3>
<ul>
<li>Fully serverless & deployable at edge, zero cost.</li>
<li>Light weight & blazing fast.</li>
<li>No data lose chance.</li>
</ul>
</div></div></div></div></article><article id="sapphire-v1" class="scroll-mt-16" style="padding-bottom: 3.15625px;"><div><header class="relative mb-10 xl:mb-0"><div class="pointer-events-none absolute left-[max(-0.5rem,calc(50%-18.625rem))] top-0 z-50 flex h-4 items-center justify-end gap-x-2 lg:left-0 lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-[32rem] xl:h-8"><a aria-label="2022-06-01T00:00Z" class="inline-flex" href="/#sapphire-v1"><time datetime="2022-06-01T00:00:00.000Z" class="hidden xl:pointer-events-auto xl:block xl:text-2xs/4 xl:font-medium xl:text-white/50">Jun 1, 2022</time></a><div class="h-[0.0625rem] w-3.5 bg-gray-400 lg:-mr-3.5 xl:mr-0 xl:bg-gray-300"></div></div><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto"><div class="flex"><a aria-label="2022-06-01T00:00Z" class="inline-flex" href="/#sapphire-v1"><time datetime="2022-06-01T00:00:00.000Z" class="text-2xs/4 font-medium text-gray-500 dark:text-white/50 xl:hidden">Jun 1, 2022</time></a></div></div></div></div></header><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto typography">
<div class="relative mt-8 overflow-hidden rounded-xl bg-gray-50 dark:bg-gray-900 [&+*]:mt-8"><img alt="Swordflake Sapphire v1" loading="lazy" width="650" height="321" decoding="async" data-nimg="1" src="/_next/static/media/sapphire1.7ae7255f.webp" style="color: transparent;"><div class="pointer-events-none absolute inset-0 rounded-xl ring-1 ring-inset ring-gray-900/10 dark:ring-white/10"></div></div>
<h2><a href="/#sapphire-v1">Sapphire v1</a></h2>
<p>Sapphire v1 is a comic reading application without membership features. Our goal in this project was to provide a fast and comfortable space for small groups.</p>
<p>With this platform, everything on the site can be cached either inside or outside the server, and it has become able to handle enormous numbers of visitors even on the smallest servers while providing good user interface.</p>
<h3 id="-main-features-7"><svg viewBox="0 0 16 16" aria-hidden="true"><path fill="#38BDF8" d="M5.338 9.805c.11.418.439.747.857.857C7.282 10.948 8 11.44 8 12s-.718 1.052-1.805 1.338c-.418.11-.747.439-.857.857C5.052 15.281 4.56 16 4 16s-1.052-.718-1.338-1.805a1.205 1.205 0 0 0-.856-.857C.718 13.052 0 12.56 0 12s.718-1.052 1.806-1.338c.417-.11.746-.439.856-.857C2.948 8.718 3.441 8 4 8c.56 0 1.052.718 1.338 1.805Z"></path><path fill="#7DD3FC" d="M12.717 2.432c.1.42.43.75.85.852C15.026 3.633 16 4.27 16 5s-.975 1.367-2.432 1.716c-.42.101-.75.432-.851.852C12.367 9.025 11.729 10 11 10c-.729 0-1.367-.975-1.716-2.432-.101-.42-.431-.75-.851-.852C6.975 6.367 6 5.73 6 5c0-.73.975-1.367 2.433-1.717.42-.1.75-.43.85-.85C9.634.974 10.272 0 11 0c.73 0 1.367.975 1.717 2.432Z"></path></svg> Main Features</h3>
<ul>
<li>All server responses cached. So fast.</li>
<li>Can be hosted on very small servers</li>
<li>Can handle enormous amount of visitors.</li>
</ul>
</div></div></div></div></article><article id="banner-maker" class="scroll-mt-16" style="padding-bottom: 3.40625px;"><div><header class="relative mb-10 xl:mb-0"><div class="pointer-events-none absolute left-[max(-0.5rem,calc(50%-18.625rem))] top-0 z-50 flex h-4 items-center justify-end gap-x-2 lg:left-0 lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-[32rem] xl:h-8"><a aria-label="2022-05-24T00:00Z" class="inline-flex" href="/#banner-maker"><time datetime="2022-05-24T00:00:00.000Z" class="hidden xl:pointer-events-auto xl:block xl:text-2xs/4 xl:font-medium xl:text-white/50">May 24, 2022</time></a><div class="h-[0.0625rem] w-3.5 bg-gray-400 lg:-mr-3.5 xl:mr-0 xl:bg-gray-300"></div></div><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto"><div class="flex"><a aria-label="2022-05-24T00:00Z" class="inline-flex" href="/#banner-maker"><time datetime="2022-05-24T00:00:00.000Z" class="text-2xs/4 font-medium text-gray-500 dark:text-white/50 xl:hidden">May 24, 2022</time></a></div></div></div></div></header><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto typography">
<div class="relative mt-8 overflow-hidden rounded-xl bg-gray-50 dark:bg-gray-900 [&+*]:mt-8"><img alt="banner maker" loading="lazy" width="650" height="341" decoding="async" data-nimg="1" src="/_next/static/media/banner.ceec75a6.webp" style="color: transparent;"><div class="pointer-events-none absolute inset-0 rounded-xl ring-1 ring-inset ring-gray-900/10 dark:ring-white/10"></div></div>
<h2><a href="/#banner-maker">Banner Maker</a></h2>
<p>Banner Maker is a low size portable desktop application and can run on any desktop operating system. The goal of this project was to keep the size of the application as small as possible, to make it easily portable and to create easy installation setups.</p>
<p>A banner can be printed out by filling in the given input fields in the application and adding images. The banner can be coloured, filtered, font edited and then the banner can be downloaded as an image or PDF file. We have created installers for all platforms and added an updater in case of any bugs. This updater, when the device running the application is connected to the internet, will send a request to our site (swordflake) to query whether there is a new update and will provide a popup to download it accordingly.</p>
<h3 id="-main-features-8"><svg viewBox="0 0 16 16" aria-hidden="true"><path fill="#38BDF8" d="M5.338 9.805c.11.418.439.747.857.857C7.282 10.948 8 11.44 8 12s-.718 1.052-1.805 1.338c-.418.11-.747.439-.857.857C5.052 15.281 4.56 16 4 16s-1.052-.718-1.338-1.805a1.205 1.205 0 0 0-.856-.857C.718 13.052 0 12.56 0 12s.718-1.052 1.806-1.338c.417-.11.746-.439.856-.857C2.948 8.718 3.441 8 4 8c.56 0 1.052.718 1.338 1.805Z"></path><path fill="#7DD3FC" d="M12.717 2.432c.1.42.43.75.85.852C15.026 3.633 16 4.27 16 5s-.975 1.367-2.432 1.716c-.42.101-.75.432-.851.852C12.367 9.025 11.729 10 11 10c-.729 0-1.367-.975-1.716-2.432-.101-.42-.431-.75-.851-.852C6.975 6.367 6 5.73 6 5c0-.73.975-1.367 2.433-1.717.42-.1.75-.43.85-.85C9.634.974 10.272 0 11 0c.73 0 1.367.975 1.717 2.432Z"></path></svg> Main Features</h3>
<ul>
<li>Small size and portable.</li>
<li>Supported all platforms.</li>
<li>Easy setup and usage.</li>
</ul>
</div></div></div></div></article><article id="karagol" class="scroll-mt-16" style="padding-bottom: 3.15625px;"><div><header class="relative mb-10 xl:mb-0"><div class="pointer-events-none absolute left-[max(-0.5rem,calc(50%-18.625rem))] top-0 z-50 flex h-4 items-center justify-end gap-x-2 lg:left-0 lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-[32rem] xl:h-8"><a aria-label="2022-04-30T00:00Z" class="inline-flex" href="/#karagol"><time datetime="2022-04-30T00:00:00.000Z" class="hidden xl:pointer-events-auto xl:block xl:text-2xs/4 xl:font-medium xl:text-white/50">Apr 30, 2022</time></a><div class="h-[0.0625rem] w-3.5 bg-gray-400 lg:-mr-3.5 xl:mr-0 xl:bg-gray-300"></div></div><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto"><div class="flex"><a aria-label="2022-04-30T00:00Z" class="inline-flex" href="/#karagol"><time datetime="2022-04-30T00:00:00.000Z" class="text-2xs/4 font-medium text-gray-500 dark:text-white/50 xl:hidden">Apr 30, 2022</time></a></div></div></div></div></header><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto typography">
<div class="relative mt-8 overflow-hidden rounded-xl bg-gray-50 dark:bg-gray-900 [&+*]:mt-8"><img alt="karagol real estate" loading="lazy" width="650" height="321" decoding="async" data-nimg="1" src="/_next/static/media/kara.43d29cb3.webp" style="color: transparent;"><div class="pointer-events-none absolute inset-0 rounded-xl ring-1 ring-inset ring-gray-900/10 dark:ring-white/10"></div></div>
<h2><a href="/#karagol">Karagol</a></h2>
<p>Karagol is a group that finds properties in the Aegean region for you and brings you the most affordable prices and is transparent about the percentage it receives. Our aim in this project was to make the best possible search engine optimisation (SEO) and to offer a design with a high user interface.</p>
<p>In order to optimise the search engines, we first split the site into two URL paths, <code>/en</code> and <code>/</code>, so that we can reach the target we want in both English and Turkish search engines, and to convince people who see the site in search engines to come, we used the Rich Snippets. In order to make the incoming visitor satisfied with the site, every part that involves user interactivity, including page transitions, was visually animated and a smooth transition was ensured.</p>
<h3 id="-main-features-9"><svg viewBox="0 0 16 16" aria-hidden="true"><path fill="#38BDF8" d="M5.338 9.805c.11.418.439.747.857.857C7.282 10.948 8 11.44 8 12s-.718 1.052-1.805 1.338c-.418.11-.747.439-.857.857C5.052 15.281 4.56 16 4 16s-1.052-.718-1.338-1.805a1.205 1.205 0 0 0-.856-.857C.718 13.052 0 12.56 0 12s.718-1.052 1.806-1.338c.417-.11.746-.439.856-.857C2.948 8.718 3.441 8 4 8c.56 0 1.052.718 1.338 1.805Z"></path><path fill="#7DD3FC" d="M12.717 2.432c.1.42.43.75.85.852C15.026 3.633 16 4.27 16 5s-.975 1.367-2.432 1.716c-.42.101-.75.432-.851.852C12.367 9.025 11.729 10 11 10c-.729 0-1.367-.975-1.716-2.432-.101-.42-.431-.75-.851-.852C6.975 6.367 6 5.73 6 5c0-.73.975-1.367 2.433-1.717.42-.1.75-.43.85-.85C9.634.974 10.272 0 11 0c.73 0 1.367.975 1.717 2.432Z"></path></svg> Main Features</h3>
<ul>
<li>Multilingual.</li>
<li>Rich snippets, and search engine optimisation.</li>
<li>Visually animated and smooth transitions.</li>
<li>Easy admin dashboard to manage the site.</li>
</ul>
</div></div></div></div></article><article id="zero" class="scroll-mt-16" style="padding-bottom: 3.15625px;"><div><header class="relative mb-10 xl:mb-0"><div class="pointer-events-none absolute left-[max(-0.5rem,calc(50%-18.625rem))] top-0 z-50 flex h-4 items-center justify-end gap-x-2 lg:left-0 lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-[32rem] xl:h-8"><a aria-label="2022-03-23T00:00Z" class="inline-flex" href="/#zero"><time datetime="2022-03-23T00:00:00.000Z" class="hidden xl:pointer-events-auto xl:block xl:text-2xs/4 xl:font-medium xl:text-white/50">Mar 23, 2022</time></a><div class="h-[0.0625rem] w-3.5 bg-gray-400 lg:-mr-3.5 xl:mr-0 xl:bg-gray-300"></div></div><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto"><div class="flex"><a aria-label="2022-03-23T00:00Z" class="inline-flex" href="/#zero"><time datetime="2022-03-23T00:00:00.000Z" class="text-2xs/4 font-medium text-gray-500 dark:text-white/50 xl:hidden">Mar 23, 2022</time></a></div></div></div></div></header><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto typography">
<div class="relative mt-8 overflow-hidden rounded-xl bg-gray-50 dark:bg-gray-900 [&+*]:mt-8"><img alt="zero scans" loading="lazy" width="650" height="321" decoding="async" data-nimg="1" src="/_next/static/media/zero.9b5c5e77.webp" style="color: transparent;"><div class="pointer-events-none absolute inset-0 rounded-xl ring-1 ring-inset ring-gray-900/10 dark:ring-white/10"></div></div>
<h2><a href="/#zero">Zero</a></h2>
<p>It was an urgent project, and like our previous project it was an online comic reading site. So we promised them a 2-month completion time. We wanted to create the design using material design principles. Our goal in this project was to minimise server costs and reduce the number of incoming requests, while following material design to deliver satisfactory results in terms of both user interface and user experience.</p>
<p>To prevent the number of requests coming to the server, we had to solve them either in proxy server (such as Cloudflare) or in the browser. So we did both, we cached the search, archive page, rankings and many other sections (not so dynamic places) of the website on the user's browser and Cloudflare's server, in result this relieved the server a lot. We are proud to say that costs have been reduced by more than 50% while providing more features.</p>
<h3 id="-main-features-10"><svg viewBox="0 0 16 16" aria-hidden="true"><path fill="#38BDF8" d="M5.338 9.805c.11.418.439.747.857.857C7.282 10.948 8 11.44 8 12s-.718 1.052-1.805 1.338c-.418.11-.747.439-.857.857C5.052 15.281 4.56 16 4 16s-1.052-.718-1.338-1.805a1.205 1.205 0 0 0-.856-.857C.718 13.052 0 12.56 0 12s.718-1.052 1.806-1.338c.417-.11.746-.439.856-.857C2.948 8.718 3.441 8 4 8c.56 0 1.052.718 1.338 1.805Z"></path><path fill="#7DD3FC" d="M12.717 2.432c.1.42.43.75.85.852C15.026 3.633 16 4.27 16 5s-.975 1.367-2.432 1.716c-.42.101-.75.432-.851.852C12.367 9.025 11.729 10 11 10c-.729 0-1.367-.975-1.716-2.432-.101-.42-.431-.75-.851-.852C6.975 6.367 6 5.73 6 5c0-.73.975-1.367 2.433-1.717.42-.1.75-.43.85-.85C9.634.974 10.272 0 11 0c.73 0 1.367.975 1.717 2.432Z"></path></svg> Main Features</h3>
<ul>
<li>Uploaded chapters are automatically compressed, coverted to the WEBP, and split into 3000px height chunks.</li>
<li>Precautions such as notification system to management when server resource usage is high, and temporary and permanent trash bin system.</li>
<li>A queuing system has been added so that the server doesn't get overwhelmed during the content upload process due to the large amount of content being uploaded at the same time.</li>
</ul>
</div></div></div></div></article><article id="gece" class="scroll-mt-16" style="padding-bottom: 3.15625px;"><div><header class="relative mb-10 xl:mb-0"><div class="pointer-events-none absolute left-[max(-0.5rem,calc(50%-18.625rem))] top-0 z-50 flex h-4 items-center justify-end gap-x-2 lg:left-0 lg:right-[calc(max(2rem,50%-38rem)+40rem)] lg:min-w-[32rem] xl:h-8"><a aria-label="2021-11-08T00:00Z" class="inline-flex" href="/#gece"><time datetime="2021-11-08T00:00:00.000Z" class="hidden xl:pointer-events-auto xl:block xl:text-2xs/4 xl:font-medium xl:text-white/50">Nov 8, 2021</time></a><div class="h-[0.0625rem] w-3.5 bg-gray-400 lg:-mr-3.5 xl:mr-0 xl:bg-gray-300"></div></div><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto"><div class="flex"><a aria-label="2021-11-08T00:00Z" class="inline-flex" href="/#gece"><time datetime="2021-11-08T00:00:00.000Z" class="text-2xs/4 font-medium text-gray-500 dark:text-white/50 xl:hidden">Nov 8, 2021</time></a></div></div></div></div></header><div class="mx-auto max-w-7xl px-6 lg:flex lg:px-8"><div class="lg:ml-96 lg:flex lg:w-full lg:justify-end lg:pl-32"><div class="mx-auto max-w-lg lg:mx-0 lg:w-0 lg:max-w-xl lg:flex-auto typography">
<div class="relative mt-8 overflow-hidden rounded-xl bg-gray-50 dark:bg-gray-900 [&+*]:mt-8"><img alt="manga gecesi" loading="lazy" width="650" height="321" decoding="async" data-nimg="1" src="/_next/static/media/gece.0d24410b.webp" style="color: transparent;"><div class="pointer-events-none absolute inset-0 rounded-xl ring-1 ring-inset ring-gray-900/10 dark:ring-white/10"></div></div>
<h2><a href="/#gece">Gece</a></h2>
<p>It was the largest comic site in Turkish and an ambitious project. The biggest challenge was user actions, there were too many variables related to users. A few of them were the moderation panel for reviews and comments, which includes shadow/temporary/permanent bans, managing and administering user purchases and subscriptions, user profile customization, advanced user and reading page settings.</p>
<p>It would be lying if we said it didn't take a lot of time to complete the project. Unfortunately, for a number of reasons, the payment and subscription service was never opened to the public. Still, we gained a lot of experience building such a comprehensive site for a large audience.</p>
<h3 id="-main-features-11"><svg viewBox="0 0 16 16" aria-hidden="true"><path fill="#38BDF8" d="M5.338 9.805c.11.418.439.747.857.857C7.282 10.948 8 11.44 8 12s-.718 1.052-1.805 1.338c-.418.11-.747.439-.857.857C5.052 15.281 4.56 16 4 16s-1.052-.718-1.338-1.805a1.205 1.205 0 0 0-.856-.857C.718 13.052 0 12.56 0 12s.718-1.052 1.806-1.338c.417-.11.746-.439.856-.857C2.948 8.718 3.441 8 4 8c.56 0 1.052.718 1.338 1.805Z"></path><path fill="#7DD3FC" d="M12.717 2.432c.1.42.43.75.85.852C15.026 3.633 16 4.27 16 5s-.975 1.367-2.432 1.716c-.42.101-.75.432-.851.852C12.367 9.025 11.729 10 11 10c-.729 0-1.367-.975-1.716-2.432-.101-.42-.431-.75-.851-.852C6.975 6.367 6 5.73 6 5c0-.73.975-1.367 2.433-1.717.42-.1.75-.43.85-.85C9.634.974 10.272 0 11 0c.73 0 1.367.975 1.717 2.432Z"></path></svg> Main Features</h3>
<ul>
<li>Uploaded chapters are automatically compressed.</li>
<li>A queuing system has been added so that the server doesn't get overwhelmed during the content upload process due to the large amount of content being uploaded at the same time.</li>
<li>User dynamic role permission system, profile, statistics, comments, reviews, ban and punishment management.</li>
</ul></div></div></div></div></article></main></div></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{},"__N_SSG":true},"page":"/","query":{},"buildId":"hGxFvn14uX4yXmyuUr3H9","isFallback":false,"gsp":true,"scriptLoader":[]}</script><script defer="" src="https://static.cloudflareinsights.com/beacon.min.js/vcd15cbe7772f49c399c6a5babf22c1241717689176015" integrity="sha512-ZpsOmlRQV6y907TI0dKBHq9Md29nnaEIPlkf84rnaERnq6zvWvPUqr2ft8M1aS28oN72PdrCzSjY4U6VaAw1EQ==" data-cf-beacon="{"rayId":"8f298b511fff215f","version":"2024.10.5","r":1,"serverTiming":{"name":{"cfExtPri":true,"cfL4":true,"cfSpeedBrain":true,"cfCacheStatus":true}},"token":"27bd8fe4754b414f8e2c589978c9853e","b":1}" crossorigin="anonymous"></script>
<next-route-announcer><p aria-live="assertive" id="__next-route-announcer__" role="alert" style="border: 0px; clip: rect(0px, 0px, 0px, 0px); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap; overflow-wrap: normal;"></p></next-route-announcer></body></html>