The Ultimate
Snippet Library.

Track Previous State or Prop Value with usePrevious Hook

Create a simple custom React hook to easily access the previous value of a prop or state variable, valuable for comparisons and conditional logic.

Detect Clicks Outside an Element with useOnClickOutside Hook

Implement a custom React hook to efficiently detect when a user clicks outside a specified DOM element, perfect for closing modals, dropdowns, or tooltips.

Respond to CSS Media Queries with useMediaQuery Hook

Create a React hook to dynamically detect and respond to CSS media queries within your component logic, enabling responsive behavior directly in JavaScript.

Dynamically Switching Components with Vue 3

Discover how to dynamically render different components in Vue 3 using the `<component :is>` attribute, enhancing UI flexibility and code organization.

Building a Custom Directive for Element Focus

Create a custom Vue 3 directive to automatically focus input elements on mount, demonstrating how to encapsulate reusable DOM behavior efficiently.

Implementing Dependency Injection with Provide/Inject

Implement Vue 3's `provide` and `inject` to manage shared data across deeply nested components, avoiding prop drilling and improving maintainability.

Secure Server-Side CORS Configuration in Node.js Express

Properly configure Cross-Origin Resource Sharing (CORS) in your Node.js Express application to control which domains can safely access your API resources.

Implement CSRF Protection with Synchronizer Tokens (Laravel)

Protect web forms and state-changing requests from Cross-Site Request Forgery (CSRF) attacks by implementing synchronizer tokens, as demonstrated in Laravel.

Securely Hash Passwords with Argon2 in Node.js

Learn to securely hash user passwords using the Argon2 algorithm with Node.js `argon2` library, preventing common brute-force and rainbow table attacks.

Set Essential Security HTTP Headers for Web Applications

Harden your web server by configuring critical HTTP security headers like HSTS, X-Frame-Options, and X-Content-Type-Options to mitigate various web vulnerabilities.

Preventing Server-Side Request Forgery (SSRF) Attacks

Safeguard your server-side applications from SSRF attacks by validating and restricting outbound requests to external resources and private networks.

Validate Hexadecimal Color Code Format

Use a JavaScript regex to validate hexadecimal color codes, supporting 3-digit and 6-digit formats, with or without a leading hash symbol, for CSS or UI inputs.