gaearon

Next.js client-only SPA example

Made this example to show how to use Next.js router for a 100% SPA (no JS server) app.

You use Next.js router like normally, but don't define getStaticProps and such. Instead you do client-only fetching with swr, react-query, or similar methods.

You can generate HTML fallback for the page if there's something meaningful to show before you "know" the params. (Remember, HTML is static, so it can't respond to dynamic query. But it can be different per route.)

Don't like Next? Here's how to do the same in Gatsby.

sindresorhus

Pure ESM package

The package that linked you here is now pure ESM. It cannot be require()'d from CommonJS.

This means you have the following choices:

1. Use ESM yourself. (preferred)
   Use import foo from 'foo' instead of const foo = require('foo') to import the package. You also need to put "type": "module" in your package.json and more. Follow the below guide.
2. If the package is used in an async context, you could use await import(…) from CommonJS instead of require(…).
3. Stay on the existing version of the package until you can move to ESM.

rauschma

function partition(inputArray, callback) {
  const result = {};
  for (const [indexOfValue, value] of inputArray.entries()) {
    const propertyKey = callback(value, indexOfValue);
    if (propertyKey === null || propertyKey === '') {
      continue;
    }
    if (!{}.hasOwnProperty.call(result, propertyKey)) {
      result[propertyKey] = [];
    }

kentcdodds

function useAbortController() {
  const abortControllerRef = React.useRef()
  const getAbortController = React.useCallback(() => {
    if (!abortControllerRef.current) {
      abortControllerRef.current = new AbortController()
    }
    return abortControllerRef.current
  }, [])

  React.useEffect(() => {

secretgspot

/* global localStorage */

import { writable } from 'svelte/store'
const storage = typeof localStorage !== 'undefined' ? localStorage : {
	removeItem: key => { if (storage[key]) { delete storage[key] } },
}

/**
 * Tracks storage both in `localStorage` and in svelte's `writable` stores
 * Usage: `const name = storable('name', 'arxpoetica')`

neefrehman

$ git tag -l | while read -r tag ; do COMMIT_HASH=$(git rev-list -1 $tag) COMMIT_MSG=$(git tag -l --format='%(contents)' $tag | head -n1) && GIT_COMMITTER_DATE="$(git show $COMMIT_HASH --format=%aD | head -1)" git tag -a -f $tag -m"$COMMIT_MSG" $COMMIT_HASH ; done

$ git tag -l -n1                      #check by listing all tags with first line of message

$ git push --tags --force             #push edited tags up to remote

Heydon

function Mutilator(data, name, context) {
  this.n = name || `mutilation-${+new Date()}`;
  this.d = data;
  this.c = context || window;
  this.isArr = function(p) {
    return this.d[p].constructor == Array;
  };
  this.dispatch = function(p, v, t) {
    this.c.dispatchEvent(
      new CustomEvent(this.n, {

Heydon

// Elements with `data-observe` toggle `data-visible`
// between `true` and `false`

if ('IntersectionObserver' in window) {
  const callback = (entries, observer) => {
    entries.forEach(entry => {
      entry.target.setAttribute('data-visible', entry.isIntersecting)
    })
  }
  

samthor

// UPDATE: In 2023, you should probably stop using this! The narrow version of Safari that
// does not support `nomodule` is probably not being used anywhere. The code below is left
// for posterity.

/**
 * Safari 10.1 supports modules, but does not support the `nomodule` attribute - it will
 * load <script nomodule> anyway. This snippet solve this problem, but only for script
 * tags that load external code, e.g.: <script nomodule src="nomodule.js"></script>
 *
 * Again: this will **not** prevent inline script, e.g.:

willurd

Each of these commands will run an ad hoc http static server in your current (or specified) directory, available at http://localhost:8000. Use this power wisely.

Discussion on reddit.

Python 2.x

$ python -m SimpleHTTPServer 8000