François Georgy francoisgeorgy

I like guitars, synths, electronics and writing software.

francoisgeorgy / react_func_comp.ts

Created September 2, 2020 15:35

#react #typescript functionnal component definition

	interface WelcomeProps {
	name: string;
	}

	const Welcome: React.FC<WelcomeProps> = (props) => <h1>Hello, {props.name}</h1>;

francoisgeorgy / .eleventy.config.js

Last active December 2, 2023 14:31 — forked from danielpost/.eleventy.config.js

Eleventy: Purge CSS for each html file #11ty

	const { PurgeCSS } = require('purgecss');

	/**
	* Remove any CSS not used on the page and inline the remaining CSS in the
	* <head>.
	*
	* @see {@link https://github.com/FullHuman/purgecss}
	*/
	eleventyConfig.addTransform('purge-and-inline-css', async (content, outputPath) => {
	if (process.env.ELEVENTY_ENV !== 'production' \|\| !outputPath.endsWith('.html')) {

francoisgeorgy / git-untrack

Last active July 31, 2020 12:20

#git remove a folder from git

	# 1. Add the folder path to the repo's root .gitignore file:

	dist/

	# 2. Remove the folder from the local git tracking, but keep it on your disk:

	git rm -r --cached dist/

	# 3. Push the changes to the git repo

francoisgeorgy / ResizablePanel.tsx

Last active June 7, 2020 06:50

#React resizable panel #typescript

	import React, {FunctionComponent, useEffect, useRef, useState} from "react";
	import "./ResizablePanel.css";

	// ResizablePanel.css:
	/*
	.resizable-panel {
	display: flex;
	justify-content: space-between;
	}

francoisgeorgy / tonal-cookbook.js

Created June 7, 2020 06:27

tonal cookbook #tonal #music #javascript

	// https://github.com/tonaljs/tonal/issues/108

	// To obtain the scale properties, use the scale function:

	import { scale } from "@tonaljs/scale"
	scale("G aeolian").notes // => ["G", "A", "Bb", ... ]

	// To obtain the chords, use the scaleChords function from the same package:

	import { scaleChords } from "@tonaljs/scale"

francoisgeorgy / system-font-stack.css

Created May 2, 2020 15:12

system font stack #css

	/* https://css-tricks.com/snippets/css/system-font-stack/ */

	/* System Fonts as used by GitHub */
	body {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	}

	/* System Fonts as used by Medium and WordPress */
	body {
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;

francoisgeorgy / responsive-css-grid.css

Created May 2, 2020 07:12

responsive #css #gridgrid layout

	/*
	AUTO GRID
	Set the minimum item size with `--auto-grid-min-size` and you'll
	get a fully responsive grid with no media queries.
	*/

	.auto-grid > * {
	max-width: 25rem;
	margin-left: auto;
	margin-right: auto;

francoisgeorgy / usestate-with-typescript.ts

Created April 17, 2020 06:43

#react useState with #typescript

	// empty initial state

	const [pill, setPill] = useState<'red' \| 'blue'>();

	// JSX: {pill && <span>You chose {pill.toUpperCase()} pill!</span>}

	// clearable state

	export const PillSelector: React.FunctionComponent = () => {
	const [pill, setPill] = useState<'blue' \| 'red' \| undefined>('blue'); // <--

francoisgeorgy / react-loop.jsx

Last active April 13, 2020 16:18

loop in #react #jsx

francoisgeorgy / dump-session.java

Created March 25, 2020 07:51

dump session in Java


	private void dumpSession(HttpSession session) {
	for (Enumeration e = session.getAttributeNames(); e.hasMoreElements();) {
	String name = (String)e.nextElement();
	LOG.debug("session: {}={}", name, session.getAttribute(name));
	}
	}

	dumpSession(request.getSession());