oliviertassinari

import React from 'react';
import classNames from 'classnames';
import PropTypes from 'prop-types';

function stylifier(higherOrderComponent) {
  return Component => styles => {
    function StyledComponent(props) {
      const { classes, className, ...other } = props;
      return <Component className={classNames(classes.root, className)} {...other} />;
    }

stubailo

require('isomorphic-fetch');

fetch('https://1jzxrj179.lp.gql.zone/graphql', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({ query: '{ posts { title } }' }),
})
  .then(res => res.json())
  .then(res => console.log(res.data));

jorilallo

// @flow
import React from 'react';
import styled from 'styled-components';

type GlobalCssValues = 'initial' | 'inherit' | 'unset';

type WrapValue = 'nowrap' | 'wrap' | 'wrap-reverse' | GlobalCssValues;

type JustifyValue =
  | 'center'

jwilson8767

// MIT Licensed
// Author: jwilson8767

/**
 * Waits for an element satisfying selector to exist, then resolves promise with the element.
 * Useful for resolving race conditions.
 *
 * @param selector
 * @returns {Promise}
 */

stereokai

//----------------------------------*\
// TRIGONOMETRY FUNCTIONS
//----------------------------------*/

// # Trigonometry in CSS
// 
// - Through Taylor/Maclaurin polynomial representation: http://people.math.sc.edu/girardi/m142/handouts/10sTaylorPolySeries.pdf
// - Useful if you don't want to use JS.
// - With CSS Variables.
// - `calc()` can't do power (x ^ y) so I used multiplication instead.

Rich-Harris

Note: I'm not involved in Prepack in any way — please correct me if I say anything incorrect below!

A few people have asked me if Prepack and Svelte are similar projects with similar goals. The answer is 'no, they're not', but let's take a moment to explore why.

What is Prepack?

Prepack describes itself as a 'partial evaluator for JavaScript'. What that means is that it will run your code in a specialised interpreter that, rather than having some effect on the world (like printing a message to the console), will track the effects that would have happened and express them more directly.

So for example if you give it this code...

threepointone

I made a little styling lib called glam

(some features are in development)

one

let's start off with the simplest use case. we'll make an 'index.html' page, and assume we've setup our js bundler to output bundle.js

tkh44

import React from 'react'
import { BrowserRouter as Router, Route, Link, Redirect, matchPath } from 'react-router-dom'
import { Motion } from 'data-driven-motion' // https://github.com/tkh44/data-driven-motion

const WOBBLY_SPRING = { stiffness: 200, damping: 15, precision: 0.1 }

const AnimationExample = () => (
  <Router>
    <div>
      <ul>

threepointone

(also know as lies and/or alternative facts)

js

• setImmediate - doesn't set anything immediately, waits for a tick before executing
• setTimeout(fn, n) - never sets the timeout to exactly n
• Math.random() - computers cannot generate random numbers
• Promise - is a lie when rejected
• Array.reduce - accumulates, does not reduce (via @sbmadhav)

juliandescottes

var export_to_unit8_t_rot = function () {
  var HTML_NEW_LINE = '
';

  var width = pskl.app.piskelController.getWidth();
  var height = pskl.app.piskelController.getHeight();
  var frameCount = pskl.app.piskelController.getFrameCount();
  if (frameCount > 1) {
    console.error('This export only supports one frame');
  }