Skip to content

Instantly share code, notes, and snippets.

View ejangi's full-sized avatar
😎
Totally addicted to Docker.

James ejangi

😎
Totally addicted to Docker.
View GitHub Profile
// https://www.amd.com/en/support/linux-drivers
// In order to have visualping detect the Ubuntu version change, we first need VisualPing to expand all the <details> elements:
document.querySelectorAll('details.os-group').forEach((el) => { el.setAttribute('open', true) });
curl \
--header "Content-Type: application/json" \
--header "Authorization: Bearer abc123" \
--request POST \
--data '{"username":"xyz","password":"xyz"}' \
http://localhost:3000/api/myendpoint
select {
appearance: none;
width: 100%;
transition-property: background, color, padding, margin;
transition-duration: 150ms;
outline-width: 0.125rem;
outline-style: solid;
outline-color: transparent;
outline-offset: 0.125rem;
}
/*
// Usage:
<button id="counter" type="button"></button>
import { setupCounter } from './counter.js'
setupCounter(document.querySelector('#counter'))
*/
export function setupCounter(element) {
.fluid-type {
font-size: clamp(1rem, 4cqi, 3rem);
}
// Using a reducer allows you to control field validation etc
// without having a million useState(); calls and logic spanning across multiple functions.
import { useReducer } from "react";
function EditCalendarEvent() {
const [event, updateEvent] = useReducer(
(prev, next) => {
const newEvent = { ...prev, ...next };
<script runat="server">
// You can POST to this endpoint in order to quickly subscribe someone to a Data Extension.
// The request body expects a JSON object with a property labelled "de" that uses the Marketing Cloud
// Data Extension ID (e.g. 6ded84cc-9fbf-4ec5-83e3-06cc82fb380a)
// The rest of the JSON object is just key/value pairs for each field name and field value.
//
// Example:
// POST /subscribe
// {"de":"6ded84cc-9fbf-4ec5-83e3-06cc82fb380a","FirstName": "Joe","LastName":"Bloggs","Email":"joe@bloggs.com"}
// 1) Use the Cloudlflare Pages/Github integration to build everytime there is a push to the main branch.
// 2) In github settings for the repo, create a new webhook that only triggers on "Check runs".
@ejangi
ejangi / react-complex-forms.js
Created June 25, 2021 22:42
How to deal with large form state in a React app.
import * as React from "react";
import { render } from "react-dom";
import produce from "immer";
import { set, has } from "lodash";
import "./styles.css";
function enhancedReducer(state, updateArg) {
// check if the type of update argument is a callback function
if (updateArg.constructor === Function) {
@ejangi
ejangi / modal.js
Created June 24, 2021 23:38
An example of exposing component methods to parent component in React and Next JS
import { useState, useRef, useEffect, forwardRef, useImperativeHandle } from 'react';
import Button from '@material-ui/core/Button';
import Dialog from '@material-ui/core/Dialog';
import DialogActions from '@material-ui/core/DialogActions';
import DialogContent from '@material-ui/core/DialogContent';
import DialogContentText from '@material-ui/core/DialogContentText';
import DialogTitle from '@material-ui/core/DialogTitle';
/*
USAGE: