Code Snippets

10 Snippets

Interactive code examples with live preview. Edit and experiment.

HTML/CSS
Easy

CSS Grid Layout

Interactive CSS grid demo with live preview. Learn grid-template-columns, gap, and alignment.

Open Snippet
HTML/CSS
Easy

Flexbox Centering Techniques

Different ways to center elements with flexbox. Horizontal, vertical, and both axes.

Open Snippet
JavaScript
Medium

JavaScript Array Methods

Explore map, filter, reduce, and other essential array methods with live examples.

Open Snippet
JavaScript
Medium

Async/Await Patterns

Promise handling, error catching, and parallel execution patterns in JavaScript.

Open Snippet
React/TSX
Easy

React useState Hook

Counter, toggle, and form state examples demonstrating the useState hook.

Open Snippet
React/TSX
Medium

Building Custom Hooks

Learn to build reusable custom hooks: useLocalStorage and useDebounce.

Open Snippet
HTML/CSS
Medium

CSS Animations & Transitions

Keyframes, transforms, and hover effects with pure CSS animations.

Open Snippet
TypeScript
Hard

TypeScript Generics

Generic functions, constraints, and utility types in TypeScript.

Open Snippet
JavaScript
Easy

DOM Manipulation

querySelector, event listeners, and dynamic element creation in vanilla JavaScript.

Open Snippet
HTML/CSS
Easy

Glassmorphism Effect

Create beautiful glass morphism cards with backdrop-filter and CSS.

Open Snippet