{"tag":{"id":"56744723958ef13879b952af","name":"webdev","logo":null,"slug":"webdev","tagline":null,"__typename":"Tag"},"publication":{"__typename":"Publication","id":"60c3d7481e145957d5af7bb7","url":"https://blog.okikio.dev","canonicalURL":"https://blog.okikio.dev","urlPattern":"SIMPLE","title":"Okiki's Blog","displayTitle":"","hasBadges":true,"descriptionSEO":"Software Engineer at @vercel; Maintainer on @withastro; Creator of bundlejs.com & inthistweet.app\n","about":{"html":"

Software Engineer at @vercel; Maintainer on @withastro; Creator of bundlejs.com & inthistweet.app

\n","__typename":"Content"},"features":{"newsletter":{"isEnabled":true,"__typename":"NewsletterFeature"},"viewCount":{"isEnabled":true,"__typename":"ViewCountFeature"},"readTime":{"isEnabled":true,"__typename":"ReadTimeFeature"},"audioBlog":{"isEnabled":true,"voiceType":"FEMALE","__typename":"AudioBlogFeature"},"textSelectionSharer":{"isEnabled":true,"__typename":"TextSelectionSharerFeature"},"customCSS":{"isEnabled":false,"published":null,"draft":null,"__typename":"CustomCSSFeature"},"__typename":"PublicationFeatures"},"metaTags":"\n\n","ogMetaData":{"image":"https://cdn.hashnode.com/res/hashnode/image/upload/v1624215141957/OcdYT413U.png","__typename":"OpenGraphMetaData"},"author":{"__typename":"User","id":"60c3d2b9a25fa357af840470","name":"Okiki Ojo","username":"okikio","profilePicture":"https://cdn.hashnode.com/res/hashnode/image/upload/v1623450501343/GeXpsjZWS.png"},"preferences":{"__typename":"Preferences","logo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1626310784007/1LI0VudoP.png","darkMode":{"__typename":"DarkModePreferences","logo":"https://cdn.hashnode.com/res/hashnode/image/upload/v1626310891067/BJ9g25PYa.png","enabled":true},"navbarItems":[{"__typename":"PublicationNavbarItem","id":"6215c6832c936b90065dc75d","label":"Portfolio","url":"https://okikio.dev","priority":5,"type":"link","series":null,"page":null},{"__typename":"PublicationNavbarItem","id":"6215c691a03ae28fe10fc370","label":"Dev.to","url":"https://dev.to/okikio","priority":4,"type":"link","series":null,"page":null},{"__typename":"PublicationNavbarItem","id":"6215c69c2c936b90065dc769","label":"Sponsor","url":"https://blog.okikio.dev/sponsor","priority":3,"type":"link","series":null,"page":null},{"__typename":"PublicationNavbarItem","id":"61ff3730fd8b083e5728d62a","label":"Code Snippets","url":"https://codepen.io/okikio","priority":0,"type":"link","series":null,"page":null},{"__typename":"PublicationNavbarItem","id":"6215c6d6a03ae28fe10fc37c","label":"Coffee?","url":"https://www.buymeacoffee.com/okikio","priority":0,"type":"link","series":null,"page":null},{"__typename":"PublicationNavbarItem","id":"63e088aebf2ce4a649f5f23a","label":"Bundlejs Changelog","url":"https://blog.okikio.dev/series/bundle-js","priority":0,"type":"link","series":null,"page":null}],"enabledPages":{"__typename":"PagesPreferences","badges":false,"newsletter":true,"members":null},"layout":"magazine","disableFooterBranding":false},"favicon":"https://cdn.hashnode.com/res/hashnode/image/upload/v1623916433158/GTvFtY2Bb.png","headerColor":"#FFFF00","integrations":{"fbPixelID":"","fathomSiteID":"","fathomCustomDomainEnabled":null,"fathomCustomDomain":"","hotjarSiteID":"","matomoSiteID":null,"matomoURL":"","gaTrackingID":"G-593EW8CRE3","plausibleAnalyticsEnabled":true,"wmPaymentPointer":"","umamiWebsiteUUID":"ad610a60-88b5-43d4-acde-47cf6f5f6b41","__typename":"PublicationIntegrations"},"imprint":"","postsCount":11,"isTeam":false,"links":{"twitter":"https://twitter.com/okikio_dev","instagram":"","github":"https://github.com/okikio","website":"https://okikio.dev","hashnode":"https://hashnode.com/@okikio","youtube":"","dailydev":"https://app.daily.dev/okikio","linkedin":"https://www.linkedin.com/in/okikio","mastodon":"https://bsky.app/profile/okikio.dev","__typename":"PublicationLinks"},"domainInfo":{"__typename":"DomainInfo","hashnodeSubdomain":"okikio","domain":{"__typename":"DomainStatus","host":"blog.okikio.dev","ready":true},"wwwPrefixedDomain":null},"redirectionRules":[{"source":"/github-codespaces-vs-gitpod-an-in-depth-look","destination":"https://blog.okikio.dev/github-codespaces-vs-gitpod-choosing-the-best-online-code-editor","type":"PERMANENT","__typename":"RedirectionRule"}],"sponsorship":{"content":{"html":"

Hey 👋, you can now sponsor me! There isn't much to say about me. I'm an OSS dev, a maintainer on astro, creator of bundle.js.org, creator of @okikio/animate, etc... Help support me as I create and maintain more projects. You can visit my website okikio.dev to learn a bit more about me.

\n","markdown":"Hey 👋, you can now sponsor me! There isn't much to say about me. I'm an OSS dev, a maintainer on [astro](https://github.com/withastro), creator of [bundle.js.org](https://bundle.js.org), creator of [@okikio/animate](https://native.okikio.dev/animate), etc... Help support me as I create and maintain more projects. You can visit my website [okikio.dev](https://okikio.dev) to learn a bit more about me. ","__typename":"Content"},"stripe":{"connected":true,"accountId":"acct_1JHUkSRIjA6N8KPp","country":"CA","__typename":"StripeConfiguration"},"__typename":"PublicationSponsorship"},"pro":null,"posts":{"edges":[{"node":{"id":"6326ab447ae3b59ef0064d87","title":"Using FormData with Astro","slug":"using-formdata-with-astro","publishedAt":"2022-09-18T05:23:16.304Z","cuid":"cl86w7fxr05zqwhnv8ba2dgv9","url":"https://blog.okikio.dev/using-formdata-with-astro","subtitle":"How to upload files with Astro, express and multerjs","brief":"Introduction\nSomeone recently asked me how to use FormData with Astro, to which I responded I'll create a small document for this (I'll create a pr to add this to the Astro docs a little later).\nGetting started\nI won't go into detail on what FormData...","readTimeInMinutes":9,"views":2358,"author":{"id":"60c3d2b9a25fa357af840470","username":"okikio","name":"Okiki Ojo","profilePicture":"https://cdn.hashnode.com/res/hashnode/image/upload/v1623450501343/GeXpsjZWS.png","followersCount":21,"__typename":"User"},"coverImage":{"url":"https://cdn.hashnode.com/res/hashnode/image/unsplash/R8p564Om44w/upload/v1663391187712/ajPSBWIXz.jpeg","isPortrait":false,"__typename":"PostCoverImage"},"__typename":"Post"},"cursor":"NjMyNmFiNDQ3YWUzYjU5ZWYwMDY0ZDg3XzIwMjItMDktMThUMDU6MjM6MTYuMzA0Wg==","__typename":"PostEdge"},{"node":{"id":"61002b34d3dd5634ae9060e7","title":"GZIP on the Browser","slug":"gzip-on-the-browser","publishedAt":"2021-07-27T15:50:12.305Z","cuid":"ckrm8jlpt01ssems1hyms3aqr","url":"https://blog.okikio.dev/gzip-on-the-browser","subtitle":"","brief":"Out of curiosity I created a small demo detailing how you can implement GZIP in the browser, I used fflate for the GZIP compression, and pretty-bytes to convert bytes into human readable format, the demo is really small but as an example it should be...","readTimeInMinutes":1,"views":767,"author":{"id":"60c3d2b9a25fa357af840470","username":"okikio","name":"Okiki Ojo","profilePicture":"https://cdn.hashnode.com/res/hashnode/image/upload/v1623450501343/GeXpsjZWS.png","followersCount":21,"__typename":"User"},"coverImage":null,"__typename":"Post"},"cursor":"NjEwMDJiMzRkM2RkNTYzNGFlOTA2MGU3XzIwMjEtMDctMjdUMTU6NTA6MTIuMzA1Wg==","__typename":"PostEdge"},{"node":{"id":"60d17966f668475d88fecbb8","title":"PSA: Add dark mode to your sites, or at least let the browsers do it for you","slug":"psa-add-dark-mode-to-your-sites-or-at-least-let-the-browsers-do-it-for-you","publishedAt":"2021-06-22T05:47:18.005Z","cuid":"ckq7mlg4y084dh4s17ou0b80p","url":"https://blog.okikio.dev/psa-add-dark-mode-to-your-sites-or-at-least-let-the-browsers-do-it-for-you","subtitle":"Dark mode...Dark mode for everyone, start using the `color-scheme` property today.","brief":"I have a simple message for web developers, start adding the color-scheme property to your webpages.\n\n\n\n...","readTimeInMinutes":5,"views":5265,"author":{"id":"60c3d2b9a25fa357af840470","username":"okikio","name":"Okiki Ojo","profilePicture":"https://cdn.hashnode.com/res/hashnode/image/upload/v1623450501343/GeXpsjZWS.png","followersCount":21,"__typename":"User"},"coverImage":{"url":"https://cdn.hashnode.com/res/hashnode/image/upload/v1624312666234/v_FaNR_hS.jpeg","isPortrait":false,"__typename":"PostCoverImage"},"__typename":"Post"},"cursor":"NjBkMTc5NjZmNjY4NDc1ZDg4ZmVjYmI4XzIwMjEtMDYtMjJUMDU6NDc6MTguMDA1Wg==","__typename":"PostEdge"},{"node":{"id":"60ceb8e037952431a1712ff4","title":"Adding Custom Easing to the Web Animation API","slug":"adding-custom-easing-to-the-web-animation-api","publishedAt":"2021-06-20T03:41:20.813Z","cuid":"ckq4n7rlb0ojhsxs1h3ez78uw","url":"https://blog.okikio.dev/adding-custom-easing-to-the-web-animation-api","subtitle":"","brief":"I recently posted about @okikio/animate, a new Animation library that uses the Web Animation API (WAAPI) to create smooth, and highly performant animation.\nhttps://blog.okikio.dev/okikioanimate-the-animation-library-built-using-web-animations-api-waa...","readTimeInMinutes":2,"views":548,"author":{"id":"60c3d2b9a25fa357af840470","username":"okikio","name":"Okiki Ojo","profilePicture":"https://cdn.hashnode.com/res/hashnode/image/upload/v1623450501343/GeXpsjZWS.png","followersCount":21,"__typename":"User"},"coverImage":{"url":"https://cdn.hashnode.com/res/hashnode/image/upload/v1624146980236/An3IQyaku.jpeg","isPortrait":false,"__typename":"PostCoverImage"},"__typename":"Post"},"cursor":"NjBjZWI4ZTAzNzk1MjQzMWExNzEyZmY0XzIwMjEtMDYtMjBUMDM6NDE6MjAuODEzWg==","__typename":"PostEdge"},{"node":{"id":"60c3d614a25fa357af840484","title":"@okikio/animate - the animation library built using Web Animations API (WAAPI)","slug":"okikioanimate-the-animation-library-built-using-web-animations-api-waapi","publishedAt":"2021-06-11T21:28:43.000Z","cuid":"ckpsugook0ef5bjs152c6e8sk","url":"https://blog.okikio.dev/okikioanimate-the-animation-library-built-using-web-animations-api-waapi","subtitle":"@okikio/animate is an animation library for the modern web, it uses the Web Animation API to deliver butter smooth animations at a small size.","brief":"Introduction\nThe Web Animations API lets us construct animations and control their playback with JavaScript. The API opens the browser’s animation engine to developers and was designed to underlie implementations of both CSS animations and transition...","readTimeInMinutes":10,"views":552,"author":{"id":"60c3d2b9a25fa357af840470","username":"okikio","name":"Okiki Ojo","profilePicture":"https://cdn.hashnode.com/res/hashnode/image/upload/v1623450501343/GeXpsjZWS.png","followersCount":21,"__typename":"User"},"coverImage":{"url":"https://cdn.hashnode.com/res/hashnode/image/upload/v1623446545759/8EquyuMoy.jpeg","isPortrait":false,"__typename":"PostCoverImage"},"__typename":"Post"},"cursor":"NjBjM2Q2MTRhMjVmYTM1N2FmODQwNDg0XzIwMjEtMDYtMTFUMjE6Mjg6NDMuMDAwWg==","__typename":"PostEdge"}],"pageInfo":{"endCursor":"NjBjM2Q2MTRhMjVmYTM1N2FmODQwNDg0XzIwMjEtMDYtMTFUMjE6Mjg6NDMuMDAwWg==","hasNextPage":false,"__typename":"PageInfo"},"__typename":"PublicationPostConnection"}}}