jjmu15

// Determine if an element is in the visible viewport
function isInViewport(element) {
  var rect = element.getBoundingClientRect();
  var html = document.documentElement;
  return (
    rect.top >= 0 &&
    rect.left >= 0 &&
    rect.bottom <= (window.innerHeight || html.clientHeight) &&
    rect.right <= (window.innerWidth || html.clientWidth)
  );

coolaj86

Getting Started with NPM (as a developer)

As easy as 1, 2, 3!

Updated:

• Aug, 08, 2022 update config docs for npm 8+
• Jul 27, 2021 add private scopes
• Jul 22, 2021 add dist tags
• Jun 20, 2021 update for --access=public
• Sep 07, 2020 update docs for npm version

addyosmani

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

nolanlawson

// Promise.all is good for executing many promises at once
Promise.all([
  promise1,
  promise2
]);

// Promise.resolve is good for wrapping synchronous code
Promise.resolve().then(function () {
  if (somethingIsNotRight()) {
    throw new Error("I will be rejected asynchronously!");

sebmarkbage

import { Component } from "React";

export var Enhance = ComposedComponent => class extends Component {
  constructor() {
    this.state = { data: null };
  }
  componentDidMount() {
    this.setState({ data: 'Hello' });
  }
  render() {

CatTail

// encode(decode) html text into html entity
var decodeHtmlEntity = function(str) {
  return str.replace(/&#(\d+);/g, function(match, dec) {
    return String.fromCharCode(dec);
  });
};

var encodeHtmlEntity = function(str) {
  var buf = [];
  for (var i=str.length-1;i>=0;i--) {

rsperberg

Eric Elliott’s Essential JavaScript Links

A curated list by Eric Elliott and friends. Suggest links at the original in the comments section or in the website incarnation.

This fork includes screen-captures of the websites, self-descriptions (which appear within quotation marks) from those sites and some metadata like publication date and GitHub stars and forks. It also may lag behind the original as new links are added there. Commentary is almost entirely from Eric Elliott’s original gist: a few summary descriptions were added for sites that omit capsule descriptions.

Help us turn this into a proper website!

This is a very exclusive collection of only must-have JavaScript links. I'm only listing my favorite links. Nothing else makes the cut. Feel free to suggest links if you think they're good

caridy

// default exports
export default 42;
export default {};
export default [];
export default foo;
export default function () {}
export default class {}
export default function foo () {}
export default class foo {}

FremyCompany

// once in the headers
defineMetaEvent('Namespace','Click');

// then when you need it
document.body.onNamespaceClick.add(function(e) { /*...*/ });
document.body.onNamespaceClick.clear();

madrobby

            DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
                    Version 2, December 2004

 Copyright (C) 2011 Thomas Fuchs <http://mir.aculo.us/>

 Everyone is permitted to copy and distribute verbatim or modified
 copies of this license document, and changing it is allowed as long
 as the name is changed.

            DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE