Systems | Development | Analytics | API | Testing

React

How to dockerize a Django, Preact, and PostgreSQL Application

During my recent deep dive into new technologies, I found the classic issues of integrating numerous tech tools effectively. I've written about my experiences to save you the trouble I had. One essential component I've looked into is using Docker to implement containerization. While the initial setup takes a little longer, it significantly simplifies and optimizes your technological stack.

Angular vs. React: Which is Better, and When?

In a nutshell, here's the biggest difference between Angular and React: With Angular, you get a standardized approach to everything. It’s a structured environment that gives you clear direction and all the resources you need within arm's reach, minimizing venturing outside for additional tools or materials. React, on the other hand, resembles a playground where you're handed the basic building blocks and left to your own devices.

The no-nonsense guide React Server Components

React Server Components (RSCs) seem to be everywhere lately, but what problem do they really solve? In this video, Alex Booker from Ably (@CodeCast) explores RSCs from scratch, revealing the motivation and benefits behind them. You might be surprised to learn - they're not merely a React feature, but a fundamentally new model for building full-stack React applications with meta frameworks like Next 13.4 by Vercel.

How to build a live chat widget in React

Live chats have revolutionized customer support, offering seamless and instant communication between businesses and their customers. When building a live chat, there are two main components on the client side: a chat button and a chat window. The chat button is a clickable icon on your website to prompt visitors to start a conversation. The chat window is the interface where the actual conversation occurs.

5 React trends to get ahead of in 2024

As we kick off 2024, it’s time to look ahead. And while yes, it brings the Paris Olympics, the release of highly anticipated VR devices, and a potential new Nintendo console – that’s not all. It also marks React’s second decade and another year of innovation for the popular framework! But what does 2024 hold for React? And what are developers excited about? We spoke to our network and scoured communities to find out – here’s what they said.

React Native Libraries: The ones you should know about in 2024!

Today, there are approximately 7 million people who say they wouldn’t be able to survive without their gadgets. Because of this, businesses must modify their websites and applications to cater to their client’s expectations. Emerging patterns prompt businesses to consider creating iOS and Android mobile apps with the top framework libraries that may greatly streamline and accelerate the development process.

How to add a typing indicator to an in-game chat room with React

In a previous article, I took you through how to add a chat room to a simple game of tic-tac-toe. This post is the second in the series, in which we will look at how to build out the functionality of that chat room with additional features. Across the series, we’ll look at how to manage presence and how to enable emoji reactions – in this post, the focus is on typing indicators. Follow on to find out how to display an indicator when the other person is typing.

Connecting React.js and StimulusJS with JavaScript Events

We recently added a "Getting started" page to the AppSignal, which shows new users a page filled with recommended steps to help them get the most out of their AppSignal experience. Some users enjoy having a helping hand when getting started with AppSignal, others prefer exploring our product solo or already have experience with AppSignal. To give all of our users the option of a guided or solo experience, we needed to a toggle that hides or shows the Getting started page.

How To Enhance AG Grid with Avatars: Building a Collaborative Grid with React and Ably

One of the most common UI elements in software is the tried and true data grid. The idea of organizing data into rows and columns dates back thousands of years. Though human creativity has given us many more ways of displaying data, the humble grid remains a powerful tool in the software developers toolbelt. Today, however, working with any data, including data in grids, often benefits from collaboration capabilities that allow multiple users to work together on the same data.

Server-side Rendering with Next.js, React, and TypeScript

In this post, we'll explain what server-side rendering (SSR) is and how it's different from the usual way websites work. We will run you through how to use SSR with Next.js, React, and TypeScript step-by-step. By the end, you'll know how SSR can make websites faster and better.