Published in StackAnatomy·Mar 18Introduction 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 read
Published in StackAnatomy·Feb 115 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 read
Published in StackAnatomy·Jan 30How 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 read
Dec 18, 2021FlightDash: 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 read
Published in StackAnatomy·Dec 11, 2021State 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 read
Published in StackAnatomy·Nov 24, 20213 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 read
Published in StackAnatomy·Nov 8, 2021Fetching 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…Graph QL5 min read
Oct 30, 2021GitHub Actions 101 Finale: Build Your Custom ActionBeginner Series to Automating your Workflow with GitHub Actions! Part 5 Finale: Build and deploy your custom action — Hello and welcome to Part 5 (Finale) of the GitHub Actions series. A series where we will walk through everything you need to know about GitHub Actions, from the basics to creating your own customized workflow and actions. In this previous part, we have built a complete CI/CD workflow by…Github Actions7 min read
Oct 30, 2021GitHub Actions 101: Develop a CI/CD WorkflowBeginner Series to Automating your Workflow with GitHub Actions! Part 4: Develop a CI/CD Workflow — Hello and welcome to Part 4 of the GitHub Actions series. A series where we will walk through everything you need to know about GitHub Actions, from the basics to creating your own customized workflow. In this previous part, we learned about secrets, how to use actions from different sources…Github Actions6 min read
Oct 30, 2021GitHub Actions 101: Actions, Actions, ActionsBeginner Series to Automating your Workflow with GitHub Actions! Part 3: Actions from Marketplace, Actions from Repo and Custom Actions! — Hello and welcome to Part 3 of the GitHub Actions series. A series where we will walk through everything you need to know about GitHub Actions, from the basics to creating your own customized workflow. In this previous part, we learned about Environment Variables and how they can be used…Github Actions5 min read
