Skip to content

Instantly share code, notes, and snippets.


Roger Qiu CMCDragonkai

View GitHub Profile
CMCDragonkai /
Last active Feb 18, 2021
Flexbox Sidebar with Overflowing Grid Items #css #flexbox #grid

Flexbox Sidebar with Overflowing Grid Items

Most flexbox layouts work by using the intrinsic sizing.

This means the sizes of boxes are determined by the size of the contents.

This is usually a good thing because you want your layout to stretch to the content, but also to the available space.

This makes layouts "flexible".

CMCDragonkai / async.js
Created Feb 4, 2021
Synchronous and Asynchronous Node.js Scripts #nodejs #javascript
View async.js
#!/usr/bin/env node
import process from 'process';
async function main(argv = process.argv): Promise<number> {
process.exitCode = 0;
return process.exitCode;
if (require.main === module) {
CMCDragonkai /
Created Jan 21, 2021
Python AsyncIO with Multithreading and Multiprocessing #python
import time
import asyncio
import logging
import uvloop
import aiojobs.aiohttp
import sys
from aiohttp import web
import aioprocessing
import concurrent.futures
CMCDragonkai /
Last active Jan 1, 2021
Combine Discounts #python

How to Combine Discounts

Suppose you have $1000 dollars, and you are applying 40% discount first, then 42% discount second.

What is the total discount?

1000 - 0.4*1000 - (0.42 * (1000 - 0.4*1000)) = 348
I - D1*I - (D2 * (I - D2*I)) = O
I - D1*I - D2*I + D1*D2*I = O
CMCDragonkai / Ref.vue
Last active Dec 23, 2020
Vue 3 Reactivity #vue
View Ref.vue
<button @click="counter += 1">{{ counter }}</button>
<script lang="ts">
import { defineComponent, ref } from 'vue';
export default defineComponent({
setup () {
// by using ref, the counter becomes a proxy
CMCDragonkai /
Created Dec 22, 2020
Rebasing a Feature Branch on Master Branch without Switching Branches #git
#!/usr/bin/env sh
git fetch origin master:master
CMCDragonkai /
Last active Dec 16, 2020
Adding a new disk ZFS RAID-0 #zfs

Adding a new disk ZFS RAID-0

When adding a new disk to ZFS RAID-0, you must ensure that the disk has the same storage size as the other disks.

You will need the gptfdisk package to use sgdisk.

zpool labelclear -f "$hdd" || true
sgdisk --zap-all "$hdd"
CMCDragonkai / function_type_signature_declarations_in_typescript.ts
Last active Dec 10, 2020
Function Type Signature Declarations in TypeScript #typescript
View function_type_signature_declarations_in_typescript.ts
// there are several ways to declare function types
// these are "first-order" functions
// normal function declaration
function f1 (i: number): number {
return i + 1;
// this relies on inference
const f2 = (i: number) => i + 1;
CMCDragonkai / machine.js
Last active Oct 21, 2020
Backup Restore Machine
View machine.js
const canBackup = (context, event) => {
return !context.backupLock
const canRestore = (context, event) => {
return !context.restoreLock
const backupMachine = Machine(