https://hugo.curtiscode.dev/tags/react/Recent content in react on Curtis TimsonHugo -- gohugo.ioen-GBFri, 11 Feb 2022 00:00:00 +0000https://hugo.curtiscode.dev/post/js/chartjs-filtering-duplicate-data/Fri, 11 Feb 2022 00:00:00 +0000https://hugo.curtiscode.dev/post/js/chartjs-filtering-duplicate-data/With large data sets, Chart.js data points can start to look cluttered and impact performance. This article looks at how these could be filtered. What is Chart.js? Chart.js is an open-source library which provides simple and flexible Javascript charting. There is also an npm package, react-chartjs-2, which provides Chart.js as React components. Duplicate data points When using a line chart with a lot of data and unchanging values on the y-axis, there can be a lot of overlapping data points, which aren’t providing much value to the user:https://hugo.curtiscode.dev/post/gatsbyjs/add-body-class-gatsbyjs-fouc/Tue, 10 Sep 2019 10:55:00 +0000https://hugo.curtiscode.dev/post/gatsbyjs/add-body-class-gatsbyjs-fouc/Recently I’ve been working on a GatsbyJs project which includes the use of a theme where a body class is used to prevent flashing of unstyled content (FOUC). This post aims to walk you through how to add a “no-js” class to the body server-side with GatsbyJs, and then remove it on client load. What is FOUC? This concept isn’t new and has been around for at least a decade, as Paul Irish’s post shows.https://hugo.curtiscode.dev/post/reactjs/reactjs-jest-snapshot-mocking/Tue, 14 Aug 2018 17:27:00 +0000https://hugo.curtiscode.dev/post/reactjs/reactjs-jest-snapshot-mocking/What are Jest Snapshots? Snapshot ReactJs Components Mocking ReactJs Components GitHub Repository What are Jest Snapshots? Jest is a javascript unit testing framework developed by Facebook. This is primarily used with React, however can also be used with other frameworks, such as AngularJs. Snapshots are a feature of Jest which will record an expected output state of a component. Capture snapshots of React trees or other serializable values to simplify testing and to analyze how state changes over time.