Skip to content

Instantly share code, notes, and snippets.

Avatar

Juho Vepsäläinen bebraw

View GitHub Profile
View fastpack-reactiveconf-lt.md

Fastpack - pack JavaScript fast & easy

This gist is a submission for a lightning talk on the ReactiveConf 2018.

Why?

  • JavaScript bundling can be a lot faster
  • There are proper tools to guarantee consistency
  • Writing OCaml code is fun!
@tlakomy
tlakomy / jQuery>React.markdown
Last active Aug 7, 2018
Let's not forget about jQuery
View jQuery>React.markdown

In this talk I'd like to use 5 minutes of my time to explain to the audience why jQuery is simply way better than React.

  • Does React have a fadeIn() method? Nah, I don't think so. You need to install a react-transition-group package which weighs over 3GB.
  • Can you do $.get(https://stackoverflow.com/questions/12345/adding_two_numbers_javascript) in React? NOPE.
  • Remember React 3.3.1? Me neither, because they didn't make it. Meanwhile in jQuery land: https://code.jquery.com/jquery-3.3.1.min.js
  • Can you learn jQuery for free? Sure! Can you learn React for free? It'll be $500 USD and your left kidney for a conference ticket.

And many, many more.

(This is a completely serious lightning talk proposal, I promise.)

@SaraVieira
SaraVieira / gist file.md
Last active Jul 30, 2018
The Origin of Furries
View gist file.md

In this talk we will be all discussing the origin of the furry fandom. How we will thogheter create a new furry-in-js framework. We will going over how they have changed the current fandom world, our hearts and the js world in 5 very awesome minutes! This talk is to prove a point that stars mean nothing in this case.

https://reactiveconf.com/

@MadRabbit
MadRabbit / unused.js
Created Jan 23, 2018
Finds unused react components in a project
View unused.js
const { execSync } = require('child_process');
const directory = 'src';
const findOut = execSync('find -L src').toString();
const filenames = findOut.trim().split('\n')
.filter(name => name.endsWith('.js'))
.map(name => name.replace('.js', '').replace('src/', '').replace(/\/index$/, ''));
console.log('Found', filenames.length, 'files in', directory);
@okonet
okonet / lightning_talk_proposal.md
Last active Apr 10, 2018
Make linting great again! -- ReactiveConf 2017 ⚡️talk proposal
View lightning_talk_proposal.md

Please 🌟 this gist to vote for this proposal!

Make linting great again!

tabs vs spaces

No other topic in software development probably has so much controversy as linting.

With a wrong workflow linting can be really a pain and will slow you and your team down. With a proper setup, though, it can save you hours of manual work reformatting the code and reducing the code-review overhead.

@jevakallio
jevakallio / reactiveconf-slam-poetry.md
Last active Jul 20, 2020
#ReactiveConf 2017 Lightning Talk Submission: JavaScript Slam Poetry
View reactiveconf-slam-poetry.md

TL;DR: If you want to see me perform a spoken word poem about JavaScript in front of 1000 people (and on video), please star this gist. If you're on mobile, you'll need to request desktop site.

JavaScript Slam Poetry

Javascript! Slam! Poetry!

View 1_outside.js
import React, { Component, PropTypes } from 'react';
class OutsideClick extends Component {
static propTypes = {
children: PropTypes.any,
onClick: PropTypes.func.isRequired,
id: PropTypes.string,
tag: PropTypes.string,
className: PropTypes.string
}
@stegrams
stegrams / move.js
Last active May 28, 2016
Lane action in LaneStore for dragging a note over a note or an empy lane instead of attachToLane. Source: http://survivejs.com/webpack_react/implementing_dnd/
View move.js
queryIds(searchIds){
let ids = [...searchIds];
return this.lanes.reduce((result, lane, laneIdx) => {
// no more ids
if(!ids.length) return result;
const notes = lane.notes;
const idsIndexOfLane = ids.indexOf(lane.id);
@rej156
rej156 / index.jsx
Created May 20, 2016
Mobx HMR ES6 stores
View index.jsx
import React from 'react'
import { render } from 'react-dom'
import { Router, browserHistory, match } from 'react-router'
import createStore from '../shared/lib/create-store.js'
import ContextProvider from '../shared/lib/context-provider.js'
import { fetchDataOnLocationMatch } from '../shared/lib/fetch-data.js'
import Root from './Root.jsx'
import routes from '../shared/routes.jsx'
import { AppContainer } from 'react-hot-loader'
import { observable, computed, autorun } from 'mobx'
View README.md

The issue:

..mobile browsers will wait approximately 300ms from the time that you tap the button to fire the click event. The reason for this is that the browser is waiting to see if you are actually performing a double tap.

(from a new defunct https://developers.google.com/mobile/articles/fast_buttons article)

touch-action CSS property can be used to disable this behaviour.

touch-action: manipulation The user agent may consider touches that begin on the element only for the purposes of scrolling and continuous zooming. Any additional behaviors supported by auto are out of scope for this specification.

You can’t perform that action at this time.