Learn how easy it is to use Sentry.io to monitor your React applications

What is Front-End Monitoring

Simply put, front-end monitoring is the set of processes and tools used to track the performance of a website or app.

Front-end monitoring primarily focuses on the parts that the end user sees. These include issues such as:

  • Slow rendering
  • Inconsistent or unresponsive user experience
  • Network requests/API errors
  • Framework-specific issues

Importance of Front-End Monitoring

As websites are becoming more powerful and complex, the maintenance of its performance becomes increasingly difficult.

Front-end performance is a part of user experience. The perception of a business’ quality is often what the user first sees and experiences through its website. Any inconsistencies, downtime or errors on the client…


Beginner-friendly series on GraphQL 🔰 Let’s continue our app! Part 4 Finale: Set up client-side with React and Apollo Client.

Welcome back to GraphQL for Beginners! A beginner-friendly series introducing the basic concepts of GraphQL and how to connect it to a front-end framework like React using Apollo.

In this part, we will complete our simple chat app by building our front-end with React and Apollo Client.

If you haven’t read the previous parts, please read it:

Step 1: Create a React App

To recap, our project folder currently has a server folder in it. Let's create a client folder now for our React app.

In our client folder…


Beginner-friendly series on GraphQL 🔰 Let’s start building our app! Part 3: Setting Up GraphQL server

Welcome back to GraphQL for Beginners! A beginner-friendly series introducing the basic concepts of GraphQL and how to connect it to a front-end framework like React using Apollo.

In this part, we will start building a GraphQL server for a simple chat app with React and Apollo Client.

Sneak Peek:


Beginner-friendly series on GraphQL 🔰 Let’s continue from where we left off! Part 2: GraphQL Schemas, Subscriptions and Servers

Welcome back to GraphQL for Beginners! A beginner-friendly series introducing the basic concepts of GraphQL and how to connect it to a front-end framework like React using Apollo. At the end of this series, you will be able to build a simple chat app with GraphQL, React and Apollo.

Sneak Peek:


Let’s build a real-time chat app with GraphQL, React and Apollo! Step-by-step tutorial for beginners 🔰

Part 1: Introduction to GraphQL

Welcome to GraphQL for Beginners! The primary goal of this series is to introduce the basic concepts of GraphQL and how to connect it to a front-end framework like React using Apollo. At the end of this series, you will have a simple chat app built with GraphQL, React and Apollo.

Sneak Peek:


Learning a new skill or knowledge is never an easy feat. As with any career, we continuously learn new things to improve ourselves and level up our skills. At the end of the day, to get better at something requires learning tons of theory and a lot of practice. In this article, let’s discuss some ways we can learn more effectively and efficiently.

1. Eliminate distractions

A good learning environment is important for focus. So, a simple way to create such an environment is to eliminate any distractions.

When I am trying to learn something, I would turn off social media notifications and…


Looking for a career in technical writing/blogging? Let’s explore key differences between them!

In the tech community, there are 2 words that I noticed are often interchangeably used: technical blogging and technical writing. I have received several questions from my readers on how they can become a technical blogger/writer, and that’s when I realized that these are 2 words are mistakenly comprehended by a lot of people (including me a while back).

So in this article, let’s discuss the differences between technical blogging and technical writing!

Similarities

Because both words consist of the word ‘technical’, most people assume they mean the same thing. Content-wise, both are jobs which write on topics that are more…


Tired of console.log() to debug all the time? Use DevTools and these strategies to be a more efficient debugger!

Are you still typing console.log() in your projects to debug? In this article, let's learn how to be a more efficient debugger using Chrome DevTools.

What is Chrome DevTools?

The Google Chrome browser offers a built-in developer tools (aka DevTools) that help developers edit their code directly on the browser, add breakpoints to detect issues and debug their code quicker.

Introduction to DevTools Panels

The DevTools UI has a total of 8 panels. This article will mostly cover the Sources panel, as that’s where we will debug.


A quick and simple overview of React for beginners to get started

It might seem overwhelming for a beginner to learn the React framework. After all, it has gone through a lot of changes since it was first released around 2013. Here’s a cheat sheet, not a full tutorial but a simple-to-understand and concise overview on what it takes to learn React.

What is React?

It is a JavaScript library designed to create single-page applications with reusable UI components.

How does it work?

React stores the information DOM by creating a virtual DOM in its memory. Before it renders the DOM nodes onto the browser, it checks for changes between its past and present virtual DOM. If there’s a…


Step-by-step tutorial on how to build your very first Discord bot!

Hello everyone! In this article, let’s build a simple Discord bot with Node.js. This tutorial aims at beginners with zero knowledge on how to build a Discord bot.

To follow along, you need to have the following prerequisites:

  • Code editor (i.e. VS Code)
  • Basic knowledge in JavaScript
  • Node and npm installed in your machine
  • A Discord account and server set up

Step 1: Create an App in Discord

First, we need to create our bot as an app in Discord. Go to discord.com/developers and sign in or create a developer account.

Once you’re logged in, click on ‘New Application’ at the top right of the window.

Victoria Lo

A nerd in books, tea and programming. I publish weekly on my personal blog: https://lo-victoria.com/

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store