Skip to content

Instantly share code, notes, and snippets.

View gragland's full-sized avatar

Gabe Ragland gragland

View GitHub Profile
@gragland
gragland / App.jsx
Last active November 17, 2023 17:05
Next.js routing to dynamic path without hitting server
'use client'
// ⛔️ DISCLAIMER: This is most likely premature optimization and adds code complexity.
// Only use if you really need to shave off that extra 100-200ms.
function MyComponent({ data }){
return (
<a
href={`/item/${data.id}`}
onClick={(e) => {

A fix for Next.js modals (intercepted routes) not closing when navigating away with <Link> or router.push()

app
├─ @photoModal
│  ├─ (.)photo
|  |  └─ [id]
│  │  |  └─ page.tsx <----- a modal with links to home, /profile, and /login
│  └─ [...catchAll]
│ │ └─ page.tsx &lt;----- returning null here is supposed to cause modal to hide when
@gragland
gragland / use-optimistic-mutation-example.ts
Last active July 1, 2024 07:39
useOptimisticMutation for React Query. Optimistically update data in multiple locations with rollback on error.
import axios from 'axios'
import { useOptimisticMutation } from "./useOptimisticMutation.ts"
type Response = boolean
type Error = unknown
type MutationVariables = {itemId: string}
type Items = {id: string; name: string}[]
type Likes = {itemId: string}[]
type History = {type: string}[]
@roalcantara
roalcantara / cloud_firestore_security_rules_helper_functions.rules
Created March 9, 2018 01:46
Cloud Firestore Security Rules Helper Functions
service cloud.firestore {
match /databases/{database}/documents {
// USERS //
function isAuthenticated() {
return request.auth != null;
}
function userExists(uid) {
@rauchg
rauchg / README.md
Last active January 6, 2024 07:19
require-from-twitter
@conorhastings
conorhastings / simple-redux.js
Last active June 11, 2021 01:36
A very (read: don't do this) simple implementation of redux
/*
* The reason for this is just a thought exercise
* often people(myself super included) are so confused
* when trying something new, but breaking it down
* to it's simplest existence can be the best way to understand
*/
function createStore(reducer, initState) {
let state = initState;
let subscribers = [];
@netpoetica
netpoetica / Setting up Nginx on Your Local System.md
Last active May 28, 2024 15:01
Setting up Nginx on Your Local System

#Setting up Nginx on Your Local System ###by Keith Rosenberg

##Step 1 - Homebrew The first thing to do, if you're on a Mac, is to install homebrew from http://mxcl.github.io/homebrew/

The command to type into terminal to install homebrew is:

ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
@mwunsch
mwunsch / emoji_image_replace.js
Last active August 13, 2023 21:44
Detect emoji unicode on a page, replace it with images (supplied by GitHub, for now). Goes great in your ~/.js
/**
*
* Here's a thing that will look through all the text nodes of a document, and
* upon encountering an emoji codepoint, will replace it with an image.
* For now, those images are pulled from GitHub, which isn't very nice, so I
* need to find a more suitable host.
*
* Much of this code was gleaned from staring at the minified GitHub JS.
*
* Copyright (c) 2013 Mark Wunsch. Licensed under the MIT License.
@mwunsch
mwunsch / emojiToImage.js
Created December 16, 2012 01:24
Replace emoji characters in a string with an image of said emoji.
// (c) 2012 Mark Wunsch http://markwunsch.com
// MIT license.
if (!String.fromCodePoint) {
/*!
* ES6 Unicode Shims 0.1
* (c) 2012 Steven Levithan <http://slevithan.com/>
* MIT License
*/
String.fromCodePoint = function fromCodePoint () {