Frontend Development

These frontend development guides cover what runs in the browser. They range from quick tricks to app structure.

For structure, read atomic design and structuring JavaScript apps. For a quick win, try Chrome designMode. Also, deeper notes live in the JavaScript, CSS and React sections.

25 articles

03/04/2025 5 min read

10 React Hooks You Must Know in 2025

Ten React hooks that still matter in 2025, with when to use each and how they change component design.
05/02/2025 2 min read

Instantly Edit Websites with Chrome designMode

Use Chrome document.designMode for temporary copy and layout mockups. Steps, limits, a11y warnings, and when to use DevTools…
26/01/2025 5 min read

Hugo Site with Updated Hugo Docker Image

Build and run a Hugo site with an updated Docker image. Dockerfile, build steps, and a clean local-to-container…
22/07/2024 7 min read

JavaScript in AI Development: Browser and Node Tutorials

Practical JavaScript AI tutorial: local embeddings in Node, browser image classification with Transformers.js, ONNX/WebGPU notes, and a ship…
10/10/2023 3 min read

Event Bubbling in JavaScript

Executive Summary: Nested DOM events fire on the target then climb parent nodes, which surprises teams who attach…
06/10/2023 2 min read

Implementing Google Fonts in React Native App

Want to make your React Native apps look nice and user-friendly? Google Fonts is your best buddy! This…
22/07/2023 3 min read

Concurrency & Parallelism in JavaScript

Executive Summary: JavaScript is single-threaded, so concurrency and parallelism get mixed up and UI freezes follow. I separate…
22/09/2022 4 min read

Mastering Asynchronous JavaScript & Event Loop

Executive Summary: Blocking the main thread on fetches and timers makes UIs feel stuck and unresponsive. I cover…
03/07/2022 3 min read

Inheritance And Prototype Chain in JavaScript

Introduction JavaScript has positioned itself as an integral part of web development, fueling both client-side and server-side operations.…
27/06/2022 4 min read

Maximizing Efficiency in React with Memoization

Most performance work comes down to making the app do less: fewer renders, fewer recalculations, less memory. In…
20/05/2022 2 min read

Find Images Missing Width Height Using JS in Chrome Console

Website optimization is critical in delivering a seamless user experience, especially as page load times and stability become…
02/05/2022 7 min read

How to Add jQuery to a Next.js App

Install jQuery from npm and load it only in the browser: a dynamic import inside useEffect, next/dynamic with…
02/10/2021 4 min read

Web Design with CSS Grid Layout

Web design has witnessed revolutionary innovations, and CSS Grid Layout is one of the vital advancements in this…
29/06/2021 3 min read

CSS Blend Modes for Modern Web Design

CSS blend modes let you combine layers, images and colors in the browser the way you would in…