Skip to content

Instantly share code, notes, and snippets.

@wosephjeber
wosephjeber / getAllColors.js
Created Oct 15, 2020
Quick and dirty function for scraping colors from web page
View getAllColors.js
function getAllColors() {
const COLOR_CONTAINING_PROPERTIES = ["backgroundColor", "borderTopColor", "borderRightColor", "borderLeftColor", "borderBottomColor", "color"]
let colors = []
let elements = document.querySelectorAll('*')
elements.forEach(element => {
const styles = window.getComputedStyle(element)
COLOR_CONTAINING_PROPERTIES.forEach(property => {
@wosephjeber
wosephjeber / instructions.md
Last active Jun 26, 2020
Inspecting Chrome extension interfaces with React DevTools
View instructions.md

Inspecting Chrome extension interfaces with React DevTools

Chrome does not allow extensions to modify other extensions, so React DevTools are not available in the Chrome DevTools interface when inspecting a Chrome extension interface. The React team has provided a standalone app that can be connected manually, but it requires some setup. The React DevTools readme includes some instructions, but they leave out an important step if you're debugging within a Chrome extension.

Here's an overview of how to set this up locally for an extension:

Run the standalone React DevTools app

The easiest way to start the standalone app is:

@wosephjeber
wosephjeber / instructions.md
Last active Feb 24, 2021
Ecto migration for renaming table with indexes and constraints
View instructions.md

Renaming table in Ecto migration

I recently wanted to rename a model and its postgres table in a Phoenix app. Renaming the table was simple and documented, but the table also had constraints, sequences, and indexes that needed to be updated in order for the Ecto model to be able to rely on default naming conventions. I couldn't find any examples of what this would look like but was eventually able to figure it out. For anyone else in the same situation, hopefully this example helps.

In the example below, I'm renaming the Permission model to Membership. This model belongs to a User and an Account, so it has foreign key constraints that need to be renamed.

defmodule MyApp.Repo.Migrations.RenamePermissionsToMemberships do
  use Ecto.Migration
@wosephjeber
wosephjeber / upgrade_postgres
Last active Nov 26, 2020
Upgrade from postgres 9.6.2 to 10.5 on OSX
View upgrade_postgres
## Following these commands should upgrade and migrate your existing database.
## This is an example of going from 9.6.2 to 10.5 on OSX.
## Be sure to update any version numbers based on the versions you're upgrading from and to.
## Adapted from https://stackoverflow.com/questions/24379373/how-to-upgrade-postgresql-from-version-9-6-to-version-10-1-without-losing-data
## Backup your database, just in case (replace databasename with your actual DB name)
pg_dump databasename > ~/Desktop/dev_dump
## Stop postgres
@wosephjeber
wosephjeber / git_revision.js
Last active Aug 12, 2019
Get branch and commit names from Node (synchronously)
View git_revision.js
const { execSync } = require('child_process');
function executeGitCommand(command) {
return execSync(command)
.toString('utf8')
.replace(/[\n\r\s]+$/, '');
}
const BRANCH = executeGitCommand('git rev-parse --abbrev-ref HEAD');
const COMMIT_SHA = executeGitCommand('git rev-parse HEAD');
@wosephjeber
wosephjeber / name_form.jsx
Last active Oct 6, 2019
Render Props vs Higher Order Components
View name_form.jsx
import React, { Component } from 'react'
import PropTypes from 'prop-types'
class NameForm extends Component {
constructor() {
super()
this.state = { value: '' }
}
@wosephjeber
wosephjeber / find_and_kill_process.sh
Last active Sep 3, 2020
Find and kill ruby process using specified port
View find_and_kill_process.sh
# Puma occasionally doesn't kill all ruby processes when
# I shut down my local web server. Here are the steps
# to find and kill the processes.
# Find pid of process running on specified port
lsof -i :3000
# Kill process
sudo kill -9 [pid]
@wosephjeber
wosephjeber / ngrok-installation.md
Last active Mar 30, 2021
Installing ngrok on Mac
View ngrok-installation.md

Installing ngrok on OSX

For Homebrew v2.6.x and below:

brew cask install ngrok

For Homebrew v2.7.x and above:

@wosephjeber
wosephjeber / local_modx_setup.md
Last active May 9, 2018
Instructions for setting up a local copy of our MODX installation
View local_modx_setup.md

Here's an outline of the instructions for creating a local dev copy of our MODX installation:

####1. Package and download files from server You'll want to tar and gzip the files on the server for two reasons. First and foremost, it will be faster when you download the files via FTP. Downloading one 100mb file is significantly faster than downloading one hundred 1mb files. Secondly, we want to avoid the potential of messing with hidden files and permissions/ownership.

Use the tar command with gzip enabled: tar -czvf path_to_target path_to_source. For example, to package up the assets directory, you might run tar -czvf backup/assets.tar.gz assets/. This will package and compress the assets directory and save it as a .tar.gz file in the backup directory. You can then download that file via Transmit or another FTP client.

####2. Dump production database and import to local database Use Sequel Pro to export the production database and import it locally. You can name the local database whatever you'd

@wosephjeber
wosephjeber / add_user.sh
Last active Mar 31, 2018
Giving new users SSH access
View add_user.sh
# 1. Start by ssh-ing into the server
ssh opportunity.org # or whatever server you need to access
# 2. Once in the server add a user with whatever username you'd like. You must use the sudo command unless you're logged in as root.
sudo adduser {username}
sudo adduser {username} sudo # to add user to sudo group
# 3. Change into the new users directory. /home contains all the users on the system.
cd /home/{username}