Skip to content

Instantly share code, notes, and snippets.

View dannykeane's full-sized avatar

Danny dannykeane

View GitHub Profile
@koenbok
koenbok / store.ts
Last active November 10, 2023 00:17
import * as React from "react";
/**
A hook to simply use state between components
Warning: this only works with function components (like any hook)
Usage:
// You can put this in an central file and import it too
const useStore = createStore({ count: 0 })
@gaearon
gaearon / MyResponsiveComponent.js
Created November 1, 2018 10:05
Examples from "Making Sense of React Hooks"
function MyResponsiveComponent() {
const width = useWindowWidth(); // Our custom Hook
return (
<p>Window width is {width}</p>
);
}
@andrewserong
andrewserong / VideoPlayer.jsx
Created October 19, 2017 05:47
An example Video JS component in React, based on the Video JS docs
import React from 'react';
import videojs from 'video.js';
import 'video.js/dist/video-js.css';
// video.js player from the docs: https://github.com/videojs/video.js/blob/master/docs/guides/react.md
class VideoPlayer extends React.Component {
componentDidMount() {
// instantiate Video.js
this.player = videojs(this.videoNode, this.props, function onPlayerReady() {
@chantastic
chantastic / on-jsx.markdown
Last active September 17, 2024 16:40
JSX, a year in

Hi Nicholas,

I saw you tweet about JSX yesterday. It seemed like the discussion devolved pretty quickly but I wanted to share our experience over the last year. I understand your concerns. I've made similar remarks about JSX. When we started using it Planning Center, I led the charge to write React without it. I don't imagine I'd have much to say that you haven't considered but, if it's helpful, here's a pattern that changed my opinion:

The idea that "React is the V in MVC" is disingenuous. It's a good pitch but, for many of us, it feels like in invitation to repeat our history of coupled views. In practice, React is the V and the C. Dan Abramov describes the division as Smart and Dumb Components. At our office, we call them stateless and container components (view-controllers if we're Flux). The idea is pretty simple: components can't