Skip to content

Instantly share code, notes, and snippets.

View bmcmahen's full-sized avatar
😈

Ben McMahen bmcmahen

😈
View GitHub Profile
@bmcmahen
bmcmahen / useDeferredMount.js
Last active February 1, 2020 16:24
Deferred mounting hook
import { useState, useEffect } from 'react';
function useDeferredMount() {
const [shouldMount, setShouldMount] = useState(false);
useEffect(() => {
window.requestAnimationFrame(() => {
window.requestAnimationFrame(() => {
setShouldMount(true);
});
@bmcmahen
bmcmahen / useDeferredMount
Created January 24, 2020 00:02
useDeferredMount
import { useState, useEffect } from 'react';
function useDeferredMount() {
const [shouldMount, setShouldMount] = useState(false);
useEffect(() => {
window.requestAnimationFrame(() => {
window.requestAnimationFrame(() => {
setShouldMount(true);
});
@bmcmahen
bmcmahen / gist:02269d7426d72927e274
Created August 13, 2015 18:10
Notes about relay, by facebook

Fragments vs Queries

Fragments are differentiated from queries insofar as they describe generic attributes of a certain type. If you are making a profile component, you will attach a fragment to that component describing the type of user fields that are needed, and how that data object should look. A query exists on the top of the component tree, and is closely associated with routes. You will have a route that provides a user id (probably from the browser url). This is passed as an argument to the query, and then the query includes the sub-fragments. This will then shape all of the data for you automatigically.

# Note: if you want to run multiple meteor apps on the same server,
# make sure to define a separate port for each.
# Upstreams
upstream gentlenode {
server 127.0.0.1:58080;
}
# HTTP Server
server {
@bmcmahen
bmcmahen / component application structure
Created December 30, 2013 19:38
Building an application with Components
## Philosophy
As web applications become increasingly large and complex, we inevitably need tools to manage our client-side code. Instead of writing one huge script file, we want to be able to split up our code into multiple, distinct moudles. We want to encourage code-reuse, and be able to easily import and add various dependencies to our projects -- wehther a UI-component like a dropdown-menu, or a DOM manipulation libary like jQuery. And it's not just Javascript that we want to organize -- it's also the css, html templates, fonts, images, and other static resources that are part of any web application. Component provides a mechanism to do all of the above:
-- organize your application around multiple, discrete modules
-- easily import modules that others have published, to be used as dependencies.
-- automatically combine all of your modules into a single javascript and css file for use at runtime.
## Structuring your application