The Ultimate
Snippet Library.

Vue 3 Custom Directive for Auto-Focusing an Input

Create a custom Vue 3 directive (`v-focus`) to automatically focus an input element when it is mounted to the DOM, improving user experience for forms and interactive elements.

Persist React State in Local Storage with useLocalStorage Hook

Learn how to create a custom React hook to automatically synchronize component state with browser local storage, ensuring data persistence across user sessions.

React Responsiveness with useMediaQuery Hook

Implement a custom React hook to detect CSS media query matches, allowing components to adapt their behavior or rendering based on real-time screen size changes.

Detect Clicks Outside an Element with useOutsideClick React Hook

Create a reusable React hook to easily detect when a user clicks outside a specified DOM element, perfect for closing modals, dropdowns, or popovers.

Access Previous State or Prop Values with usePrevious React Hook

Learn to create a simple yet powerful React hook to keep track of the previous value of any state or prop, useful for comparing changes in your components.

Track Browser Window Dimensions with useWindowSize React Hook

Develop a custom React hook to efficiently get and update the current browser window width and height, enabling responsive layouts and dynamic UI adjustments.

Load Environment Variables from .env File in Bash

Learn how to load environment variables from a .env file into your Bash script for dynamic configuration, commonly used in web development projects.

Validate Presence of Essential CLI Tools in Bash

Ensure your Bash scripts have all necessary command-line tools installed (e.g., node, npm, git) before execution, providing robust error handling.

Create Timestamped Directory Backup with Tar

Safely backup your web project directories by creating a timestamped gzipped tar archive, ensuring you have a restore point before major changes.

Robust HTTP Server Health Check with Retries

Implement a Bash script to health-check a web server's HTTP status with retry attempts, crucial for deployment verification and CI/CD pipelines.

Automate NVM Setup and Node Version Switching

Streamline your Node.js development workflow by automating NVM (Node Version Manager) initialization and switching between Node versions in Bash scripts.

Automate Web Server Restart with Status Check

Learn to write a robust bash script for restarting Nginx or Apache, including pre-check for configuration syntax and post-check for service status.