Skip to content

Instantly share code, notes, and snippets.

Avatar
🐏
Bah.

Michoel Samuels AnalyzePlatypus

🐏
Bah.
View GitHub Profile
@AnalyzePlatypus
AnalyzePlatypus / vue-click-outside.md
Last active May 27, 2022
Vue.js 2.7: Detect clicks outside an element (Close modals, popups, etc.)
View vue-click-outside.md

Detecting outside clicks in Vue.js

See this StackOverflow thread

First off, include the directive at the end of this gist.

  1. On your open button, make sure to use @click.stop to prevent the open click event from closing your modal.
  2. On your modal, add the v-click-outside directive and points it at a function to call when clicked outside.

Example:

@AnalyzePlatypus
AnalyzePlatypus / jsPDF_convert_points_to_other_units.js
Last active May 15, 2022
jsPDF helper function: Convert points to other units
View jsPDF_convert_points_to_other_units.js
function convertPointsToUnit(points, unit) {
// Unit table from https://github.com/MrRio/jsPDF/blob/ddbfc0f0250ca908f8061a72fa057116b7613e78/jspdf.js#L791
var multiplier;
switch(unit) {
case 'pt': multiplier = 1; break;
case 'mm': multiplier = 72 / 25.4; break;
case 'cm': multiplier = 72 / 2.54; break;
case 'in': multiplier = 72; break;
case 'px': multiplier = 96 / 72; break;
case 'pc': multiplier = 12; break;
@AnalyzePlatypus
AnalyzePlatypus / lambda-gmail-compose.md
Created May 13, 2020
Use serverless function to send low-volume emails without 3rd party mail services.
View lambda-gmail-compose.md

Sending email with serverless functions

You can deploy this function on any of the serverless platforms - AWS Lambda, Google Cloud Functions, Azure Functions, Netlify, Cloudflare Workers, etc.

  1. Create a new function and paste in the following code.
  2. You will need to add nodemailer to your package.json (npm i nodemailer), and follow your platform's instructions on bundling dependencies.
  3. Obtain Gmail API credentials for your account. You will need clientID, clientSecret, and refreshToken. Follow this YouTube tutorial
  4. Expose these credentials as the follwing environment variables:
GMAIL_EMAIL_ADDRESS
View tailwind-icon-heights.md

Tailwind Icon Height sizes

These CSS classes will size any square SVG to match the default TailwindCSS font sizes. Great for mixing icons with text on buttons and headings.

The icon sizes were manually picked, so they match my taste. Your mileage may vary! I've also added sizes that are larger than Tailwind's max font size for really big icons in hero sections and the like

Enjoy!

View Using (and debugging) Pre-signed S3 URLS.md

Using (and debugging) Pre-signed S3 URLS

Architecture - A Brief Overview

A Pre-signed URL is used to allow untrusted users to temporary access to private S3 resources. (Example: upload an image to a private S3 bucket).

The URL is a string consists of:

  1. AWS URL of the object to be accessed, and
  2. A signed base64 string describing the HTTP request:
View vue-sentry-code-splitting.md

Vue.js: Use Sentry.io without increasing initial bundle size

There's no questions about it: in the age of "fat" frontend clients, less bloat is better. A useful technique is to split off large libraries into separate Webpack chunks so the they don't take up space in your main bundle, delaying the initial load of your webapp. I like doing this with what I call the "installer pattern". Every split-out library gets its own "installer", an async function that loads the Webpack chunk, performs any initializations or configuration necessary, and then informs the relevant parts of your app that loading has completed.

Here's what that pattern looks like for installing the Sentry.io error reporting SDK:

First, add Sentry to your project:

@AnalyzePlatypus
AnalyzePlatypus / example-lambda-deploy.md
Last active May 12, 2021
Deploy a Node.js Lambda function using the AWS CLI
View example-lambda-deploy.md

.env file

LAMBDA_FUNCTION_NAME=MyFunction
AWS_UPLOAD_CODE_PROFILE=MY_CLI_PROFILE
SLACK_DEV_NOTIFICATIONS_WEBHOOK_URL=https://hooks.slack.com/services/****/****/****

deploy.sh file

# Read the .env file
View AmazonReferralFees.md

Amazon.com Referral Fees

Amazon's referral fees, in JSON format.

Does not contain "Categories Requiring Approval"

Last updated April 19, 2021

View CompressionTest.md

Compression Test

A quick script for testing how well a JSON file compresses

// Imports

const fs = require('fs');
const { promisify } = require('util');
const { deflate } = require('zlib');
View amazon_root_categories.md

Amazon.com Root Categories

These are the 35 root categories on Amazon.com.

Retrieved via Keepa API on April 12, 2021.

API call:

https://api.keepa.com/category?key=<REDACTED>&domain=1&category=0&parents=1