Skip to content

Instantly share code, notes, and snippets.

💅
writing JavaScript

Max Stoiber mxstbr

💅
writing JavaScript
Block or report user

Report or block mxstbr

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@mxstbr
mxstbr / PaginationTypes.graphql
Created Feb 20, 2018
Code snippets for "Securing Your GraphQL API from Malicious Queries" blog post
View PaginationTypes.graphql
type Participant {
# The complexity of getting one thread in a thread connection is 3, and multiply that by the amount of threads fetched
threadConnection(first: PaginationAmount, after: String): ThreadConnection @cost(complexity: 3, multiplier: "first")
}
type Thread {
participants(first: PaginationAmount,...): [Participant] @cost(complexity: 2, multiplier: "first")
}
View profiling-a-webpage-with-chrome.md

First, start Chrome and open the page you want to profile:

./chrome --js-flags=”--prof” --no-sandbox http://localhost:8080/index.html

Note: This page should do things on-load, simply close Chrome once it's done

Then preprocess the biggest .log file you get: (since the biggest one should be from the main renderer):

@mxstbr
mxstbr / send-email.js
Created Nov 13, 2017
A send email util for Postmark
View send-email.js
import postmark from 'postmark';
const debug = require('debug')('send-email');
const stringify = require('json-stringify-pretty-compact');
let client;
if (process.env.POSTMARK_SERVER_KEY) {
client = new postmark.Client(process.env.POSTMARK_SERVER_KEY);
} else {
console.log(
'\nℹ️ POSTMARK_SERVER_KEY not provided, debug mode enabled. Will log emails instead of actually sending them.'
View log-resolvers.js
import createLogger from 'graphql-log';
let list = [];
const logExecutions = createLogger({
logger: (name) => {
list.push(name);
fs.writeFileSync('resolvers.js', JSON.stringify(list, null, 2));
},
});
@mxstbr
mxstbr / asyncify.js
Last active Mar 13, 2018 — forked from ForbesLindesay/iter.js
A reusable utility to turn a callback-based listener into an async iterable
View asyncify.js
// @flow
// Turn a callback-based listener into many async iterators without buffering
import { $$asyncIterator } from 'iterall';
type Listener = ((arg: any) => void) => Promise<any>;
const defaultOnError = (err: Error) => {
throw new Error(err);
};
View keybase.md

Keybase proof

I hereby claim:

  • I am mxstbr on github.
  • I am mxstbr (https://keybase.io/mxstbr) on keybase.
  • I have a public key whose fingerprint is 78D3 829B 9CE0 7924 2C15 4E38 673F 4304 C9E3 A511

To claim this, I am signing this object:

@mxstbr
mxstbr / Field.js
Last active Nov 29, 2018 — forked from hungrysquirrel/Field.js
Style Storybook with Styled Components
View Field.js
import React, { PropTypes } from 'react';
import styled from 'styled-components'
const Wrapper = styled.div`
// styles here that used to be for .test
`
const Label = styled.label`
// label styles here
`
@mxstbr
mxstbr / Component.js
Last active Jun 18, 2019
styled-components ❤ tachyons
View Component.js
// There's two ways to use Tachyons together with styled-components
// Both are valid, which one you use depends if you want to always apply a tachyons class when a certain component
// is rendered or if you want to apply it for specific instances.
// 1. Use .attrs to define classNames that should always be applied to a styled component
// Whenever you use <Component /> now it'll have both the styled-components as well as the Tachyons class
// See the docs for more info: https://www.styled-components.com/docs/basics#attaching-additional-props
const Component = styled.div.attrs({
className: 'bw0-l',
})`
@mxstbr
mxstbr / README.md
Last active Sep 1, 2017
Syntax highlighting ESNext (inc. JSX) for Keynote presentations
View README.md

Syntax Highlighting ESNext (inc. JSX)

To get syntax highlighting for ESNext (including JSX), you need to have pygments-lexer-babylon installed:

pip install pygments pygments-lexer-babylon

Now when you run pygmentize on a .jsx file it'll automatically use the new lexer! 🎉

@mxstbr
mxstbr / webpack-for-node-modules.js
Last active Jun 26, 2019
How to use webpack to compile node modules
View webpack-for-node-modules.js
/* eslint-disable no-var */
var path = require('path');
var autoprefixer = require('autoprefixer');
const MATCH_ALL_NON_RELATIVE_IMPORTS = /^\w.*$/i;
module.exports = [{
output: {
filename: '[name].js',
library: 'atrium-react-plugin-beta',
You can’t perform that action at this time.