All Snippets - CodeSnippets

Filters

24 Snippets Found

Web Development
Responsive Navigation Menu with Flexbox
Avatar JohnDoe
CSS

A fully responsive navigation menu using CSS Flexbox with smooth transitions and mobile-friendly design.

.navbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 2rem;
  background-color: #fff;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.nav-menu {
  display: flex;
  list-style: none;
  gap: 2rem;
}

@media (max-width: 768px) {
  .nav-menu {
    flex-direction: column;
  }
}
JavaScript
Debounce Function for Search Input
Avatar JaneSmith
JavaScript

A reusable debounce function to limit the rate of API calls on search input events.

function debounce(func, wait, immediate) {
  let timeout;
  return function executedFunction(...args) {
    const later = () => {
      timeout = null;
      if (!immediate) func.apply(this, args);
    };
    const callNow = immediate && !timeout;
    clearTimeout(timeout);
    timeout = setTimeout(later, wait);
    if (callNow) func.apply(this, args);
  };
};

// Usage
const searchInput = document.getElementById('search');
searchInput.addEventListener('input', debounce(function(e) {
  console.log('Search for:', e.target.value);
}, 500));
Database
SQL Query for User Analytics
Avatar DataGuru
SQL

A comprehensive SQL query to analyze user engagement and activity metrics.

SELECT 
    u.id,
    u.username,
    COUNT(DISTINCT p.id) AS post_count,
    COUNT(DISTINCT c.id) AS comment_count,
    COUNT(DISTINCT l.id) AS like_count,
    MAX(p.created_at) AS last_post_date
FROM users u
LEFT JOIN posts p ON u.id = p.user_id
LEFT JOIN comments c ON u.id = c.user_id
LEFT JOIN likes l ON u.id = l.user_id
WHERE u.created_at >= DATE_SUB(NOW(), INTERVAL 30 DAY)
GROUP BY u.id, u.username
ORDER BY post_count DESC
LIMIT 10;

Loading more snippets...