A rather geeky/technical weblog, est. 2001, by Bramus
useDimensions – a React Hook to measure DOM nodesimport React from 'react' import useDimensions from 'react-use-dimensions' const MeasuredNode = () => { const [ref, { x, y, width, height }] = useDimensions(); return ( <p ref={ref}> I am a paragraph at ({x}px, {y}px) position with a width of {width}px and height of {height}px </p> ); }; Handy. Uses window.resize+window.scroll internally, yet I’m quite …
Continue reading “useDimensions – a React Hook to measure DOM nodes”
If you want to improve the accessibility of your React apps but you don’t know how or where to start, this talk is just what you need. Manuel shares 12 tips that will help you build web sites and applications that can be used by anyone. Each tip fits on one slide and you’ll be …
Kent C. Dodds on how he uses React itself – and not something like Redux – for his Application State Management. Here’s the real kicker, if you’re building an application with React, you already have a state management library installed in your application. You don’t even need to npm install (or yarn add) it. It …
Donovon has created this nice flowchart that explains the new lifecycle of a Hooks component. Comes in handy 😉 hook-flow →
useEffectToday Dan Abramov published an extensive deep dive into useEffect. The issue that many devs (who, including me, have been using componentDidMount before) are having, is that they now need to unlearn a few things It’s only after I stopped looking at the useEffect Hook through the prism of the familiar class lifecycle methods that …
setInterval Declarative with React HooksDan Abramov’s blog Overreacted is pure gold and contains a ton of information. Take today’s post “Making setInterval Declarative with React Hooks” for example, in which he explains why setInterval and Hooks (which should be released in today’s planned React 16.8 release) don’t play that nice together out of the box. // This won’t work …
Continue reading “Making setInterval Declarative with React Hooks”
useHooks(🐠) – Easy to understand React Hook recipes
Hooks are an upcoming feature that lets you use state and other React features without writing a class. This websites provides easy to understand code examples to help you understand how hooks work and hopefully inspire you to take advantage of them in your next project. useHooks(🐠) → 💁♂️ Not familiar with Hooks? The announcement …
Continue reading “useHooks(🐠) – Easy to understand React Hook recipes”
If you’re looking to get started with React, then the (massive) React Handbook will come in handy. The React Handbook follows the 80/20 rule: learn in 20% of the time the 80% of a topic. Best part of it all is that it starts with a big section on Modern JavaScript (e.g. ES2015 and newer) …
🗣 This was originally posted as a reply over at Dave’s blog. Unfortunately Disqus – the commenting system Dave uses – thinks it’s spam, so I’m posting it here as a full post instead. In his blogpost The React is “just” JavaScript Myth, Dave Rupert said this: React shows up on the scene with Babel, …
React 16.3.0 just got released. Next to being able to forward refs and some changes to the lifecycle events it also sports a new Context API which I’ve written about before. Even though the introductory blogpost over at the React blog is very detailed, the video below – covering the new Context API – forms …
Continue reading “React v16.3.0: New Lifecycle Events and Context API”