Skip to content

Instantly share code, notes, and snippets.

🍦

Alex Holachek aholachek

🍦
Block or report user

Report or block aholachek

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
@aholachek
aholachek / coverage.json
Created Feb 3, 2020
Reddit coverage.json
View coverage.json
This file has been truncated, but you can view the full file.
[
{
"url": "https://www.reddit.com/",
"ranges": [
{ "start": 0, "end": 99 },
{ "start": 447, "end": 629 },
{ "start": 655, "end": 1210 },
{ "start": 1221, "end": 1494 },
{ "start": 1505, "end": 1507 }
@aholachek
aholachek / instructions.md
Last active Jan 29, 2020
Source-map-explorer workflow: View all bundles loaded in a certain entrypoint
View instructions.md

1. Download Coverage Report

Create a coverage report to see which code was downloaded, and which code was actually used for a given entry point of your app. Download the report and put it in the top level directory of your project. Make sure it's named coverage.json.

2. Prepare script

Create this file in the top level directory of your project:

build-bundles.js

@aholachek
aholachek / protect-yourself-on-the-web.md
Last active Jan 7, 2020
High impact, low-effort ways to protect yourself on the web
View protect-yourself-on-the-web.md

Draft

A Basic Guide to Protecting Yourself On the Web

Step One: Secure your passwords

How

Use a password manager and use different, complex passwords for every site. (The password manager will make it easy to generate and save new, secure passwords.) You can try LastPass (free basic version) or OnePassword (not free but probably worth it).

View flip.md

Here's a rough draft proposal for an extension to the animated component that can handle both simple and advanced FLIP use cases.

Example usage

1. Simplest example

Initiate a FLIP animation on a component by updating the flipKey prop.

Demo

Code

@aholachek
aholachek / index.js
Last active Sep 29, 2018
React Flip Toolkit Tutorial
View index.js
import React, { Component } from "react";
import ReactDOM from "react-dom";
import { Flipper, Flipped } from "react-flip-toolkit";
import "./styles.css";
const listData = [0, 1, 2, 3, 4, 5, 6, 7];
const colors = ["#6da5ff", "#7971ea", "#5900d8"];
// we'll iterate over this array to create groups of 3 components
const baseArray = [...Array(3).keys()];
View simple_proxy.js
// a handler object specifies which methods to proxy
// this one will simply override JavaScript’s default object get method
const loggingHandler = {
get(target, property) {
const val = target[property]
console.log(`Property "${property}" returned "${JSON.stringify(val)}"!`)
return val
}
}
@aholachek
aholachek / jsconfig.json
Created Jan 21, 2018
VSCode config to allow for "Go To Definition" with Webpack aliases
View jsconfig.json
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"*": [
"*",
"components/*",
"portal/*",
"platform/*"
]
@aholachek
aholachek / launch.json
Last active Jul 19, 2018
Simple VSCode Node.js launch config for 1) running currently open JS file 2) running jest tests for currently open file
View launch.json
{
"version": "0.2.0",
"configurations": [
{
"name": "Launch current file",
"type": "node",
"request": "launch",
"program": "${file}",
"runtimeExecutable": "${env:HOME}/.nvm/versions/node/v8.4.0/bin/node"
},
View basic_lifecycle.js
export default function addAnimation(animateIn, animateOut) {
return function wrapComponent(WrappedComponent) {
return class AnimationHOC extends Component {
state = { animatingOut: false }
componentDidMount() {
if (this.props.isVisible) animateIn(this.child)
}
You can’t perform that action at this time.