2024-04-02 10:29:00 +02:00
<!doctype html>
< html
itemscope
class=""
lang="en-us"
itemtype="http://schema.org/WebPage"
>
< head > < script src = "/livereload.js?mindelay=10&v=2&port=1313&path=livereload" data-no-instant defer > < / script >
< meta charset = "utf-8" / >
< meta
name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=5"
/>
< meta name = "theme-name" content = "hugoplate" / >
< link rel = "shortcut icon" href = "/images/favicon_hudf4905de8b22f1b316f0f9113e9f1079_22623_96x0_resize_lanczos_3.png" type = "image/x-icon" >
< link rel = "icon" href = "/images/favicon_hudf4905de8b22f1b316f0f9113e9f1079_22623_96x0_resize_lanczos_3.png" type = "image/x-icon" >
< link rel = "icon" type = "image/png" sizes = "48x48" href = "/images/favicon_hudf4905de8b22f1b316f0f9113e9f1079_22623_48x0_resize_lanczos_3.png" >
< link rel = "icon" type = "image/png" sizes = "96x96" href = "/images/favicon_hudf4905de8b22f1b316f0f9113e9f1079_22623_96x0_resize_lanczos_3.png" >
< link rel = "apple-touch-icon" sizes = "144x144" href = "/images/favicon_hudf4905de8b22f1b316f0f9113e9f1079_22623_144x0_resize_lanczos_3.png" >
< link rel = "manifest" href = "/manifest.webmanifest" / >
< meta
name="msapplication-TileColor"
content="#ddd" />
< meta
name="theme-color"
content="#ffffff" />
< base href = "//localhost:1313/blog/post-1/" / >
< title > How to build an Application with modern Technology< / title >
< meta
name="keywords"
content="Boilerplate, Hugo" />
< meta
name="description"
content="this is meta description" />
< meta name = "author" content = "zeon.studio" / >
< meta property = "og:image" content = "//localhost:1313/images/image-placeholder.png" / >
< meta name = "twitter:image" content = "//localhost:1313/images/image-placeholder.png" / >
< meta
name="twitter:card"
content="summary
_large_image
" />
< meta property = "og:image:width" content = "1096" / >
< meta property = "og:image:height" content = "480" / >
< meta
property="og:image:type"
content="image/
.png
" />
< meta property = "og:title" content = "How to build an Application with modern Technology" / >
< meta property = "og:description" content = "this is meta description" / >
< meta property = "og:type" content = "website" / >
< meta property = "og:url" content = "//localhost:1313/blog/post-1/" / >
< meta name = "twitter:title" content = "How to build an Application with modern Technology" / >
< meta name = "twitter:description" content = "this is meta description" / >
< script >
let indexURL = "//localhost:1313/searchindex.json";
let includeSectionsInSearch = ["blog"];
let no_results_for = "No results for";
let empty_search_results_placeholder = "Type something to search..";
< / script >
< meta http-equiv = "x-dns-prefetch-control" content = "on" / >
< link rel = "preconnect" href = "https://use.fontawesome.com" crossorigin / >
< link rel = "preconnect" href = "//cdnjs.cloudflare.com" / >
< link rel = "preconnect" href = "//www.googletagmanager.com" / >
< link rel = "preconnect" href = "//www.google-analytics.com" / >
< link rel = "dns-prefetch" href = "https://use.fontawesome.com" / >
< link rel = "dns-prefetch" href = "//ajax.googleapis.com" / >
< link rel = "dns-prefetch" href = "//cdnjs.cloudflare.com" / >
< link rel = "dns-prefetch" href = "//www.googletagmanager.com" / >
< link rel = "dns-prefetch" href = "//www.google-analytics.com" / >
< link rel = "dns-prefetch" href = "//fonts.googleapis.com" / >
< link rel = "dns-prefetch" href = "//connect.facebook.net" / >
< link rel = "dns-prefetch" href = "//platform.linkedin.com" / >
< link rel = "dns-prefetch" href = "//platform.twitter.com" / >
< link rel = "preconnect" href = "https://fonts.googleapis.com" / >
< link rel = "preconnect" href = "https://fonts.gstatic.com" crossorigin / >
< script >
(function () {
const googleFont = document.createElement("link");
googleFont.href =
"https://fonts.googleapis.com/css2?family=Heebo:wght@400;600&family=Signika:wght@500; 700&display=swap";
googleFont.type = "text/css";
googleFont.rel = "stylesheet";
document.head.appendChild(googleFont);
})();
< / script >
< link
href="/css/style.css"
integrity=""
rel="stylesheet"
/>
< link
defer
async
rel="stylesheet"
href="/css/style-lazy.css"
integrity=""
media="print"
onload="this.media='all'; this.onload=null;"
/>
< / head >
< body >
< div
class="fixed left-0 top-0 z-50 flex w-[30px] items-center justify-center bg-gray-200 py-[2.5px] text-[12px] uppercase text-black sm:bg-red-200 md:bg-yellow-200 lg:bg-green-200 xl:bg-blue-200 2xl:bg-pink-200"
>
< span class = "block sm:hidden" > all< / span >
< span class = "hidden sm:block md:hidden" > sm< / span >
< span class = "hidden md:block lg:hidden" > md< / span >
< span class = "hidden lg:block xl:hidden" > lg< / span >
< span class = "hidden xl:block 2xl:hidden" > xl< / span >
< span class = "hidden 2xl:block" > 2xl< / span >
< / div >
< header
class="header sticky top-0 z-30"
>
< nav class = "navbar container" >
< div class = "order-0" >
< a class = "navbar-brand block" href = "/" >
< img
fetchpriority="high"
decoding="async"
class="img logo-light"
width="160"
height="32"
src="/images/logo_hu3e1f0f6bc04cc0e54cd69f08cd041995_19726_320x0_resize_q80_h2_lanczos_3.webp"
alt="Hugoplate"
onerror="this.onerror=null;this.src='\/images\/logo_hu3e1f0f6bc04cc0e54cd69f08cd041995_19726_320x0_resize_lanczos_3.png';" />
< img
fetchpriority="high"
decoding="async"
class="img logo-dark"
width="160"
height="32"
src="/images/logo-darkmode_hu3e1f0f6bc04cc0e54cd69f08cd041995_19726_320x0_resize_q80_h2_lanczos_3.webp"
alt="Hugoplate"
onerror="this.onerror=null;this.src='\/images\/logo-darkmode_hu3e1f0f6bc04cc0e54cd69f08cd041995_19726_320x0_resize_lanczos_3.png';" />
< / a >
< / div >
< input id = "nav-toggle" type = "checkbox" class = "hidden" / >
< label
for="nav-toggle"
class="order-3 cursor-pointer flex items-center lg:hidden text-dark lg:order-1"
>
< svg id = "show-button" class = "h-6 fill-current block" viewBox = "0 0 20 20" >
< title > Menu Open< / title >
< path d = "M0 3h20v2H0V3z m0 6h20v2H0V9z m0 6h20v2H0V0z" > < / path >
< / svg >
< svg id = "hide-button" class = "h-6 fill-current hidden" viewBox = "0 0 20 20" >
< title > Menu Close< / title >
< polygon
points="11 9 22 9 22 11 11 11 11 22 9 22 9 11 -2 11 -2 9 9 9 9 -2 11 -2"
transform="rotate(45 10 10)"
>< / polygon >
< / svg >
< / label >
< ul
id="nav-menu"
class="navbar-nav order-3 hidden lg:flex w-full pb-6 lg:order-1 lg:w-auto lg:space-x-2 lg:pb-0 xl:space-x-8"
>
< li class = "nav-item nav-dropdown group relative" >
< span
class="nav-link
inline-flex items-center"
>
For You
< svg class = "h-4 w-4 fill-current" viewBox = "0 0 20 20" >
< path
d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"
/>
< / svg >
< / span >
< ul
class="nav-dropdown-list lg:group-hover:visible lg:group-hover:opacity-100"
>
< li class = "nav-dropdown-item" >
< a
class="nav-dropdown-link "
href="/developers/"
>
Developers
< / a >
< / li >
< li class = "nav-dropdown-item" >
< a
class="nav-dropdown-link "
href="/ec/"
>
European Commission
< / a >
< / li >
< li class = "nav-dropdown-item" >
< a
class="nav-dropdown-link "
href="/individuals/"
>
Individuals
< / a >
< / li >
< / ul >
< / li >
< li class = "nav-item nav-dropdown group relative" >
< span
class="nav-link
inline-flex items-center"
>
Consortium
< svg class = "h-4 w-4 fill-current" viewBox = "0 0 20 20" >
< path
d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"
/>
< / svg >
< / span >
< ul
class="nav-dropdown-list lg:group-hover:visible lg:group-hover:opacity-100"
>
< li class = "nav-dropdown-item" >
< a
class="nav-dropdown-link "
href="/nlnet/"
>
NLnet
< / a >
< / li >
< li class = "nav-dropdown-item" >
< a
class="nav-dropdown-link "
href="/nordunet/"
>
NORDUnet
< / a >
< / li >
< li class = "nav-dropdown-item" >
< a
class="nav-dropdown-link "
href="/oid/"
>
Open Internet Discourse
< / a >
< / li >
< li class = "nav-dropdown-item" >
< a
class="nav-dropdown-link "
href="/tweag/"
>
Tweag
< / a >
< / li >
< / ul >
< / li >
< li class = "nav-item" >
< a
class="nav-link "
href="/fediversity/"
>Fediversity< /a
>
< / li >
< li class = "nav-item" >
< a
class="nav-link "
href="/grants/"
>Grants< /a
>
< / li >
< li class = "nav-item" >
< a
class="nav-link "
href="/"
>Events< /a
>
< / li >
< li class = "nav-item" >
< a
class="nav-link "
2024-04-02 14:55:53 +02:00
href="/blog/"
2024-04-02 10:29:00 +02:00
>News< /a
>
< / li >
< li class = "mt-4 inline-block lg:hidden" >
< a
class="btn btn-outline-primary btn-sm"
href="/contact"
>
Contact
< / a >
< / li >
< / ul >
< div class = "order-1 ml-auto flex items-center md:order-2 lg:ml-0" >
< button
aria-label="search"
class="border-border text-dark hover:text-primary mr-5 inline-block border-r pr-5 text-xl"
data-target="search-modal"
>
< i class = "fa-solid fa-search" > < / i >
< / button >
< div class = "theme-switcher mr-5" >
< input id = "theme-switcher" data-theme-switcher type = "checkbox" / >
< label for = "theme-switcher" >
< span class = "sr-only" > theme switcher< / span >
< span >
< svg
class="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 z-10 opacity-100"
viewBox="0 0 56 56"
fill="#fff"
height="16"
width="16"
>
< path
d="M30 4.6c0-1-.9-2-2-2a2 2 0 0 0-2 2v5c0 1 .9 2 2 2s2-1 2-2Zm9.6 9a2 2 0 0 0 0 2.8c.8.8 2 .8 2.9 0L46 13a2 2 0 0 0 0-2.9 2 2 0 0 0-3 0Zm-26 2.8c.7.8 2 .8 2.8 0 .8-.7.8-2 0-2.9L13 10c-.7-.7-2-.8-2.9 0-.7.8-.7 2.1 0 3ZM28 16a12 12 0 0 0-12 12 12 12 0 0 0 12 12 12 12 0 0 0 12-12 12 12 0 0 0-12-12Zm23.3 14c1.1 0 2-.9 2-2s-.9-2-2-2h-4.9a2 2 0 0 0-2 2c0 1.1 1 2 2 2ZM4.7 26a2 2 0 0 0-2 2c0 1.1.9 2 2 2h4.9c1 0 2-.9 2-2s-1-2-2-2Zm37.8 13.6a2 2 0 0 0-3 0 2 2 0 0 0 0 2.9l3.6 3.5a2 2 0 0 0 2.9 0c.8-.8.8-2.1 0-3ZM10 43.1a2 2 0 0 0 0 2.9c.8.7 2.1.8 3 0l3.4-3.5c.8-.8.8-2.1 0-2.9-.8-.8-2-.8-2.9 0Zm20 3.4c0-1.1-.9-2-2-2a2 2 0 0 0-2 2v4.9c0 1 .9 2 2 2s2-1 2-2Z"
/>
< / svg >
< svg
class="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 z-10 opacity-0"
viewBox="0 0 24 24"
fill="none"
height="16"
width="16"
>
< path
fill="#000"
fill-rule="evenodd"
clip-rule="evenodd"
d="M8.2 2.2c1-.4 2 .6 1.6 1.5-1 3-.4 6.4 1.8 8.7a8.4 8.4 0 0 0 8.7 1.8c1-.3 2 .5 1.5 1.5v.1a10.3 10.3 0 0 1-9.4 6.2A10.3 10.3 0 0 1 3.2 6.7c1-2 2.9-3.5 4.9-4.4Z"
/>
< / svg >
< / span >
< / label >
< / div >
< script >
var darkMode = false;
if (window.matchMedia("(prefers-color-scheme: dark)").matches){darkMode = true}
if (localStorage.getItem("theme") === "dark"){darkMode = true}
else if (localStorage.getItem("theme") === "light"){darkMode = false}
if (darkMode){document.documentElement.classList.toggle("dark")}
var themeSwitch = document.querySelectorAll("[data-theme-switcher]");
document.addEventListener("DOMContentLoaded", () => {
[].forEach.call(themeSwitch, function (ts) {
ts.checked = darkMode ? true : false;
ts.addEventListener("click", () => {
document.documentElement.classList.toggle("dark");
localStorage.setItem(
"theme",
document.documentElement.classList.contains("dark") ? "dark" : "light"
);
});
});
});
< / script >
< a
href="/contact"
class="btn btn-outline-primary btn-sm hidden lg:inline-block"
>
Contact
< / a >
< / div >
< / nav >
< / header >
< div
class="search-modal "
aria-hidden="true"
style="--color-primary: #121212">
< div data-target = "close-search-modal" class = "search-modal-overlay" > < / div >
< div
class="search-wrapper"
data-image="true"
data-description="true"
data-tags="true"
data-categories="true">
< div class = "search-wrapper-header" >
< label for = "search-modal-input" style = "margin-top:-1px" >
< span class = "sr-only" > search icon< / span >
< svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 512 512"
height="18"
width="18"
class="search-icon"
data-type="search">
< path
fill="currentColor"
d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z" />
< / svg >
< svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 512 512"
height="18"
width="18"
class="search-reset"
data-type="reset">
< path
fill="currentColor"
d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM175 175c9.4-9.4 24.6-9.4 33.9 0l47 47 47-47c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9l-47 47 47 47c9.4 9.4 9.4 24.6 0 33.9s-24.6 9.4-33.9 0l-47-47-47 47c-9.4 9.4-24.6 9.4-33.9 0s-9.4-24.6 0-33.9l47-47-47-47c-9.4-9.4-9.4-24.6 0-33.9z" />
< / svg >
< / label >
< input
id="search-modal-input"
type="text"
data-search-input
autocomplete="off"
aria-label="Search"
placeholder="Search Post ..." />
< / div >
< div class = "search-wrapper-body" >
< div class = "search-result" data-search-result > < / div >
< span class = "search-result-empty" >
Type something to search..
< / span >
< / div >
< div class = "search-wrapper-footer" >
< span >
< kbd >
< svg
xmlns="http://www.w3.org/2000/svg"
width="14"
height="14"
fill="currentColor"
viewBox="0 0 16 16">
< path
d="M3.204 11h9.592L8 5.519 3.204 11zm-.753-.659 4.796-5.48a1 1 0 0 1 1.506 0l4.796 5.48c.566.647.106 1.659-.753 1.659H3.204a1 1 0 0 1-.753-1.659z" />
< / svg >
< / kbd >
< kbd >
< svg
xmlns="http://www.w3.org/2000/svg"
width="14"
height="14"
fill="currentColor"
style="margin-top:1px;"
viewBox="0 0 16 16">
< path
d="M3.204 5h9.592L8 10.481 3.204 5zm-.753.659 4.796 5.48a1 1 0 0 0 1.506 0l4.796-5.48c.566-.647.106-1.659-.753-1.659H3.204a1 1 0 0 0-.753 1.659z" />
< / svg >
< / kbd >
to navigate
< / span >
< span >
< kbd >
< svg
xmlns="http://www.w3.org/2000/svg"
width="12"
height="12"
fill="currentColor"
style="display:inline-block;"
viewBox="0 0 16 16">
< path
fill-rule="evenodd"
d="M14.5 1.5a.5.5 0 0 1 .5.5v4.8a2.5 2.5 0 0 1-2.5 2.5H2.707l3.347 3.346a.5.5 0 0 1-.708.708l-4.2-4.2a.5.5 0 0 1 0-.708l4-4a.5.5 0 1 1 .708.708L2.707 8.3H12.5A1.5 1.5 0 0 0 14 6.8V2a.5.5 0 0 1 .5-.5z" />
< / svg >
< / kbd >
to select
< / span >
< span class = "search-result-info" > < / span >
< span data-target = "close-search-modal" >
< kbd > ESC< / kbd > to close
< / span >
< / div >
< / div >
< / div >
< main >
< section class = "section pt-7" >
< div class = "container" >
< div class = "row justify-center" >
< article class = "lg:col-10" >
< div class = "mb-10" >
< picture >
< source
srcset="/images/image-placeholder_huf5f2d24635a285cfc2259aa9741acb2a_4881_545x0_resize_q80_h2_lanczos_3.webp"
media="(max-width: 575px)" />
< source
srcset="/images/image-placeholder_huf5f2d24635a285cfc2259aa9741acb2a_4881_600x0_resize_q80_h2_lanczos_3.webp"
media="(max-width: 767px)" />
< source
srcset="/images/image-placeholder_huf5f2d24635a285cfc2259aa9741acb2a_4881_700x0_resize_q80_h2_lanczos_3.webp"
media="(max-width: 991px)" />
< source
srcset="/images/image-placeholder_huf5f2d24635a285cfc2259aa9741acb2a_4881_1110x0_resize_q80_h2_lanczos_3.webp"
/>
< img
loading="lazy" decoding="async"
src="/images/image-placeholder_huf5f2d24635a285cfc2259aa9741acb2a_4881_1110x0_resize_lanczos_3.png"
class=" w-full rounded img"
alt="How to build an Application with modern Technology"
width="1096"
height="480" />
< / picture >
< / div >
< h1 class = "h2 mb-4" > How to build an Application with modern Technology< / h1 >
< ul class = "mb-4" >
< li class = "mr-4 inline-block" >
< a
href="/authors/john-doe/"
>
< i class = "fa-regular fa-circle-user mr-2" > < / i > John Doe
< / a >
< / li >
< li class = "mr-4 inline-block" >
< i class = "fa-regular fa-folder mr-2" > < / i >
< a
href="/categories/application/"
class=""
>Application ,
< / a >
< a
href="/categories/data/"
class=""
>Data
< / a >
< / li >
< li class = "mr-4 inline-block" >
< i class = "fa-regular fa-clock mr-2" > < / i >
April 4, 2022
< / li >
< / ul >
< div class = "content mb-10" > < p > Nemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.< / p >
< p > Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!< / p >
< h2 id = "creative-design" > Creative Design< / h2 >
< p > Nam ut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.< / p >
< blockquote >
< p > Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!< / p >
< / blockquote >
< p > Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo vel ad consectetur ut aperiam. Itaque eligendi natus aperiam? Excepturi repellendus consequatur quibusdam optio expedita praesentium est adipisci dolorem ut eius!< / p >
< / div >
< div class = "row items-start justify-between" >
< div class = "lg:col-5 mb-10 flex items-center lg:mb-0" >
< h5 class = "mr-3" > Tags :< / h5 >
< ul >
< li class = "inline-block" >
< a
class="bg-theme-light hover:bg-primary m-1 block rounded px-3 py-1 hover:text-white"
href="/tags/nextjs/"
>
Nextjs
< / a >
< / li >
< li class = "inline-block" >
< a
class="bg-theme-light hover:bg-primary m-1 block rounded px-3 py-1 hover:text-white"
href="/tags/tailwind/"
>
Tailwind
< / a >
< / li >
< / ul >
< / div >
< div class = "lg:col-4 flex items-center" >
< div class = "share-icons" >
< h5 class = "share-title" > Share :< / h5 >
< a
class="share-link share-facebook"
href="https://facebook.com/sharer/sharer.php?u=%2f%2flocalhost%3a1313%2fblog%2fpost-1%2f"
target="_blank"
rel="noopener"
aria-label="share facebook">
< span class = "share-icon" >
< svg xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 24 24" >
< path
d="M18.77 7.46H14.5v-1.9c0-.9.6-1.1 1-1.1h3V.5h-4.33C10.24.5 9.5 3.44 9.5 5.32v2.15h-3v4h3v12h5v-12h3.85l.42-4z" />
< / svg >
< / span >
< / a >
< a
class="share-link share-twitter"
href="https://twitter.com/intent/tweet/?text=Share& url=%2f%2flocalhost%3a1313%2fblog%2fpost-1%2f"
target="_blank"
rel="noopener"
aria-label="share twitter">
< span aria-hidden = "true" class = "share-icon" >
< svg xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 24 24" >
< path
d="M8 2H1l8.26 11.015L1.45 22H4.1l6.388-7.349L16 22h7l-8.608-11.478L21.8 2h-2.65l-5.986 6.886zm9 18L5 4h2l12 16z"/>
< / svg >
< / span >
< / a >
< a
class="share-link share-email"
href="mailto:?subject=Share& body=%2f%2flocalhost%3a1313%2fblog%2fpost-1%2f"
target="_self"
rel="noopener"
aria-label="share email">
< span aria-hidden = "true" class = "share-icon" >
< svg xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 24 24" >
< path
d="M22 4H2C.9 4 0 4.9 0 6v12c0 1.1.9 2 2 2h20c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zM7.25 14.43l-3.5 2c-.08.05-.17.07-.25.07-.17 0-.34-.1-.43-.25-.14-.24-.06-.55.18-.68l3.5-2c.24-.14.55-.06.68.18.14.24.06.55-.18.68zm4.75.07c-.1 0-.2-.03-.27-.08l-8.5-5.5c-.23-.15-.3-.46-.15-.7.15-.22.46-.3.7-.14L12 13.4l8.23-5.32c.23-.15.54-.08.7.15.14.23.07.54-.16.7l-8.5 5.5c-.08.04-.17.07-.27.07zm8.93 1.75c-.1.16-.26.25-.43.25-.08 0-.17-.02-.25-.07l-3.5-2c-.24-.13-.32-.44-.18-.68s.44-.32.68-.18l3.5 2c.24.13.32.44.18.68z" />
< / svg >
< / span >
< / a >
< a
class="share-link share-reddit"
href="https://reddit.com/submit/?url=%2f%2flocalhost%3a1313%2fblog%2fpost-1%2f& resubmit=true& title=Share"
target="_blank"
rel="noopener"
aria-label="share reddit">
< span aria-hidden = "true" class = "share-icon" >
< svg xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 24 24" >
< path
d="M24 11.5c0-1.65-1.35-3-3-3-.96 0-1.86.48-2.42 1.24-1.64-1-3.75-1.64-6.07-1.72.08-1.1.4-3.05 1.52-3.7.72-.4 1.73-.24 3 .5C17.2 6.3 18.46 7.5 20 7.5c1.65 0 3-1.35 3-3s-1.35-3-3-3c-1.38 0-2.54.94-2.88 2.22-1.43-.72-2.64-.8-3.6-.25-1.64.94-1.95 3.47-2 4.55-2.33.08-4.45.7-6.1 1.72C4.86 8.98 3.96 8.5 3 8.5c-1.65 0-3 1.35-3 3 0 1.32.84 2.44 2.05 2.84-.03.22-.05.44-.05.66 0 3.86 4.5 7 10 7s10-3.14 10-7c0-.22-.02-.44-.05-.66 1.2-.4 2.05-1.54 2.05-2.84zM2.3 13.37C1.5 13.07 1 12.35 1 11.5c0-1.1.9-2 2-2 .64 0 1.22.32 1.6.82-1.1.85-1.92 1.9-2.3 3.05zm3.7.13c0-1.1.9-2 2-2s2 .9 2 2-.9 2-2 2-2-.9-2-2zm9.8 4.8c-1.08.63-2.42.96-3.8.96-1.4 0-2.74-.34-3.8-.95-.24-.13-.32-.44-.2-.68.15-.24.46-.32.7-.18 1.83 1.06 4.76 1.06 6.6 0 .23-.13.53-.05.67.2.14.23.06.54-.18.67zm.2-2.8c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm5.7-2.13c-.38-1.16-1.2-2.2-2.3-3.05.38-.5.97-.82 1.6-.82 1.1 0 2 .9 2 2 0 .84-.53 1.57-1.3 1.87z" />
< / svg >
< / span >
< / a >
< / div >
< / div >
< / div >
< div class = "mt-20" > < div id = "disqus_thread" > < / div >
< script >
window.disqus_config = function () {
};
(function() {
if (["localhost", "127.0.0.1"].indexOf(window.location.hostname) != -1) {
document.getElementById('disqus_thread').innerHTML = 'Disqus comments not available by default when the website is previewed locally.';
return;
}
var d = document, s = d.createElement('script'); s.async = true;
s.src = '//' + "themefisher-template" + '.disqus.com/embed.js';
s.setAttribute('data-timestamp', +new Date());
(d.head || d.body).appendChild(s);
})();
< / script >
< noscript > Please enable JavaScript to view the < a href = "https://disqus.com/?ref_noscript" > comments powered by Disqus.< / a > < / noscript >
< a href = "https://disqus.com" class = "dsq-brlink" > comments powered by < span class = "logo-disqus" > Disqus< / span > < / a > < / div >
< / article >
< / div >
< / div >
< / section >
< / main >
< footer class = "bg-theme-light" >
< div class = "container" >
< div class = "row items-center py-10" >
< div class = "lg:col-3 mb-8 text-center lg:mb-0 lg:text-left" >
< a
class="navbar-brand inline-block"
href="/"
>
< img
fetchpriority="high"
decoding="async"
class="img logo-light"
width="160"
height="32"
src="/images/logo_hu3e1f0f6bc04cc0e54cd69f08cd041995_19726_320x0_resize_q80_h2_lanczos_3.webp"
alt="Hugoplate"
onerror="this.onerror=null;this.src='\/images\/logo_hu3e1f0f6bc04cc0e54cd69f08cd041995_19726_320x0_resize_lanczos_3.png';" />
< img
fetchpriority="high"
decoding="async"
class="img logo-dark"
width="160"
height="32"
src="/images/logo-darkmode_hu3e1f0f6bc04cc0e54cd69f08cd041995_19726_320x0_resize_q80_h2_lanczos_3.webp"
alt="Hugoplate"
onerror="this.onerror=null;this.src='\/images\/logo-darkmode_hu3e1f0f6bc04cc0e54cd69f08cd041995_19726_320x0_resize_lanczos_3.png';" />
< / a >
< / div >
< div class = "lg:col-6 mb-8 text-center lg:mb-0" >
< ul >
< li class = "m-3 inline-block" >
< a
href="
/about/
"
>About< /a
>
< / li >
< li class = "m-3 inline-block" >
< a
href="
/elements/
"
>Elements< /a
>
< / li >
< li class = "m-3 inline-block" >
< a
href="
/privacy-policy/
"
>Privacy Policy< /a
>
< / li >
< / ul >
< / div >
< div class = "lg:col-3 mb-8 text-center lg:mb-0 lg:mt-0 lg:text-right" >
< ul class = "social-icons" >
< li >
< a
target="_blank"
aria-label="facebook"
rel="nofollow noopener"
href="https://www.facebook.com/"
>
< i class = "fab fa-facebook" > < / i >
< / a >
< / li >
< li >
< a
target="_blank"
aria-label="twitter"
rel="nofollow noopener"
href="https://twitter.com/"
>
< i class = "fab fa-twitter" > < / i >
< / a >
< / li >
< li >
< a
target="_blank"
aria-label="github"
rel="nofollow noopener"
href="https://www.github.com/"
>
< i class = "fab fa-github" > < / i >
< / a >
< / li >
< li >
< a
target="_blank"
aria-label="linkedin"
rel="nofollow noopener"
href="https://www.linkedin.com/"
>
< i class = "fab fa-linkedin" > < / i >
< / a >
< / li >
< / ul >
< / div >
< / div >
< / div >
< div class = "border-border border-t py-7" >
< div class = "text-light container text-center" >
< p > Designed & Developed by < a href = "https://zeon.studio"
target="_blank"
>Zeon Studio< / a > < / p >
< / div >
< / div >
< / footer >
< script
crossorigin="anonymous"
integrity=""
src="/js/script.js"
>< / script >
< script
defer
async
crossorigin="anonymous"
integrity=""
src="/js/script-lazy.js"
>< / script >
< script >
if ('serviceWorker' in navigator){navigator.serviceWorker.register("/service-worker.js");}
< / script >
< / body >
< / html >
