Skip to content

alexandreferreirafr/allmylinks

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 

Repository files navigation

allmylinks

A place where I share all my links

React

Hooks

Creating a Reusable SubmitButton with UseFormStatus

Explore new hooks coming up in React 19

The Query Options API

New client-side hooks coming to React 19

React useTransition: performance game changer or...?

Use createStateContext to share a useState hook

You Might Not Need React Query

Pull to refresh from scratch as a React hook

Say no to "flickering" UI: useLayoutEffect, painting and browsers story

Breaking React Query's API on purpose

The useEffect cleanup and the two circumstances it's called

Avoiding useEffect with callback refs

useAsyncEffect: The Missing React Hook

useSyncExternalStore First Look

Hooks You Probably Don't Need

isMounted tricks are code-smell

Actionless and Stateless Reducers in React

HOC

Why we still use React HOCs

State Management

🎥 React Advanced London 2023 - Simplifying Data Management in React With React Query

How to Use Jotai and useTransition for Mutation

Storing React state in the URL with Next.js

🎥 STOP using useState, instead put state in URL (in React & Next.js)

Thinking in React Query

Zedux: Is this the one?

Context, Composition, and Flexibility

The URL is the ultimate global state management tool

Why You Don't Need Signals in React

The Most Common Mistakes When Using React

useGlobalState()

A Cure for React useState Hell?

Making React fast by default and truly reactive

🎥 Is Redux still relevant in 2023?

🎥 State Management for NextJS 13 Server and Client Components

Refs

React forwardRef(): How to Pass Refs to Child Components

Refs in React: from access to DOM to imperative API

A Visual Guide to React Rendering - Refs

Server Components

Embracing Slow Networks: Improving User Experience

React Server Components now in RedwoodJS

Embracing the Future and Moving Back Again: From Server Actions to tRPC

How Next.js breaks React Fundamentals (Examples)

🎥 Next.js Explained: Partial Prerendering (What? Why? How?)

🎥 10 common mistakes with the Next.js App Router

RSC is React Server + Component

Next.js App Router Training

🎥 The Truth About React Server Components

🎥 Next 14 Reveals React's Taint, Solves RSC Safety Issues

How to Think About Security in Next.js

🎥 React Advanced London 2023 - Simplifying Server Components

🎥 React Advanced London 2023 - A Practical Guide for Migrating to Server Components

🎥 React Advanced London 2023 - The State of The State In The App Router

Must Know App Router Secret: Promises For Props

Speeding up the dbt™ docs by 20x with React Server Components

Everything I wish I knew before moving 50,000 lines of code to React Server Components

Do Contexts in Next.js 13 Make the Whole App Render on the Client?

Understanding React Server Components

Devtools for React Server Components

The simplest example to understand Server Actions in Next.js

Exploring React Server Components and Server Actions with Next.js

React Server Components Made Our Site Faster

🎥 Server Components in Client Components?? (React / Next.js)

Rust Server Components

Making Sense of React Server Components

🎥 How to NOT Poison Your React Server Components

Opinionated notes on React Server components

RSC From Scratch. Part 1: Server Components

Why do Client Components get SSR'd to HTML?

🎥 Fullstack React Components – with no API

🎥 I built a chart as a React Server Component

How React server components work: an in-depth guide

Building a users table

Why I’m excited about Server Actions

5 Lessons Learned From Taking Next.js App Router to Production

React Server Components, Next.js App Router and examples

Server Components vs. SSR in Next.js

Display a view counter on your blog with React Server Components

React and TypeScript Stopped Fighting???

🎥 Secret React Server Component Patterns They Don't Want You To Know

Concurrency

🎥 React Advanced London 2023 - Concurrent React Made Easy

Fetching

🎥 Dominik Dorfmeister: React Query With The App Router

🎥 React Query is Secretly an Amazing State Manager

🎥 tRPC + NextJS App Router = Simple Typesafe APIs

Custom Fetcher Hooks are Remix's Typesafe RPCs

How to fetch data with React Hooks

Pagination and infinite scroll with React Query v3

Forms

Accessible, Typesafe, Progressively Enhanced Modern Web Forms

Form Validation with React Hook Form

Intro to React Server Components and Actions with Next.js

Can React Server Actions finally fix forms?

🎥 React Hook Form (+ Zod & TypeScript & Server Errors) - COMPLETE Tutorial

🎥 Using Forms in Next.js (Server Actions, Revalidating Data)

Display Warning for Unsaved Form Data on Page Exit

Data Binding in React

i18n

Internationalization In Next.js 13 With React Server Components

Animation

Inside Framer's Magic Motion

Animated page transitions with Remix's nested routes

Animating View Transitions

Performance

Speeding up the JavaScript ecosystem - Server Side JSX

Sneaky React Memory Leaks II: Closures Vs. React Query

Sneaky React Memory Leaks: How useCallback and closures can bite you

I tried React Compiler today, and guess what...

🎥 Rethinking The Linter

Type system of the React compiler

🎥 You Probably Shouldn't Use React.memo()

Optimizing third-party script loading in Next.js

🎥 React Advanced London 2023 - Power Fixing React Performance Woes

🎥 React Advanced London 2023 - React Forget

🎥 React Advanced London 2023 - Patterns for Performance

🎥 React Advanced London 2023 - Speeding Up Your React App With Less Javascript

React memo is good actually

🎥 React Forget: React for developers and compilers - Sathya Gunasekaran

Making React Apps Memory Efficient | Million.js Beyond Speed

Hydration, the Saboteur of Lazy Loading

Records & Tuples for React

The Uphill Battle of Memoization

One simple trick to optimize React re-renders

Before You memo()

Fantastic closures and how to find them in React

useMemo overdose

React Suspense in three different architectures

10 Essential React Performance Optimization Techniques for Faster Web Applications

🎥 Is Next.js App Router SLOW? Performance Deep Dive

🎥 Are React Server Components Really Slower?

Lazy Loading React Components (with react.lazy and suspense)

React reconciliation: how it works and why should we care

Understanding React Concurrency

The Journey of the React Component

A Complete Guide To Incremental Static Regeneration (ISR) With Next.js

Find and fix performance bottlenecks in your Remix app with Server Timing

The Interactive Guide to Rendering in React

Virtual DOM: Back in Block

The Evolution of React Rendering Architectures & Web Performance

Blogged Answers: A (Mostly) Complete Guide to React Rendering Behavior

Timeline of a React Component With Hooks

Optimizing React performance without refs and memo

Prop drilling and component composition in React

React recursively re-renders child components, but there is a nuance

The Children Prop Pattern in React

The mystery of React Element, children, parents and re-renders

React components - when do children re-render?

The future of rendering in React

React re-renders guide: everything, all at once

Setting State On An Unmounted Component

Custom fonts without compromise using Next.js and next/font

🎥 React without memo - React Forget

🎥 Making React Context FAST!

Error Handling

NextJS — Handling Client-Side Errors on Server-Side Pages

Testing

The Need for Speed: A Quick Way to Improve React Testing Times

Type-safe module mocking in Storybook

How to test React custom hooks and components with Vitest

🎥 React Advanced London 2023 - Automating Accessibility Testing for Your Component Library

Unlocking the Power of Storybook

Achieving Clean and Maintainable React Component Tests

Introducing a new lint rule for React Testing Library

React: how to debug the source code

A Wide View of Automated Testing in React Apps

How to Test Custom React Hooks with React Testing Library

Improving React Testing Library Tests

Test Isolation with React

Using React Testing Library

Vitest is not ready to replace Jest (and may never be)

Vitest is fast, jest is faster *

Typing

Type vs Interface: Which Should You Use?

This Pattern Will Wreck Your React App's TS Performance

You Can't Make Children "Type Safe" in React & TypeScript

Wrangling Tuple Types

🎥 Rethink your life choices before you do this...

React.ReactNode vs JSX.Element vs React.ReactElement

Strongly Type useRef with ElementRef

Fully Typed Web Apps

Strongly Typing React Props with TypeScript

How to Pass a Component as a Prop in React

Since TypeScript 5.1, React.FC is now "fine"

What is JSX.IntrinsicElements?

TypeScript + React: Component patterns

Starter Kits

How to start a React Project in 2023

Design Systems

🎥 What is Radix UI?

Building Low Level Components the Radix Way

🎥 Shadcn + Next.js 13 is HEAVEN | A QUICK GUIDE

An Overview of 25+ UI Component Libraries in 2023

Implement Radix's asChild pattern in React

Build your own headless UI components

Multiple Layers of Abstraction in Design Systems

Building a modern design system in layers

Style Wars: Tailwind vs. CSS-in-JS in Design Systems Implementation

Headless components in React and why I stopped using a UI library for our design system

Building a Type-Safe Tailwind with vanilla-extract

The future of Chakra UI

Fighting inter-component HTML bloat

SSR in other languages

Server-side rendering React in OCaml

General

How to render zoomable image with Shadcn UI and Tailwind CSS in Next.js

Interactive dropdown menus with Radix UI

How to Build a Notification System in Next.js with Knock

Next.js security checklist

🎥 React Advanced London 2023 - Hacking an e-Reader with React

🎥 React Advanced London 2023 - Winning the Performance Race

Why useSuspenseQuery works

Cleaner components with useSuspenseQuery

Multiple action handlers with Zod in Remix

Do you still need Framer Motion?

What's Different? Comparing the Router in Next.js App API, Next.js Pages API, Remix, and RedwoodJS

17 Libraries You Should Know if You Build with React

Comparing Authentication in React.js vs. Next.js

🎥 Goodbye, forwardRef

🎥 Deploying Remix to GitHub Pages

🎥 Understanding the Steps of Migrating Your Remix App to Vite.js

You Are Leaking Your Next.js Application Features

Migrate Next.js app away from "Vercel + PlanetScale" to "Fly.io"

Two Types of Composition

From Next.js to Rails then Elixir: My journey through React.js burnout

Mastering React and OpenLayers Integration: A Comprehensive Guide

Optimizing images for Next.js sites with imgproxy and docker

A new kind of color picker - built with React & TypeScript

Panda v1 Roadmap

Nexar Application architecture for Next.js App Router apps

Why I'm Using Next.js

Why I Won't Use Next.js

🎥 Next.js Conf 2023

🎥 Next.js Conf 2023 — Stage S

🎥 React Advanced London 2023 - Implementation of Schedules and Timelines

🎥 React Advanced London 2023 - Why Everybody Needs a Framework

🎥 React Advanced London 2023 - How Popovers Are About to Become a Whole Lot Easier to Build

🎥 React Advanced London 2023 - Feature Flagging With React

Embedding Remix in Directus

Next-Auth in App Router of Next.js

🎥 React Myths And Legends

Test your React Libraries Locally with Yalc

Why I love Remix

Access the Loader Data in Remix

Server-side pagination with Remix

UI Composition

Use svg sprite icons in React

Partially Controlled Components: A Declarative Design Pattern in React

🎥 Creating a Simplified Version of React Dom | Custom React Renderer

The React Graph Gallery

React Google Maps: Drawing Tools

Next.js 13 vs Remix: An In-depth case study

Quit Your YAP-ing

Exploring how virtual DOM is implemented in React

On React Suspense’s throttling

Things you forgot (or never knew) because of React

🎥 React Wasn't Built For The Web

Displaying Local Times in Next.js

Build a server-side filter UI with Remix

Abort Async Calls Inside Remix Loaders and Actions

Await Component

Using PostHog with the Next.js App Router and Vercel

How to solve hydration error in Next.js

Styling React Select with Tailwind

Scaling frontend app teams using Relay

Next.js, just why?

Building a toast component

Chakra, Panda and Ark - What's the plan?

Challenging Established Norms: Making Component Fetching the Exception

Parents & Owners in React: Data Flow

Create a tilt effect in React

A Visual Guide to Routing in Next.js 13

React: how to debug the source code

Colocate your routes into feature folders with Remix Custom Routes

Deploying Next.js on the edge with SST — Is SST the game-changer it’s claimed to be?

Solving hydration errors in Remix

A better learning path for React with server components

The evolution of React APIs and code reuse

Isomorphic Development

🎥 Are React client components bad?

I gambled against React and lost (and I don’t regret a thing)

TV Spatial Navigation

🎥 I'm Done With React

🎥 Always Bet On React

My Struggle With Remix

Server-side rendering React in OCaml

Mastering React: Techniques to Take Your UI to the Next Level

Is React the New WordPress?

Building a blog with Next.js 13 and React Server Components

next over remix

An Animated Guide to Reacts Optional Parameters

How to Use Next.js Image Component in Markdown

On Endings: Why & How We Retired Elm at Culture Amp

Generate open graph social preview images with Remix

Framework popularity on Netlify

Server-side render dates across timezones with Remix

MDX integration strategies for Next.js

Rethinking React best practices

Learning React from two Angles in 2023

Improving readability with React Wrap Balancer

Tao of React - Software Design, Architecture & Best Practices

The Orton Effect - dreamy photo effect in CSS and React

How to debounce and throttle in React without losing your mind

Map of React API

New React docs pretend SPAs don't exist anymore

How Will the Future of Web Development Be Affected by Influential New React Docs?

Announcements

June 2024 Release: Optimistic cart, RichText component, stable analytics

Next.js AI Chatbot 2.0

Introducing Firebolt: The Productive React Framework

Next.js 14

Shopify’s platform is the Web platform

Introducing Next.js Commerce 2.0

Preparing your site for Docusaurus v3

Vercel Integration and Next.js App Router Support

Next.js 13.5

Remix v2

React Canaries: Enabling Incremental Feature Rollout Outside Meta

Introducing storage on Vercel

Remix without Limits

React Native

How Starlink built 3d and AR in React Native & Expo

Flatlist Rendering Techniques

How Belka built MangaYo! app in just 3 months with Expo

Seamless Transitions: From Native to React Native

React Native Security Guide

About the New Architecture

Ship OTA (Over-The-Air) When in an Emergency

React navigation & state machine: Perfecting app flows

What is the Expo Router?

🎥 React Native’s Secret Superpower

Astro

Zero-JavaScript View Transitions

Astro Studio - first impression

Astro DB: A Deep Dive

Astro 3.3: Picture component

Astro 3.2: View Transitions improvements

Migrating my blog from Gatsby to Astro

🎥 Why I STOPPED Using Next.js And Chose Astro Instead

Lifting Off with Astro

🎥 Ben Holmes: Future Astro and React Advanced!

Astro 3.0

Astro 2.10: Persistent State in View Transitions

Better Images in Astro

Reducing 97% of the Open UI site's JavaScript by migrating to Astro

Astro: How Good Is the New JavaScript Framework?

Svelte

🎥 Svelte Runes: Awesome or Awful?

HTMX

HTMX and Web Components: a Perfect Match

🎥 HTMX: The Game-Changing Alternative to React

🎥 htmx in 100 seconds

A First Look at HTMX and How it Compares to React

Storybook

Interactive story generation

Build a Next.js app in Storybook with React Server Components and Mock Service Worker

What's new in the new Storybook

Design Patterns

🎥 React Advanced London 2023 - Opt in Design – The New Era of React Frameworks

🎥 React Advanced London 2023 - Hydration, Islands, Streaming, Resumability… Oh My!

Sending UI over APIs

Writing Your Own Reactive Signal Library

Signals vs. Observables, what's all the fuss about?

Performance

Images

Learn Images

HTTP2/3

Le protocole HTTP/3 : nouveautés et changements par rapport à HTTP/1 et HTTP/2 🇫🇷

Core Web Vitals

What is INP and why you should care

Advancing Interaction to Next Paint

General

Blazing Fast Websites with Speculation Rules

Speeding up the JavaScript ecosystem - The barrel file debacle

How layout position impacts three big web performance levers

Effectively loading ads without impacting page speed

Your Cache Headers Could Probably be More Aggressive

View Transitions Break Incremental Rendering

Hydration is a tree, Resumability is a map

State of Node.js Performance 2023

Improving Performance with HTTP Streaming

Practical Guide To Not Blocking The Event Loop

A11y

A11y-Driven Development

Security

A New Protocol Vulnerability Will Haunt the Web for Years

Architecture

Application Design

Stateful Vs Stateless API: What’s The Difference?

Stateful vs stateless

Scaling up the Prime Video audio/video monitoring service and reducing costs by 90%

The BFF Pattern (Backend for Frontend): An Introduction

The Web’s Next Transition

Monorepos

DefinitelyTyped is a monorepo!

5 Ways to Build a React Monorepo

How to Set Up a Monorepo With Vite, TypeScript, and Pnpm Workspaces

Monorepos in JavaScript & TypeScript

Microfrontends

🎥 React Advanced London 2023 - Micro-Frontends With React & Vite Module Federation

Micro-frontend dev !

Cloud

Where to host your Remix app in 2023

🎥 Vite and Module Federation Makes Micro-Frontends EASY!

Node

10 modern Node.js runtime features to start using in 2024

Deno

Deno 1.40: Temporal API

Node.js's Config Hell Problem

The State of Web Frameworks on Deno

Why We Added package.json Support to Deno

Bun

Power of Partial Prerendering with Bun

Build an app with Remix and Bun

Bun: lessons from disrupting a tech ecosystem

Bun hype. How we learned nothing from Yarn

Node.js vs. Deno vs. Bun: JavaScript runtime comparison

🎥 The Truth About Bun

🎥 Bun Macros: New Feature You Need To Try!

🎥 Bun is disrupting JavaScript land

🎥 Bun Crash Course | JavaScript Runtime, Bundler & Transpiler

🎥 Go vs Rust vs Bun vs Node | Prime Reacts

🎥 Bun 1.0 is here

🎥 My thoughts on Bun

My thoughts on Bun and other Adventures

Rust

🎥 React Advanced London 2023 - The Unlikely Friendship Between React and Rust

Forging Leptos Query

Kafka

🎥 Kafka in 100 Seconds

CSS

Goodbye SASS 👋, welcome back native CSS

Pigment-CSS: Material-UI Fixed on NextJS and React 19

5 CSS snippets every front-end developer should know in 2024

Limit the reach of your selectors with the CSS @scope at-rule

CSS Nesting and the Cascade

CSS Subgrid

🎥 Facebook Tried Tailwind, Then Built This Instead

🎥 Responsive Framer Motion with Tailwind CSS

Four new CSS features for smooth entry and exit animations

🎥 Create Jaw-Dropping UIs with Simple Animated View Transitions and Container Queries

Web Developers, CSS-in-JS is Ruining Your Product

Atomic CSS-in-JS: twind

Modern CSS For Dynamic Component-Based Architecture

Modern CSS in Real Life

Native CSS Masonry Layout In CSS Grid

6 CSS snippets every front-end developer should know in 2023

What's new in CSS and UI: I/O 2023 Edition

TailwindCSS vs. UnoCSS

Scoped CSS is Back

Panda CSS – CSS-in-JS without Runtime Overhead

Crafting the Next.js Website

6 CSS snippets every front-end developer should know in 2023

Atomic CSS-in-JS

3D / ThreeJS

Shining a light on Caustics with Shaders and React Three Fiber

Progressively Enhanced WebGL Lens Refraction

Coding the stars - an interactive constellation with Three.js and React Three Fiber

Getting Started With Your First three.js Project: Part One — The Setup

Getting Started With Your First three.js Project: Part Two — The Build

How we built the Storybook Day 3D animation

Bundlers

Announcing Rspack

Browsers API

🎥 React Advanced London 2023 - Harnessing the Power of Messagechannel and Broadcastchannel

JavaScript import maps are now supported cross-browser

Push notifications are now supported cross-browser

Progressive Web Apps

Badging for Home Screen Web Apps

Typing

Tutorial on Exact Type in TypeScript

This technique makes Valibot’s bundle size 10x smaller than Zod’s!

Strong static typing, a hill I'm willing to die on...

Write your own Zod

How to Properly Type Window

Unraveling the magic of Pattern Matching

One Thing Nobody Explained To You About TypeScript

Array vs T[]: Which is better?

Are Big Projects Ditching TypeScript?

Typescript Prevents Bad Things... and Good Things

One Hour TypeScript Workshop

Comparing schema validation libraries: Zod vs. Yup

Favour TypeScript Types Over Interfaces

Types in JavaScript With Zod and JSDoc

Opnion

🎥 The Average React Developer

Is Jamstack Officially Finished?

Is React Having An Angular.js Moment?

The JavaScript Ecosystem is Delightfully Weird

Even Amazon can't make sense of serverless or microservices

The End of Front-End Development

General

JS Toolbox 2024: Runtime environments & package management

Get a catch block error message with TypeScript

Weak memoization in Javascript

WebSockets vs Server-Sent-Events vs Long-Polling vs WebRTC vs WebTransport

A practical guide to using shadow DOM

Getting Stuff Done: Productivity Tips for Backend and Frontend Devs

Meet Face ID and Touch ID for the Web

How to Authenticate a User via Face Recognition in Your Web Application

What is WebAuthn: Logging in with Face ID and Touch ID on the web

Chrome Extensions Should Scare You.

You can't get faster than No Build

How we optimized package imports in Next.js

Soft skill books that will make you a better developer

Blogged Answers: My Experience Modernizing Packages to ESM

The Absolute Minimum Every Software Developer Must Know About Unicode in 2023

A Blog Post With Every HTML Element

What Does It Mean for Web Browsers to Have a Baseline

Islands & Server Components & Resumability, Oh My!

Using Zig in our incremental Turborepo migration from Go to Rust

Use web components for what they’re good at

Web Apps on macOS Sonoma 14 Beta

Add Drizzle ORM to a Remix app

Running Promises in Parallel: A Visual Guide

HTMX is the Future

Why I Like Using Maps (and WeakMaps) for Handling DOM Nodes

Picking the Right Tool for Maneuvering JavaScript's Event Loop

The “const” Deception

What's new in ECMAScript 2023

Full-stack Web Apps Without React

AI

Diffusion Models

How to fix hands in Stable Diffusion

Diffusion Models: A Practical Guide

Generative

🎥 Accelerate Your GenAI Journey: Build GenAI applications in minutes...

Don’t Build AI Products The Way Everyone Else Is Doing It

🎥 Don’t Build AI Products The Way Everyone Else Is Doing It

🎥 React Advanced London 2023 - Figma to React With AI, Are We There Yet?

🎥 Vercel's New AI Writes Surprisingly Good Code

What is generative AI?

Ask a Techspert: What is generative AI?

e-commerce

Guide to AI for eCommerce

WebML

🎥 Machine Learning for Web Developers (Web ML)

🎥 Getting started with image classification for the web using MediaPipe Solutions

MediaPipe jS: TFjS on Steroids

Make a smart webcam in JavaScript with a TensorFlow.js pre-trained Machine Learning model

useMachineLearning… and Have Fun with It!

General

🎥 PyTorch vs TensorFlow in 2023 FULL OVERVIEW

🎥 TensorFlow in 100 Seconds

🎥 PyTorch in 100 Seconds

Web 3

The Distinctions between Ethers.js and Web3.js

🎥 Decentralized Finance 101 | Francesco Canessa | Porto Tech Hub Conference 2022

Announcements

News from WWDC24: WebKit in Safari 18 beta

Redis Adopts Dual Source-Available Licensing

Storybook 8

Million Lint is in public beta

The Astro Developer Portal

🎥 Introducing Visual Copilot - Design to Code in a Click

Nx 17.0 Has Landed!!!

Node.js 21 Available Now!

Legend-State 2.0: Performance and Persistence

Introducing the Theme Switcher addon

Rspress, the Rspack-based static site generator

Announcing TanStack Query v5

Fresh 1.5: Partials, client side navigation and more

Lit Launch Day: Lit 3.0, Labs graduations, a compiler and more!

Visual Tests addon sneak peek

Deprecating the unload event

Fresh 1.4 – Faster Page Loads, Layouts and More

New in Chrome 117

Announcing native npm support on Deno Deploy

Bun 1.0

Announcing TypeScript 5.1 Beta

Chrome ships WebGPU

New to the web platform in July

Meet Safari for spatial computing

WebKit Features in Safari 17 beta

Introducing the popover API

New to the web platform in May 2023

JavaScript Macros in Bun

RedwoodJS’ Next Epoch: All In on React Server Components

Why We Are Dropping Support For Next Js

Baseline

The Bun Bundler

Introducing the Vercel AI SDK

Introducing Vercel's AI Accelerator

About

A place where I share all my links

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published