Published in Level Up Coding·Oct 23, 2022TypeScript: advanced and esotericIn this article, we’ll explore lesser-known features of TypeScript that make it more dynamic. The first part will cover dynamic types that rely on generics to create new types that may look very different from each other, depending on the type arguments they receive. …Typescript11 min readTypescript11 min read
Published in DailyJS·Jul 12, 2022Applying SOLID principles in ReactAs the software industry grows and makes mistakes, the best practices and good software design principles emerge and conceptualize to avoid repeating the same mistakes in the future. …React13 min readReact13 min read
Published in Level Up Coding·Apr 8, 2020Member-only10 security tips for frontend developersto make sure nothing gets stolen through the front door — Web security is a topic that is often overlooked by frontend developers. When we assess the quality of the website, we often look at metrics like performance, SEO-friendliness, and accessibility, while the website’s capacity to withstand malicious attacks often falls under the radar. And even though the sensitive user data…Security8 min readSecurity8 min read
Published in DailyJS·Nov 18, 2019Animating between units with react-springIt’s no secret, that on the web we have to deal with different units — from rems and pixels to percentages and viewport-based values. In this tutorial, we’ll explore the problem of animating between different units, and see how we can overcome it. The problem Let’s start by creating this simple animation…React4 min readReact4 min read
Published in DailyJS·Oct 11, 2019Member-onlyBuilding a Cool Horizontal Scroll Interaction in ReactIn this tutorial, we’ll create a fun scroll animation in which items “flip” in the direction of the scroll. We’re going to use…JavaScript5 min readJavaScript5 min read
Published in Level Up Coding·Jul 24, 2019Animate React with Framer MotionFrom basics to complex orchestrated animations — Framer-motion is a library that powers animations in Framer, and it’s now available as an independent package that we can use in React applications. It has a very simple declarative API that makes it easy to create and orchestrate complex animations with a minimal amount of code. …JavaScript5 min readJavaScript5 min read
Published in Level Up Coding·Jun 24, 2019Rematch with HooksIf you’ve been using Rematch for managing state in your application, the latest release of react-redux that adds support for hooks should get you really excited. Rematch has always tried to keep compatibility with existing react-redux API, and that stays true for the newly released version that supports hooks! In…JavaScript2 min readJavaScript2 min read
Published in The Startup·May 22, 2019Typing Next.JS components using TypeScriptNote: This post covers typing Next.JS applications that use versions prior to v9. Starting with version 9, Next.JS comes with its own types by default, and their names may differ from those used in DefinitelyTyped package. If you use Next.JS version 9 and older, please refer to the official documentation…React4 min readReact4 min read
Apr 29, 2019Type aliases vs. interfaces in TypeScript-based React appsType aliases and interfaces are TypeScript language features that often confuse people who try TypeScript for the first time. What’s the difference between them? When should we use one over the other? Type aliases and interfaces used to be quite different in their capabilities. However, it’s no longer true in…React3 min readReact3 min read
Apr 9, 2017Stripe webhooks in Connect applicationsI have recently implemented Stripe webhook integration for my application that uses Stripe Connect with managed accounts. As it turned out, the process for working with webhook events in Connect applications is slightly different, and there is no official documentation or public blog posts that cover these nuances. …Stripe2 min readStripe2 min read
