Tag: react
All the articles with the tag "react".
Tech Watch Posts
Interface Segregation Principle in React
Published: at 04:31 PMThe article discusses the Interface Segregation Principle (ISP) in React, emphasizing the importance of creating small, specific interfaces or prop definitions that only include necessary data. The principle suggests avoiding components that depend on more data than they use, which simplifies testing and maintenance. The article also addresses issues like prop drilling and offers solutions such as using React context or component composition to avoid passing unnecessary data through components.
How to Use the useReducer Hook in React
Published: at 03:24 PMThe article on freeCodeCamp explains how to use the useReducer hook in React for managing complex state logic. useReducer is an alternative to useState, useful when state transitions depend on previous states or when multiple states are interconnected. The article covers the basics of reducers, how to set up useReducer with an initial state and actions, and compares it to useState. It also includes practical examples to help understand when and why to use useReducer.
How to compose JavaScript functions that take multiple parameters (the epic guide)
Published: at 09:11 AMThe article provides an in-depth guide on how to effectively compose functions in JavaScript that accept multiple parameters. It explores techniques such as function wrapping, partial application, and currying, which can simplify the handling of functions with multiple parameters. The guide begins by discussing the challenges of composing functions that require multiple arguments and offers solutions like wrapping functions to accept arrays of arguments. It then delves into partial application, where you pre-apply some arguments to a function, creating a new function with fewer parameters. This approach is particularly useful for customizing functions and creating more reusable code. Currying is another technique covered, allowing you to transform functions into a series of unary (single-argument) functions, further simplifying their composition.
Swapy
Published: at 08:57 AMSwapy is a framework-agnostic tool that enables drag-and-swap functionality in web layouts with minimal code. It allows developers to easily convert any layout into a drag-and-drop interface by specifying slots and items using simple HTML attributes. Swapy supports various frameworks like React, Vue, and Svelte, and provides options for customization, including animation styles and event listeners to track swaps. Installation is straightforward via package managers or CDN.
Why I Don't Like Enums
Published: at 02:32 PMThe article explains why the author dislikes using TypeScript Enums, citing their inflexibility and poor compatibility with modern JavaScript features like objects and literal unions. Enums can introduce confusion and make code less predictable. Instead, the author recommends using alternatives like objects or union types, which offer better clarity, maintainability, and alignment with JavaScript's evolution.
Generate a PDF in React
Published: at 02:23 PMThe article on Space Jelly provides a guide on generating PDFs from HTML using JavaScript. It covers three main methods: html2pdf.js for client-side PDF generation from HTML, React PDF for creating PDFs in a React environment with a component-based API, and Puppeteer for automating browser actions to create PDFs. Each method has its pros and cons, with React PDF being highlighted as a versatile option for embedded text and ease of setup.