javascript

erb
<nav id="main-navbar"
     data-turbo-permanent
     data-controller="navbar"
     data-navbar-menu-open-value="false"
     class="navbar">
  <div class="navbar-inner">

Keep navbar state across Turbo navigations with data-turbo-permanent

rails hotwire turbo
by codesnips 3 tabs
erb
<div class="layout" data-controller="sidebar">
  <aside class="sidebar">
    <%= render "shared/sidebar", active: params[:controller] %>
  </aside>

  <main class="content-area">

Scoped navigation inside a sidebar with Turbo Frames

rails hotwire turbo
by codesnips 4 tabs
javascript
export class QueryCache {
  constructor() {
    this.entries = new Map();
  }

  getEntry(key) {

Building a Minimal useQuery Hook with a Shared Cache Provider in React

react hooks caching
by codesnips 4 tabs
javascript
const { z } = require('zod');

const envSchema = z
  .object({
    NODE_ENV: z
      .enum(['development', 'test', 'production'])

Validate Environment Variables at Startup with a Zod Schema in Node.js

nodejs zod configuration
by codesnips 3 tabs
erb
<div class="orders-layout" data-controller="drawer">
  <table class="orders">
    <tbody>
      <% @orders.each do |order| %>
        <tr>
          <td><%= order.reference %></td>

Turbo Frames: inline “details drawer” without a SPA router

rails hotwire turbo
by codesnips 4 tabs
dockerfile
FROM node:20-alpine AS base
WORKDIR /app
RUN apk add --no-cache libc6-compat

FROM base AS deps
COPY package.json package-lock.json ./

Docker multi-stage build for Next.js

docker nextjs multi-stage
by codesnips 4 tabs
javascript
// 1. localStorage basics
// Store data
localStorage.setItem('username', 'alex');
localStorage.setItem('theme', 'dark');

// Retrieve data

LocalStorage, SessionStorage, and IndexedDB

javascript localstorage indexeddb
by Alex Chang 1 tab
javascript
const CACHE_NAME = 'swr-api-v1';
const STAMP_HEADER = 'x-cached-at';

async function open() {
  return caches.open(CACHE_NAME);
}

Stale-While-Revalidate Fetch Wrapper Using the Browser Cache API

cache-api stale-while-revalidate fetch
by codesnips 3 tabs
javascript
const crypto = require('crypto');

function computeSignature(secret, timestamp, payload) {
  return crypto
    .createHmac('sha256', secret)
    .update(`${timestamp}.${payload}`, 'utf8')

Verify Stripe-Style Webhook Signatures With HMAC in Express Before Processing

webhooks hmac security
by codesnips 2 tabs
javascript
// Array destructuring
const numbers = [1, 2, 3, 4, 5];
const [first, second] = numbers;
console.log(first, second); // 1 2

// Skip elements

ES6+ features: destructuring, spread operator, and template literals

javascript es6 destructuring
by Alex Chang 1 tab
javascript
const { Worker, MessageChannel } = require('node:worker_threads');
const path = require('node:path');

class WorkerPool {
  constructor(size) {
    this.workers = [];

Fan Out CPU Work to Node.js worker_threads and Merge Results via MessageChannel

nodejs worker-threads concurrency
by codesnips 3 tabs
javascript
const express = require('express');
const { toCsv } = require('./csvSerializer');
const { fetchOrders } = require('./orderRepository');

const router = express.Router();

Content Negotiation in Express: Serve JSON or CSV From One Route

express content-negotiation rest-api
by codesnips 3 tabs