CategoryJavaScript

October 22, 2021 — This article highlights the process, technical decisions and lessons learned behind building the real-time game Autowuzzler. Learn how to share game state across multiple clients in real-time with Colyseus, do physics calculations with Matter.js, store data in Supabase.io and build the front-end with SvelteKit. Read more…

October 21, 2021 — The prefers-reduced-motion media query has excellent support in all modern browsers going back a couple of years. In this article, Michelle Barker explains why there’s no reason not to use it today to make your sites more accessible. Read more…

October 1, 2021 — Many websites have some sort of search feature because it helps users navigate through their content easily. Implementing it the right way can be tricky and might not give a good user experience. In this tutorial, we will be integrating Algolia, a popular and powerful search service for the best experience on our Nuxt site. Read more…

September 17, 2021 — Gatsby Functions provide front-end developers a way to write and use server-side code without the hassle of maintaining a server. If making money from open-source is of interest to you and your site isn’t built using Gatsby, this approach may well be the answer you were looking for. Read more…

September 13, 2021 — There are way too many options in Web Animations API to pick them up that easily. Learning how timing works and how to control the playback of several animations at once makes for a solid foundation on which to base your projects on. Read more…

September 9, 2021 — When paired with ISR and Next.js’ API routes, SWR can be used to create a responsive user experience. In this article, Sam Poder explains what SWR is, where to use it (and where not), and how to build a website by using Incremental Static Regeneration. Read more…

September 2, 2021 — Interactive coding tools to help you learn CSS, JavaScript, SQL, React, Vim, regular expressions and Jamstack. Read more…

September 1, 2021 — What exactly is a displacement filter? In this article, Dirk Weber explains the SVG feDisplacementMap filter primitive with a good number of examples to demonstrate the concept of animated displacement maps. Read more…

August 31, 2021 — By combining some React APIs, we can accurately manage “simple” states. With Next.js though, we can quickly find situations where we need to accommodate many other requirements. Let’s have a look at some patterns to accomplish all that. Read more…

August 18, 2021 — In this article, we will code a Gantt chart as a reusable Web component. We will focus on the architecture of the component, rendering the calendar with CSS Grid and managing the state of the draggable tasks with JavaScript Proxy Objects. Read more…