So you went to https://www.npmjs.com/package/@react-hook/resize-observer and copied useSize, but it has a bunch of typescript errors, and it pisses you off (I know it does).
…TypeScript-friendly useSize from @react-hook/resize-observer.Read More »
TypeScript-friendly useSize from @react-hook/resize-observer. Read More »
Some time ago, there was a common problem of having multiple nested group classes. Imagine having a main menu dropdown group, where top level elements are groups, and sub-level elements are groups as well. You might be tempted to use something like this:
<ul class="relative">
<li class="group">
Top level item
<ul class="hidden group-hover:block">
<li class="group">
Sub level items will be here
<ul class="hidden group-hover:block">
<li>Sub-sub level item 1</li>
<li>Sub-sub level item 2</li>
<li>Sub-sub level item 3</li>
</ul>
</li>
</ul>
</li>
</ul>While this looks correct at first glance, but you will have all the nested levels displayed on hover over the top level item. And here’s a solution.
…Group in a group with TailwindCSS. Read More »
When working on a regular React app, it is common to initialize some hooks after the component is mounted, and unbind them after the component is unmounted. However, while working on a React Native app, you might have noticed that the views are actually not unmounted, and as such your bound events and background tasks continue to run from the previous view. Here’s what you can do.
…clearTimeout or clearInterval in React Native views with React NavigationRead More »
clearTimeout or clearInterval in React Native views with React Navigation Read More »
FFmpeg is not only for converting videos, you know? I’ll go straight to the point, here’s how I use it.
…How to resize all JPGs in a folder to PNGs with a maximum width using FFmpeg?Read More »
How to resize all JPGs in a folder to PNGs with a maximum width using FFmpeg? Read More »
I recently stumbled across this simple problem and realized, that I actually don’t want to install any app like Inkscape just to do that. Came across this nice and simple docker image https://hub.docker.com/r/burke/svg2png.
…How to convert all SVGs in a folder to PNG with Docker image?Read More »
How to convert all SVGs in a folder to PNG with Docker image? Read More »
You don’t need to write a recursive loop to nice-format an object or an array. There is a JSON.stringify() that you can utilize.
Beautify JSON object with built-in JSON.stringify()Read More »
Beautify JSON object with built-in JSON.stringify() Read More »
Got this error when trying to import moment into a TypeScript React (.tsx) module?
This error message appears when typings are exposed globally, yet TypeScript tries to validate module typings and the names conflict.
…
Node.js can be used to easily run a web server by using the built-in HTTP module or a web framework such as Express, Hapi, or Fastify. The process involves creating an HTTP server, setting up routes, and starting the server to listen on a specific port for incoming requests.
…5 ways to create an HTTP/HTTP2 server with Node.js.Read More »
5 ways to create an HTTP/HTTP2 server with Node.js. Read More »
You might have had this while using the CSS columns rule and getting rid of all those JavaScript libraries. One of the elements got suddenly cut and wraps to the next column.
Prevent CSS column break within an element Read More »