Nov 9, 2022Member-onlyIntroduction to Vite: The Next Generation Frontend ToolingAs a React developer, using Create React App to start new projects and run them can be a pain. Firstly, it is slow to install all the 140MB dependencies when creating a new app. Next, it uses Webpack to bundle the code each time new changes are made. Hence, the…Vitejs4 min readVitejs4 min read
Nov 9, 2022Member-onlyThe Complete Guide to Integrate a Payment Processor in Mobile AppsHere’s what you can do to integration PayPal checkout in your mobile apps “Do PayPal offer native app checkout?” is a question I have received from my readers recently. If you do a simple Google search, you will probably find PayPal’s Android/iOS SDK, which has been deprecated since 2018. However, many guides on the internet still publish outdated guides using this SDK and…Mobile App Development9 min readMobile App Development9 min read
Aug 17, 2022Member-onlyGraphQL for Beginners: Schema-first vs Code-firstLet’s take a look at the 2 ways we can build a GraphQL API. How they are different and their pros and cons. GraphQL has become a revolutionary scheme in the API world. As a solution to data fetching more efficiently, the first question you will need to ask yourself when building a GraphQL API is: schema-first or code-first? In this article, let’s take a look at the 2 different approaches to implementing…GraphQL4 min readGraphQL4 min read
Published in StackAnatomy·Mar 18, 2022Member-onlyIntroduction to Bulma: A Simple and Intuitive CSS FrameworkA look at the basics of Bulma, a simple framework for styling — According to its official website, Bulma is a free, open source framework that provides ready-to-use frontend components that you can easily combine to build responsive web interfaces. In this article, let’s take a look at the basics of Bulma and how to build a simple To-Do App using this CSS…Bulma5 min readBulma5 min read
Published in StackAnatomy·Feb 11, 2022Member-only5 Must-Have VS Code Extensions to Boost Productivity (And Why)The top 5 extensions you should not want to live without — A productive development team starts with a productive IDE. Today, Visual Studio Code (or VS Code) has been one of the most popular code editors out there for many reasons. While it has already a plethora of useful features and capabilities right out-of-the-box, there are also extensions available for free…Developer Tools5 min readDeveloper Tools5 min read
Published in StackAnatomy·Jan 30, 2022Member-onlyHow to Add Animations with React Transition GroupStep-by-step guide on how to use this library to add animation to your React components — If you are a beginner in React, it may be difficult to include animations within your app. After all, there are many approaches to add animations; and some have higher learning curves than others. In this article, I’ll introduce React Transition Group and how to use it to add/trigger animations…React7 min readReact7 min read
Dec 18, 2021Member-onlyFlightDash: Handle All Your Travel Concerns with a Conversational AIInspiration Due to COVID-19, there are many things to consider when travelling to another country, such as the entry and exit requirements, and the risk level. The travel restrictions in every country can change abruptly, and we know how difficult it is to stay updated to plan your travels. Hence, we…Artificial Intelligence6 min readArtificial Intelligence6 min read
Published in StackAnatomy·Dec 11, 2021Member-onlyState Machines for JavaScript Developers — How to Use Them in Your AppsLearn how XState can benefit your application logic — What is a state machine? A finite state machine is a mathematical model of computation, often used to design algorithms. It describes the behaviour of a system, which is defined in one single state at a time from a finite number of possible states. For example, in a game, a character can have 4 possible…Xstate6 min readXstate6 min read
Published in StackAnatomy·Nov 24, 2021Member-only3 Ways to Implement Skeleton Components in ReactLearn how to use this technique to improve the UX of your React applications — There’s nothing worse than seeing a blank white page or an infinite spinning wheel when a website or app is loading. Luckily, most modern websites or apps today use skeleton components to reduce our anxiety and frustrations. In this article, let’s talk about skeleton components — what they are, why…React5 min readReact5 min read
Published in StackAnatomy·Nov 8, 2021Member-onlyFetching Data from GraphQL APIs with Apollo ClientConnect your React Apps to GraphQL using Apollo — Apollo Client is a modern and comprehensive state management library that helps developers to fetch, cache or update data from GraphQL APIs. In this article, we will take a look at how to use this library to query a GraphQL API and display its data in a React app. Prerequisite Before…GraphQL5 min readGraphQL5 min read
