563 lines
19 KiB
HTML
563 lines
19 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" data-astro-cid-sckkx6r4>
|
|
<head>
|
|
<title>Ayo Ayco | Software Engineer, Web Developer, Consultant</title>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width" />
|
|
<meta name="generator" content="Astro v4.5.9" />
|
|
<meta name="theme-color" content="#3054bf" />
|
|
<meta
|
|
name="description"
|
|
content="Professional software engineer specializing in web development with a decade of experience building web applications for both private businesses and government-funded high-impact projects utilizing web technologies, IoT, data viz/insights, remote sensing, and GIS"
|
|
/>
|
|
<meta name="author" content="Ayo Ayco" />
|
|
<meta name="origin" content="https://ayo.ayco.io/" />
|
|
<!-- Open Graph data -->
|
|
<meta property="og:site_name" content="Ayo Ayco" />
|
|
<meta property="og:type" content="website" />
|
|
<meta property="og:url" content="https://ayo.ayco.io/" />
|
|
<meta
|
|
property="og:title"
|
|
content="Ayo Ayco | Software Engineer, Web Developer, Consultant"
|
|
/>
|
|
<meta
|
|
property="og:description"
|
|
content="Professional software engineer specializing in web development with a decade of experience building web applications for both private businesses and government-funded high-impact projects utilizing web technologies, IoT, data viz/insights, remote sensing, and GIS"
|
|
/>
|
|
<meta property="og:image" content="/ayo.png" />
|
|
<link rel="me" href="https://ayos.blog" />
|
|
<link rel="me" href="https://social.ayco.io/@ayo" />
|
|
<link rel="me" href="https://metapixl.com/@ayo" />
|
|
<link rel="me" href="https://theres.life/@ayo" />
|
|
<link rel="shortcut icon" type="image/png" href="static/favicon.ico" />
|
|
<style>
|
|
*,
|
|
*:before,
|
|
*:after {
|
|
box-sizing: border-box;
|
|
}
|
|
* {
|
|
margin: 0;
|
|
}
|
|
html,
|
|
body {
|
|
height: 100%;
|
|
background: #fff;
|
|
}
|
|
body {
|
|
line-height: 1.5;
|
|
letter-spacing: 0.25px;
|
|
-webkit-font-smoothing: antialiased;
|
|
}
|
|
img,
|
|
picture,
|
|
video,
|
|
canvas,
|
|
svg,
|
|
iframe {
|
|
display: block;
|
|
max-width: 100%;
|
|
margin: 0 auto;
|
|
}
|
|
input,
|
|
button,
|
|
textarea,
|
|
select {
|
|
font: inherit;
|
|
}
|
|
p,
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6 {
|
|
overflow-wrap: break-word;
|
|
}
|
|
#root,
|
|
#__next {
|
|
isolation: isolate;
|
|
}
|
|
nav[data-astro-cid-dmqpwcec] {
|
|
background: var(--ayo-gradient);
|
|
display: flex;
|
|
margin: 0 auto;
|
|
}
|
|
nav[data-astro-cid-dmqpwcec] a[data-astro-cid-dmqpwcec] {
|
|
display: inline-block;
|
|
text-decoration: underline;
|
|
color: var(--text-color-light);
|
|
padding: 0.5em 1em;
|
|
font-size: var(--font-size-sm);
|
|
}
|
|
nav[data-astro-cid-dmqpwcec] a[data-astro-cid-dmqpwcec]:hover {
|
|
color: var(--color-brand-complement);
|
|
}
|
|
nav[data-astro-cid-dmqpwcec]
|
|
a[data-astro-cid-dmqpwcec]
|
|
svg[data-astro-cid-dmqpwcec] {
|
|
width: 1.5rem;
|
|
}
|
|
#wrapper[data-astro-cid-dmqpwcec] {
|
|
flex: 1;
|
|
max-width: var(--content-width);
|
|
margin: 0 auto;
|
|
text-align: right;
|
|
}
|
|
@media only screen and (max-device-width: 360px) {
|
|
#wrapper[data-astro-cid-dmqpwcec] {
|
|
text-align: center;
|
|
}
|
|
nav[data-astro-cid-dmqpwcec] a[data-astro-cid-dmqpwcec] {
|
|
padding: 0.5em;
|
|
}
|
|
}
|
|
main {
|
|
margin: auto;
|
|
max-width: var(--content-width);
|
|
padding: 1em;
|
|
}
|
|
h1 {
|
|
font-size: var(--font-size-xl);
|
|
}
|
|
h2 {
|
|
font-size: var(--font-size-lg);
|
|
}
|
|
code {
|
|
font-family: Menlo, Monaco, Lucida Console, Liberation Mono,
|
|
DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace;
|
|
}
|
|
p,
|
|
img,
|
|
table,
|
|
ul {
|
|
margin: 1em 0;
|
|
font-size: var(--font-size-base);
|
|
}
|
|
.text-gradient {
|
|
font-weight: 900;
|
|
background-image: var(--ayo-gradient);
|
|
animation: pulse 4s ease-in-out infinite;
|
|
background-size: 500% 500%;
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
background-size: 100% 200%;
|
|
background-position-y: 100%;
|
|
border-radius: 0.4rem;
|
|
}
|
|
a {
|
|
font-weight: 700;
|
|
}
|
|
@media (prefers-color-scheme: dark) {
|
|
a {
|
|
color: var(--color-brand-complement);
|
|
}
|
|
}
|
|
:root {
|
|
--content-width: 700px;
|
|
--font-size-sm: clamp(0.75rem, 0.2vw + 0.66rem, 0.8rem);
|
|
--font-size-base: clamp(1rem, 0.34vw + 0.91rem, 1.19rem);
|
|
--font-size-lg: clamp(1.2rem, 0.7vw + 1.2rem, 1.5rem);
|
|
--font-size-xl: clamp(2.44rem, 2.38vw + 1.85rem, 3.75rem);
|
|
--color-border: hsl(17, 24%, 90%);
|
|
--color-link: var(--color-brand-blue-3);
|
|
--color-brand-blue-1: #3054bf;
|
|
--color-brand-blue-2: #203880;
|
|
--color-brand-blue-3: #416fff;
|
|
--color-brand-blue-4: #101c40;
|
|
--color-brand-blue-5: #3964e6;
|
|
--color-brand-complement: orange;
|
|
--ayo-gradient: linear-gradient(45deg, #3054bf, #416fff);
|
|
--text-color-dark: black;
|
|
--text-color-light: #f8f9fa;
|
|
--bg-dark: #343a40;
|
|
--bg-darker: #212529;
|
|
--bg-darkest: #000;
|
|
}
|
|
html,
|
|
body,
|
|
[data-astro-cid-sckkx6r4] {
|
|
font-family: system-ui, sans-serif;
|
|
font-size: var(--font-size-base);
|
|
color: var(--text-color-dark);
|
|
background-color: var(--text-color-light);
|
|
}
|
|
@media (prefers-color-scheme: dark) {
|
|
html,
|
|
body,
|
|
[data-astro-cid-sckkx6r4] {
|
|
background: var(--bg-darker);
|
|
color: var(--text-color-light);
|
|
}
|
|
}
|
|
@keyframes pulse {
|
|
0%,
|
|
to {
|
|
background-position-y: 0%;
|
|
}
|
|
50% {
|
|
background-position-y: 80%;
|
|
}
|
|
}
|
|
footer[data-astro-cid-sz7xmlte] {
|
|
margin-top: 1em;
|
|
text-align: right;
|
|
}
|
|
footer[data-astro-cid-sz7xmlte] ul[data-astro-cid-sz7xmlte] {
|
|
font-size: var(--font-size-sm);
|
|
}
|
|
:root {
|
|
--link-gradient: linear-gradient(
|
|
45deg,
|
|
var(--color-brand-blue-1),
|
|
var(--color-brand-blue-3) 30%,
|
|
var(--color-border) 60%
|
|
);
|
|
}
|
|
.link-card[data-astro-cid-dohjnao5] {
|
|
list-style: none;
|
|
display: flex;
|
|
padding: 0.15rem;
|
|
background-size: 400%;
|
|
border-radius: 0.5rem;
|
|
background-position: 100%;
|
|
background-image: var(--link-gradient);
|
|
transition: background-position 0.6s cubic-bezier(0.22, 1, 0.36, 1);
|
|
}
|
|
.link-card[data-astro-cid-dohjnao5] > a[data-astro-cid-dohjnao5] {
|
|
width: 100%;
|
|
text-decoration: none;
|
|
padding: 1em 1.3em;
|
|
border-radius: 0.35rem;
|
|
background-color: #fff;
|
|
color: var(--text-color-dark);
|
|
}
|
|
h2[data-astro-cid-dohjnao5] {
|
|
margin: 0;
|
|
transition: color 0.6s cubic-bezier(0.22, 1, 0.36, 1);
|
|
}
|
|
p[data-astro-cid-dohjnao5] {
|
|
font-weight: 400;
|
|
margin-top: 0.75rem;
|
|
margin-bottom: 0;
|
|
}
|
|
h2[data-astro-cid-dohjnao5] span[data-astro-cid-dohjnao5] {
|
|
display: inline-block;
|
|
transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
|
|
}
|
|
.link-card[data-astro-cid-dohjnao5]:is(:hover, :focus-within) {
|
|
background-position: 0;
|
|
}
|
|
.link-card[data-astro-cid-dohjnao5]:is(:hover, :focus-within)
|
|
h2[data-astro-cid-dohjnao5]
|
|
span[data-astro-cid-dohjnao5] {
|
|
will-change: transform;
|
|
transform: translate(2px);
|
|
}
|
|
@media (prefers-color-scheme: dark) {
|
|
.link-card[data-astro-cid-dohjnao5] > a[data-astro-cid-dohjnao5] {
|
|
background-color: var(--bg-dark);
|
|
color: var(--text-color-light);
|
|
}
|
|
}
|
|
h1[data-astro-cid-j7pv25f6] {
|
|
margin: 0;
|
|
color: #ffffffbf;
|
|
}
|
|
h1[data-astro-cid-j7pv25f6] span[data-astro-cid-j7pv25f6].heavy-text {
|
|
font-weight: 900;
|
|
color: #fff;
|
|
}
|
|
main[data-astro-cid-j7pv25f6] {
|
|
max-width: 100% !important;
|
|
}
|
|
.now-wrapper[data-astro-cid-j7pv25f6] {
|
|
border: 1px solid rgba(255, 255, 255, 0.2);
|
|
border-radius: 40px;
|
|
padding: 8px 4px;
|
|
font-weight: 400;
|
|
color: #fff;
|
|
font-size: var(--font-size-sm);
|
|
text-decoration: none;
|
|
}
|
|
.now-label[data-astro-cid-j7pv25f6] {
|
|
border-radius: 40px;
|
|
background-color: #0009;
|
|
color: #fff;
|
|
padding: 4px 8px;
|
|
margin-right: 0.25em;
|
|
text-transform: uppercase;
|
|
font-weight: 700;
|
|
}
|
|
.status[data-astro-cid-j7pv25f6] {
|
|
padding-right: 4px;
|
|
}
|
|
.highlighted-section[data-astro-cid-j7pv25f6] {
|
|
background: var(--ayo-gradient);
|
|
background-size: 500% 500%;
|
|
animation: pulse 15s ease-in-out infinite;
|
|
border-bottom: 1px solid var(--color-brand-blue-1);
|
|
}
|
|
.highlighted-section__content[data-astro-cid-j7pv25f6] {
|
|
margin: auto;
|
|
padding: 1em 0;
|
|
max-width: var(--content-width);
|
|
font-weight: 400;
|
|
font-size: var(--font-size-lg);
|
|
color: var(--text-color-light);
|
|
}
|
|
.highlighted-section__content__profile-picture[data-astro-cid-j7pv25f6] {
|
|
float: right;
|
|
margin: 1em 1em 0 0;
|
|
border: 5px solid var(--color-brand-blue-1);
|
|
background-color: var(--color-brand-blue-1);
|
|
display: block;
|
|
border-radius: 50%;
|
|
width: 140px;
|
|
height: 140px;
|
|
}
|
|
.highlighted-section__content[data-astro-cid-j7pv25f6]
|
|
ul[data-astro-cid-j7pv25f6]
|
|
a[data-astro-cid-j7pv25f6] {
|
|
color: #fff;
|
|
font-weight: 400;
|
|
}
|
|
.highlighted-section__content[data-astro-cid-j7pv25f6]
|
|
ul[data-astro-cid-j7pv25f6] {
|
|
list-style-type: none;
|
|
padding: 0;
|
|
}
|
|
.highlighted-section__content[data-astro-cid-j7pv25f6]
|
|
ul[data-astro-cid-j7pv25f6]
|
|
li[data-astro-cid-j7pv25f6] {
|
|
padding: 5px 0;
|
|
}
|
|
.cards-section[data-astro-cid-j7pv25f6] {
|
|
margin: auto;
|
|
max-width: var(--content-width);
|
|
}
|
|
.cards-section__grid[data-astro-cid-j7pv25f6] {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(24ch, 1fr));
|
|
gap: 1rem;
|
|
padding: 0;
|
|
}
|
|
@media only screen and (max-device-width: 360px) {
|
|
.now-wrapper[data-astro-cid-j7pv25f6] {
|
|
border: 0px;
|
|
border-radius: 0;
|
|
font-size: var(--font-size-sm);
|
|
width: 100%;
|
|
display: -webkit-box;
|
|
-webkit-line-clamp: 1;
|
|
-webkit-box-orient: vertical;
|
|
overflow: hidden;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
.now-label[data-astro-cid-j7pv25f6] {
|
|
display: none;
|
|
}
|
|
.status[data-astro-cid-j7pv25f6]:before {
|
|
content: "Now: ";
|
|
}
|
|
.status[data-astro-cid-j7pv25f6] {
|
|
text-decoration: underline;
|
|
cursor: pointer;
|
|
}
|
|
.highlighted-section__content__profile-picture[data-astro-cid-j7pv25f6] {
|
|
float: none;
|
|
width: 100px;
|
|
height: 100px;
|
|
}
|
|
}
|
|
@media only screen and (min-device-width: 280px) and (max-device-width: 653px) {
|
|
.highlighted-section__content[data-astro-cid-j7pv25f6] {
|
|
padding: 1em;
|
|
}
|
|
.highlighted-section__content__profile-picture[data-astro-cid-j7pv25f6] {
|
|
float: none;
|
|
margin: 0;
|
|
width: 100px;
|
|
height: 100px;
|
|
}
|
|
.highlighted-section__content[data-astro-cid-j7pv25f6]
|
|
ul[data-astro-cid-j7pv25f6]
|
|
li[data-astro-cid-j7pv25f6] {
|
|
font-size: var(--font-size-sm);
|
|
}
|
|
}
|
|
@media only screen and (min-device-width: 360px) and (max-device-width: 812px) {
|
|
.highlighted-section__content[data-astro-cid-j7pv25f6] {
|
|
padding: 1em;
|
|
}
|
|
.highlighted-section__content[data-astro-cid-j7pv25f6]
|
|
ul[data-astro-cid-j7pv25f6]
|
|
li[data-astro-cid-j7pv25f6] {
|
|
font-size: var(--font-size-base);
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body data-astro-cid-sckkx6r4>
|
|
<nav data-astro-cid-dmqpwcec>
|
|
<div id="wrapper" data-astro-cid-dmqpwcec>
|
|
<a href="https://ayos.blog" data-astro-cid-dmqpwcec>
|
|
<svg
|
|
viewBox="0 0 24 24"
|
|
data-astro-cid-dmqpwcec
|
|
astro-icon="mdi:blog"
|
|
>
|
|
<path
|
|
fill="currentColor"
|
|
d="M3 3v18h18V3zm15 15H6v-1h12zm0-2H6v-1h12zm0-4H6V6h12z"
|
|
/>
|
|
</svg>
|
|
blog </a
|
|
><a href="https://ayco.io/@ayo" data-astro-cid-dmqpwcec>
|
|
<svg
|
|
viewBox="0 0 24 24"
|
|
data-astro-cid-dmqpwcec
|
|
astro-icon="mdi:mastodon"
|
|
>
|
|
<path
|
|
fill="currentColor"
|
|
d="M20.94 14c-.28 1.41-2.44 2.96-4.97 3.26-1.31.15-2.6.3-3.97.24-2.25-.11-4-.54-4-.54v.62c.32 2.22 2.22 2.35 4.03 2.42 1.82.05 3.44-.46 3.44-.46l.08 1.65s-1.28.68-3.55.81c-1.25.07-2.81-.03-4.62-.5-3.92-1.05-4.6-5.24-4.7-9.5l-.01-3.43c0-4.34 2.83-5.61 2.83-5.61C6.95 2.3 9.41 2 11.97 2h.06c2.56 0 5.02.3 6.47.96 0 0 2.83 1.27 2.83 5.61 0 0 .04 3.21-.39 5.43M18 8.91c0-1.08-.3-1.91-.85-2.56-.56-.63-1.3-.96-2.23-.96-1.06 0-1.87.41-2.42 1.23l-.5.88-.5-.88c-.56-.82-1.36-1.23-2.43-1.23-.92 0-1.66.33-2.23.96C6.29 7 6 7.83 6 8.91v5.26h2.1V9.06c0-1.06.45-1.62 1.36-1.62 1 0 1.5.65 1.5 1.93v2.79h2.07V9.37c0-1.28.5-1.93 1.51-1.93.9 0 1.35.56 1.35 1.62v5.11H18z"
|
|
/>
|
|
</svg>
|
|
social </a
|
|
><a href="https://metapixl.com/i/portfolio/ayo" data-astro-cid-dmqpwcec>
|
|
<svg
|
|
viewBox="0 0 24 24"
|
|
data-astro-cid-dmqpwcec
|
|
astro-icon="mdi:image"
|
|
>
|
|
<path
|
|
fill="currentColor"
|
|
d="m8.5 13.5 2.5 3 3.5-4.5 4.5 6H5m16 1V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2"
|
|
/>
|
|
</svg>
|
|
photos </a
|
|
><a href="https://www.npmjs.com/~aayco" data-astro-cid-dmqpwcec>
|
|
<svg viewBox="0 0 24 24" data-astro-cid-dmqpwcec astro-icon="gg:npm">
|
|
<path
|
|
fill="currentColor"
|
|
fill-rule="evenodd"
|
|
d="M5 21a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2zm1-3V6h12v12h-3V9h-3v9z"
|
|
clip-rule="evenodd"
|
|
/>
|
|
</svg>
|
|
npm
|
|
</a>
|
|
</div>
|
|
</nav>
|
|
<section class="highlighted-section" data-astro-cid-j7pv25f6>
|
|
<div class="highlighted-section__content" data-astro-cid-j7pv25f6>
|
|
<img
|
|
class="highlighted-section__content__profile-picture"
|
|
alt="Ayo Ayco's picture"
|
|
src="https://media.ayco.io/accounts/avatars/109/547/735/999/980/313/original/12bfe46c4e978562.jpeg"
|
|
width="140"
|
|
height="140"
|
|
data-astro-cid-j7pv25f6
|
|
/>
|
|
<div class="highlighted-section__content__text" data-astro-cid-j7pv25f6>
|
|
<h1
|
|
title="Ayo Ayco | Software Engineer + Web Developer"
|
|
data-astro-cid-j7pv25f6
|
|
>
|
|
<span class="heavy-text" data-astro-cid-j7pv25f6>Ayo</span>Ayco
|
|
</h1>
|
|
<ul data-astro-cid-j7pv25f6>
|
|
<li style="display: flex; gap: 0.25em" data-astro-cid-j7pv25f6>
|
|
<span class="icon" data-astro-cid-j7pv25f6>😱</span>
|
|
<span class="text" data-astro-cid-j7pv25f6>Building</span>
|
|
<a href="https://mcfly.js.org" data-astro-cid-j7pv25f6>McFly</a>
|
|
</li>
|
|
<li style="display: flex; gap: 0.25em" data-astro-cid-j7pv25f6>
|
|
<span class="icon" data-astro-cid-j7pv25f6>🧸</span>
|
|
<span class="text" data-astro-cid-j7pv25f6>Creator of</span>
|
|
<a href="https://ayco.io/gh/cozy#readme" data-astro-cid-j7pv25f6
|
|
>Cozy</a
|
|
>
|
|
</li>
|
|
<li style="display: flex; gap: 0.25em" data-astro-cid-j7pv25f6>
|
|
<span class="icon" data-astro-cid-j7pv25f6>🧱</span>
|
|
<span class="text" data-astro-cid-j7pv25f6>Creator of</span>
|
|
<a href="https://webcomponent.io" data-astro-cid-j7pv25f6
|
|
>WebComponent.io</a
|
|
>
|
|
</li>
|
|
<li style="display: flex; gap: 0.25em" data-astro-cid-j7pv25f6>
|
|
<span class="icon" data-astro-cid-j7pv25f6>🦌</span>
|
|
<span class="text" data-astro-cid-j7pv25f6>Contributor to</span>
|
|
<a href="https://elk.zone/@ayo@ayco.io" data-astro-cid-j7pv25f6
|
|
>Elk.zone</a
|
|
>
|
|
</li>
|
|
</ul>
|
|
<a href="/now" class="now-wrapper" data-astro-cid-j7pv25f6>
|
|
<span class="now-label" data-astro-cid-j7pv25f6>Now</span>
|
|
<span class="status" data-astro-cid-j7pv25f6
|
|
>Certified Software Architecture Professional</span
|
|
>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<main data-astro-cid-j7pv25f6>
|
|
<section class="cards-section" data-astro-cid-j7pv25f6>
|
|
<ul class="cards-section__grid" data-astro-cid-j7pv25f6>
|
|
<li class="link-card" data-astro-cid-dohjnao5>
|
|
<a href="/showcase" data-astro-cid-dohjnao5>
|
|
<h2 data-astro-cid-dohjnao5>
|
|
Fun Side Projects
|
|
<span data-astro-cid-dohjnao5> →</span>
|
|
</h2>
|
|
<p data-astro-cid-dohjnao5>See demos of my side projects</p>
|
|
</a>
|
|
</li>
|
|
<li class="link-card" data-astro-cid-dohjnao5>
|
|
<a
|
|
href="https://ayco.io/cv"
|
|
target="_blank"
|
|
data-astro-cid-dohjnao5
|
|
>
|
|
<h2 data-astro-cid-dohjnao5>
|
|
CV / Resume <span data-astro-cid-dohjnao5> ↗</span>
|
|
</h2>
|
|
<p data-astro-cid-dohjnao5>
|
|
Download and peruse my skills and experience
|
|
</p>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<footer data-astro-cid-sz7xmlte>
|
|
<ul style="list-style: none" data-astro-cid-sz7xmlte>
|
|
<li data-astro-cid-sz7xmlte>
|
|
© 2022-2024
|
|
<strong data-astro-cid-sz7xmlte>Ayo Ayco</strong>. All Rights
|
|
Reserved
|
|
</li>
|
|
<li data-astro-cid-sz7xmlte>
|
|
This website
|
|
<a
|
|
href="https://ayos.blog/stopped-tracking-on-my-sites"
|
|
data-astro-cid-sz7xmlte
|
|
>does not track users</a
|
|
>
|
|
</li>
|
|
<li data-astro-cid-sz7xmlte>
|
|
See the
|
|
<a
|
|
href="https://ayco.io/sh/ayco.io-flask/tree"
|
|
data-astro-cid-sz7xmlte
|
|
>source code</a
|
|
>
|
|
</li>
|
|
</ul>
|
|
</footer>
|
|
</section>
|
|
</main>
|
|
</body>
|
|
</html>
|