Skip to content

Instantly share code, notes, and snippets.

View TSMMark's full-sized avatar
🐶

Mark Allen TSMMark

🐶
View GitHub Profile
@Log1x
Log1x / README.md
Last active November 28, 2023 21:15
Uptime Robot Discord Webhook

Uptime Robot Webhook for Discord

Screenshot

Configuration

  • Alert Contact Type: Web-Hook
  • URL to Notify: https://discordapp.com/api/webhooks/CHANGEME/CHANGEME?
    • Must end with ?
@stolinski
stolinski / Example.tsx
Last active June 8, 2022 05:54
Route Transitions with Framer Motion
const FakeComponent = () => {
return (
<AnimatedRoutes exitBeforeEnter initial={false}>
<RouteTransition exact path="/some-route">
<NewUsers />
</RouteTransition>
<RouteTransition exact path="/yo" >
<Users />
</RouteTransition>
</AnimatedRoutes>
@slikts
slikts / advanced-memo.md
Last active February 25, 2025 15:19
Advanced memoization and effects in React

nelabs.dev

Advanced memoization and effects in React

Memoization is a somewhat fraught topic in the React world, meaning that it's easy to go wrong with it, for example, by [making memo() do nothing][memo-pitfall] by passing in children to a component. The general advice is to avoid memoization until the profiler tells you to optimize, but not all use cases are general, and even in the general use case you can find tricky nuances.

Discussing this topic requires some groundwork about the technical terms, and I'm placing these in once place so that it's easy to skim and skip over:

  • Memoization means caching the output based on the input; in the case of functions, it means caching the return value based on the arguments.
  • Values and references are unfortunately overloaded terms that can refer to the low-level implementation details of assignments in a language like C++, for example, or to memory
@slikts
slikts / react-memo-children.md
Last active July 6, 2025 22:26
Why using the `children` prop makes `React.memo()` not work

nelabs.dev

Why using the children prop makes React.memo() not work

I've recently ran into a pitfall of [React.memo()][memo] that seems generally overlooked; skimming over the top results in Google just finds it mentioned in passing in a [React issue][regit], but not in the [FAQ] or API [overview][react-api], and not in the articles that set out to explain React.memo() (at least the ones I looked at). The issue is specifically that nesting children defeats memoization, unless the children are just plain text. To give a simplified code example:

const Memoized = React.memo(({ children }) => (<div>{children}</div>));
// Won't ever re-render
<Memoized>bar</Memoized>
// Will re-render every time; the memoization does nothing
@mfrachet
mfrachet / react-lazy.js
Created July 26, 2019 17:41
React lazy implementation
import React from "react";
let IDS = 0;
const loaded = {};
export const lazy = modulePathResolver => {
const id = IDS++;
return props => {
const LoadedComponent = loaded[id];
@romanonthego
romanonthego / ScrollToTopControlller.js
Last active July 13, 2022 10:52
Scroll to top with react hooks
import React, { useEffect } from 'react';
import { useRouter } from 'state';
// Component that attaches scroll to top hanler on router change
// renders nothing, just attaches side effects
export const ScrollToTopControlller = () => {
// this assumes that current router state is accessed via hook
// but it does not matter, pathname and search (or that ever) may come from props, context, etc.
const { pathname, search } = useRouter();
@prestia
prestia / installing_MTGA_on_macOS_with_Retina_support.md
Last active October 13, 2023 23:22
Instructions on how to install Magic the Gathering Arena on macOS with Retina support.

Installing MTGA on macOS using Wine, and making it look pretty!

The following instructions are heavily inspired by /u/uhohohdear. I modified uhohohdear's instructions and then added support for Retina/HiDPI displays and instructions about how to update MTGA.

IMPORTANT UPDATE: This will no longer work if you upgrade to macOS Catalina, as Wine and Wineskin are 32-bit. I'll update this Gist with 64-bit versions when they become available.

We're back in business!

It appears that the workarounds no longer work. A few people with Macs using Nvidia graphics cards are having success, but Macs with Intel and AMD GPUs crash regularly. At this time, the best way to play Arena on Mac is via Boot Camp or GeForce Now.

@mohanpedala
mohanpedala / bash_strict_mode.md
Last active September 22, 2025 11:03
set -e, -u, -o, -x pipefail explanation
@posquit0
posquit0 / pre-commit
Last active October 10, 2023 13:39
Git Pre Commit Hook for ESLint and Jest
#!/usr/bin/env bash
STAGED_FILES=$(git diff --cached --name-only --diff-filter=ACM | grep '\.jsx\?$')
BIN_PATH="$(git rev-parse --show-toplevel)/node_modules/.bin"
eslint() {
ESLINT="$BIN_PATH/eslint"
# Check for eslint
@pierrejoubert73
pierrejoubert73 / markdown-details-collapsible.md
Last active September 21, 2025 22:17
How to add a collapsible section in markdown.

How to add a collapsible section in markdown

1. Example

Click me

Heading

  1. Foo
  2. Bar
    • Baz
  • Qux