Blog

Thoughts, stories, and updates.

Optimizing React Authentication: Minimizing Re-renders and Improving Performance

Abstract: This post offers a guide to minimizing re-renders and optimizing performance in React/Next.js applications, particularly those with authentication. It covers practical techniques such as combining state variables, memoizing context values with useMemo, tracking significant state changes with useRef, debouncing frequent updates, and carefully managing useEffect dependencies to prevent unnecessary...

Conditional Rendering in Next.js: Hiding Footer on Specific Pages

Abstract: This post provides a guide to conditionally rendering components, such as a footer, within a Next.js 14 application using the App Router. It details a solution for hiding components on specific pages by bridging server and client components through the React Context API and the usePathname hook, addressing challenges...

Integrating with Shadcn: Tips and Insights for Seamless UI Component Integration

Abstract: This post shares a developer’s experience integrating Shadcn UI components into a Next.js project. It covers essential aspects such as initial project preparation, adapting to Shadcn’s opinionated styling (including dark theme and “New York” style), managing global CSS to avoid conflicts, and provides an example root layout that incorporates...

Securing SSH: A Detailed Look at Fail2Ban Configuration and Rule Management

Abstract: This post provides a detailed guide to troubleshooting and configuring Fail2Ban with UFW for robust SSH security on Linux servers. It covers common issues like incorrect iptables rule order, proper jail.local setup for SSH, considerations for persistent bans, and the importance of ensuring correct cleanup of iptables rules when...

Navigating UI Framework Transitions: From Bootstrap to Shadcn

Abstract: This post reflects on a developer’s journey through UI framework choices, transitioning from Bootstrap to a Next.js and Tailwind CSS stack, and ultimately deciding to integrate Shadcn/ui. It discusses the pros and cons of using component libraries like Shadcn, which are based on Radix UI and involve copying code,...

Navigating Client vs Server-Side Authentication in Web Development

Abstract: This post explores the differences between client-side and server-side authentication flows when using Supabase with Next.js 14 (App Router). It provides practical examples covering Google OAuth2 social login, which typically uses a client-side flow with createBrowserClient, and Magic Link email authentication, which involves a server-side flow using createServerClient. The...

Implementing Auth and Database for 8-Bit Oracle

Abstract: This post details the initial backend setup for the 8-Bit Oracle project, focusing on authentication and database integration using Next.js, Supabase (with Auth-UI for OAuth2 and Magic Links), and Tailwind CSS. It discusses the rationale behind choosing Supabase over Firebase, the decision to defer Web3Auth integration, and announces the...

Claude vs GPT4 for Coding

Abstract: This post offers a developer’s brief comparison of using Claude Opus and GPT-4 (via Cursor.sh) as AI coding assistants. It highlights experiences with both models, particularly when working with Next.js (App Router vs. Pages Router) and how they handle recent framework updates, noting differences in understanding context and relevance...

How to Create an Interactive Typing Effect in React with Skip Animation Feature

Abstract: This post shares a developer’s notes and tips for implementing a smooth, multi-paragraph typing animation effect in React, complete with a feature to skip the animation. Key aspects covered include state management using React hooks (useState, useEffect, useCallback), alternatives to direct DOM manipulation, handling user events to skip typing,...

Exploring Divination Techniques: Chainlink VRF vs. Traditional Randomness Methods

Abstract: This post analyzes the feasibility of using Chainlink VRF (Verifiable Random Function) for generating randomness in I-Ching divination. It compares this blockchain-based approach to traditional methods, server-side PRNGs/CSPRNGs, external randomness APIs, and client-side randomness. The discussion covers the pros and cons of each, focusing on user perception, cost, complexity,...