Skip to content

Instantly share code, notes, and snippets.

import {
useEffect,
useState,
useContext,
createContext,
FunctionComponent,
} from "react";
import { firebase } from "./initFirebase";
const AuthContext = createContext({
// Instantiate
const map = new Map([
[1, "one"],
[2, "two"],
]);
const obj = {
1: "one",
2: "two",
@leighhalliday
leighhalliday / recursion.js
Created April 20, 2021 19:47
Recursion in JS
// Recursion fundamentals: Counting down.
function countDown(num) {
console.log(num);
if (num > 1) {
countDown(num - 1);
}
}
countDown(5);
@leighhalliday
leighhalliday / map.js
Last active February 4, 2021 12:22
Minimal Mapbox
import { useState } from "react";
import ReactMapGL from "react-map-gl";
import "mapbox-gl/dist/mapbox-gl.css";
export default function Home() {
const [viewport, setViewport] = useState({
latitude: 43,
longitude: -79,
zoom: 8,
});
@leighhalliday
leighhalliday / challenge.md
Last active September 18, 2020 20:18
FlipGive Challenge

FlipGive Challenge

Using the GitHub GraphQL API, please use the GraphQL query below to find and display a list of repositories for the organization of your choosing.

This should be done within React, but you are welcome to use any React framework (Create React App, Next.js, Gatsby, React Native, etc...) you'd like, any way to query the data (Apollo Client, urql, React Query, etc...), and any UI framework to display it nicely. It is a very open ended challenge!

We would like to see a solution within 48 hours after receiving this challenge.

{
This file has been truncated, but you can view the full file.
@leighhalliday
leighhalliday / context.jsx
Created February 19, 2020 13:42
React Context Rendering Demo
import React from "react";
const MyContext = React.createContext();
const MyProvider = ({ children }) => {
const [theme, setTheme] = React.useState("light");
const nextTheme = theme === "light" ? "dark" : "light";
const value = {
theme,
@leighhalliday
leighhalliday / machine.js
Last active September 2, 2019 21:27
Generated by XState Viz: https://xstate.js.org/viz
const videoMachine = Machine({
id: "video",
initial: "loading",
context: {
video: null,
duration: 0,
elapsed: 0
},
import React, { useState, useEffect } from "react";
import {
withGoogleMap,
withScriptjs,
GoogleMap,
Marker,
InfoWindow
} from "react-google-maps";
import * as parkData from "./data/skateboard-parks.json";
import mapStyles from "./mapStyles";
const authLink = setContext((_, oldContext) => {
  return produce(oldContext, draft => {
    if (!draft.headers) {
      draft.headers = {};
    }
    draft.headers["X-SOURCE"] = "browser";
    const token = cookie.get("token");
    if (token) {
 draft.headers["Authorization"] = `bearer ${token}`;