Recent Posts
Creating a Reusable Fullscreen Hook in React
Recently, I was working on a React project that required certain elements to toggle fullscreen mode, and I needed to reuse this functionality across different components. I wanted a clean, reusable solution that leveraged TypeScript to ensure type safety. This led me to create a custom hook for managing fullscreen behavior in React. In this
How to Detect Clamped Text in React
When working with text-heavy web applications, you might come across scenarios where long text needs to be truncated after a certain number of lines. CSS properties like -webkit-line-clamp make this easy by limiting the visible lines of text, but you might need to know when that text has been clamped for purposes like showing a
How to View Catalog and Table Contents in Trino
When working with Trino, I often find myself needing to inspect the contents of a catalog or specific tables. Knowing how to quickly check the structure and data inside a table is crucial for understanding the data you’re working with. In this post, I’ll walk through how I navigate catalog contents and view table structures
How to Toggle a Div to Fullscreen in React
Building responsive, interactive applications in React often requires creating components that dynamically change based on user interaction. One common feature is allowing a div to take over the entire screen with the click of a button, creating a fullscreen effect. In this post, I’ll walk through how to implement this feature, making sure to keep
How to Fix ‘Too Many Database Connections Opened’ in Prisma with Next.js Hot Reload
When developing a Next.js application with Prisma as your ORM, you might encounter an issue where the application throws the error, “Too many database connections opened: FATAL: remaining connection slots are reserved for roles with the SUPERUSER attribute.” This error usually arises during development, especially when Next.js is in watch mode and the application is
How to Fix “Functions Cannot Be Passed Directly to Client Components” error in Next.js
In Next.js, especially when using the new app directory structure, you might encounter the following error when attempting to pass a function from a Server Component to a Client Component: This error happens because Next.js enforces a strict separation between server-side and client-side code. Server-side functions can’t be passed directly to Client Components, as they
