RSSAmplifier

Blog

Little Coding Things

Learn web development one little thing at a time. Practical tutorials on JavaScript, CSS, HTML, React, and modern frontend and backend basics.

littlecodingthings.comRSS feed ↗121 posts

Latest posts

How Password Hashing Works

Websites don’t store your password, they store a hash. How hashing works, why that’s the reason password reset exists, and why storing less is safer.

Why Invalid Card Numbers Fail Instantly

Payment forms reject invalid card numbers instantly thanks to the Luhn algorithm — a 1954 checksum your browser runs before contacting anyone at all.

Will AI Replace Junior Developers?

The junior role is changing rather than disappearing. Why the first job gets harder, and which developers end up with the advantage as AI spreads.

Why I Stopped Memorizing Docker Commands

Forgetting Docker commands isn’t a sign you’re failing. Why experienced developers look things up, and why a personal cheat sheet beats memorization.

Why You Should Still Know curl in 2026

curl still matters in 2026. Why AI-generated fetch calls don’t replace it, and how curl teaches you HTTP through headers, debugging and API testing.

Remote Work! Freedom or Burnout?

The honest case for and against remote work as a developer — the freedom and flexibility against distraction, isolation and blurred hours.

Docker & Docker Compose Cheat Sheet

A practical Docker and Docker Compose cheat sheet: start and stop services, follow logs, run commands inside containers, and clean up what you don’t need.

Javascript Testing Tools Explained

Jest, Vitest, Testing Library, Mocha, Chai and Sinon explained for beginners — what each tool actually does, and which one to start with.

Javascript Testing for Beginners

A plain-English introduction to Javascript testing: what a test actually is, why it matters, the types worth knowing, and the tools to start with.

Component Naming Conventions in React

Three naming conventions for components that clash with your UI library — wrapping, naming by purpose, and prefixes — with the tradeoffs of each.

Simple Ways to Create a CSS Overlay Effect

Lay a gradient or solid tint over an image using a ::before pseudo-element. Four copy-ready overlays with before-and-after photos.

Practices Behind Clean Lines Of Code

The unglamorous half of programming — reading other people's code, naming things well, chasing bugs, and keeping a codebase alive.

The border-image-slice CSS Property

Slice a photo into a nine-patch grid and wrap it around a box. What one, two, three and four border-image-slice values each do.

CSS Gradient Borders with border-image

Turn a plain border into a gradient with border-image and border-image-slice. Linear, radial and conic examples, no image files needed.

How to Install Java on Mac: Step-by-Step Guide

Install Java on a Mac with Homebrew or the Oracle JDK, set JAVA_HOME, verify the install, and fix “Unable to locate a Java Runtime” errors.

Am I Too Old to Learn Coding?

Am I too old to learn coding? A developer who started late on why age is rarely the real obstacle, what the learning curve looks like, and where to begin.

clip-path: inset() Explained

Crop an element by pushing its sides in with clip-path: inset(). What one, two, three and four values do, plus the round keyword.

CSS Triangles with clip-path

Copy-ready clip-path: polygon() code for triangles — right, isosceles, acute and obtuse — all built by moving one corner of a square.

CSS Arrow Shapes with clip-path

Copy-ready clip-path: polygon() code for direction signs, arrows and pointers in all four directions, with a diagram for every shape.

Clip-path For Quick Polygons – Ready Code-To-Copy

Copy-ready clip-path: polygon() code for pentagons, hexagons, heptagons, octagons, nonagons and decagons, with diagrams for each.

clip-path: circle() Explained

Crop any element to a circle with clip-path: circle(). Radius, positioning with at, and how to isolate one face in a group photo.

Why are internet cookies called cookies?

Why are internet cookies called cookies? The name traces back to magic cookies in Unix, Lou Montulli, and a piece of early 1990s browser history.

MacOS Shortcuts – Cheatsheet for New Users

A macOS shortcuts cheatsheet for new Mac users: editing, Finder, window and screenshot shortcuts, plus the Windows equivalents if you just switched.

Husky Hooks: Improve Your Git Workflow

Run lint and tests automatically on every commit with Husky Git hooks. Setup, pre-commit examples, Husky vs GitHub Actions, and how to skip a hook.

Infinite CSS Flip Card Animation

Spin a card forever with animation plus @keyframes — around X, around Y or both — and the rotation value that makes it snap back.

CSS Motion: transform, transition, animation

What transform, transition, animation and @keyframes each do in CSS, and every value they take, explained in plain English without code.

CSS Flip Card Animation on Hover

Flip a card on hover with transform: rotateY() and a transition — around X, around Y or both, and how to make it flip back on hover-out.

How to Type the Copyright Symbol on Mac

Type the copyright symbol on a Mac with Option + G. Plus the Character Viewer fallback and shortcuts for ™, ®, degree and section symbols.

How to Close a Full Screen on Mac

Three ways to exit full screen on Mac: the green button, press and hold Esc, or Control + Command + F — plus what to do when an app won’t budge.

How to Install Postgres on MacOS

Install PostgreSQL on macOS with Homebrew, run it as a background service, fix “command not found: psql”, and connect with the psql shell.

HTML for Blinking Text – Simple Copy & Paste Code

The HTML blink tag is obsolete and no longer works in any browser. Here is the CSS animation that recreates blinking text, ready to copy and paste.

The CSS text-shadow Property

Five worked text-shadow examples — positive and negative offsets, stacked colors, and the blur value that ruins readability.

How To Build Stunning Rounded Text – Handy Tips

Bend a line of text into a circle with one span per letter, absolute positioning and transform: rotate(). Full copy-ready coordinates.

What does git add -a do?

git add -a doesn’t exist. The command you want is git add -A — here’s how it differs from git add . and when that difference actually matters.

Made Easy With Reusable Code – Why Classes Matter

Style many elements at once with a single CSS class, then name it so it still makes sense in six months. With do and don't examples.

Express.js Middleware Interview Questions

Express.js interview questions on middleware, routes and app.use, with clear answers on req.params vs req.query vs req.body and express.Router().

How CSS Became So Powerful with Animations

How CSS went from decorating static pages to driving motion — and why animation is a way of communicating state, not just decoration.

How to Restart Your Node App Without Nodemon

Node.js 18.11 added a built-in --watch flag that restarts your app when files change. No nodemon, no config, no extra dependency to install.

Circular CSS Button with Shadow Effect

Build a round push-button in CSS: inset shadows for the base, a gradient face, hover and active states, and a soft shadow underneath.

How inset Works in box-shadow (Made Simple)

The inset keyword draws a shadow inside the element instead of around it. Here is how to build a soft pressed-in effect with two shadows.

How box-shadow Works (Made Simple)

What each box-shadow value actually does — offset, blur, spread and color — built up step by step on one simple box you can copy.

CSS Water Drop Effect on Text

Sit a glossy CSS water drop on top of a heading using border-radius, layered box-shadows and two pseudo-element highlights.

CSS Neon Text Effect

Build a glowing neon sign with nothing but layered box-shadow and text-shadow — outer glow, inset glow and a matching text halo.

CSS Grayscale Filter – A Complete Guide

Apply filter: grayscale() to text, backgrounds, photos, SVG, Font Awesome icons and emoji — with a before-and-after for every case.

CSS Conic Gradient Made Easy

Sweep colors around a point with conic-gradient. Move the center, set the start angle, add color stops and build pie-chart style wedges.

How To Create A Stunning Gray CSS Water Drop

Draw a water drop in pure CSS: an uneven border-radius, four stacked box-shadows for volume, and two pseudo-elements for the highlights.

CSS Folded Corner Effect with clip-path

Build a folded paper corner with clip-path and a ::before pseudo-element — no images, and a drop-shadow trick that clipped boxes allow.

CSS Keyframes Animation Explained

Build a @keyframes animation one layer at a time — color, shape, position, rotation and delay — on a single box, with the shorthand at the end.

The CSS last-child Selector

:last-child targets the final element inside its parent. Worked examples on lists and paragraphs, plus the :nth-last-child(1) equivalent.

What Does span Do in HTML?

What the HTML span tag is for, how it differs from div, and how to style a single word — or a single letter — without breaking the line.