Premium
JAVASCRIPT Snippets.

Validate URL Format

Validate URLs including http/https protocols, optional www, domains, paths, queries, and fragments using a comprehensive JavaScript regex pattern for web applications.

Validate Password Strength (Min 8 chars, 1 Upper, 1 Lower, 1 Number, 1 Special)

Enforce strong password policies with a JavaScript regex requiring minimum length, uppercase, lowercase, numbers, and special characters for enhanced user security.

Extract Domain Name from URL String

Easily extract the clean domain name (e.g., example.com) from any given URL string, removing protocols, subdomains, paths, and query parameters using regex.

Validate North American Phone Numbers (Flexible Format)

Validate North American phone numbers allowing for various common formats including parentheses, hyphens, spaces, and optional country code with a flexible regex pattern.

Managing Complex State with useReducer Hook

Learn how to use React's `useReducer` hook for managing complex state logic more effectively than `useState`, ideal for scenarios with multiple related state transitions.

Optimizing Callbacks with React's useCallback Hook

Discover how `useCallback` in React helps optimize performance by memoizing event handler functions, preventing unnecessary re-renders of child components in your applications.

Direct DOM Interaction with React's useRef for Focus Management

Learn how to use React's `useRef` hook to directly interact with DOM elements, such as managing focus for input fields, useful for accessibility and user experience.

Create a Custom useDebounce Hook for Input Fields

Develop a reusable custom React `useDebounce` hook to delay execution of a function until after a certain time has passed without further calls, perfect for search inputs.

Persist React State with a Custom useLocalStorage Hook

Implement a custom `useLocalStorage` React hook to easily store and retrieve component state from the browser's local storage, ensuring data persistence across sessions.

Reusable Data Fetching Composable with Loading & Error States

Create a robust and reusable data fetching composable in Vue 3 using the Composition API, handling loading, error, and data states efficiently.

Global State Management with Pinia Store

Implement a global state management system in Vue 3 using Pinia, Vue's recommended store, for managing user data across your application.

Custom V-Model for Two-Way Data Binding on Components

Implement custom `v-model` functionality on your Vue 3 components to enable seamless two-way data binding for complex input or interactive elements.