Skip to content

Instantly share code, notes, and snippets.

View emkis's full-sized avatar

Nicolas Jardim emkis

View GitHub Profile
@donaldpipowitch
donaldpipowitch / README.md
Last active February 27, 2024 15:42
Type-safe query params in React with a "Hook Builder"

Everyone loves type-safe APIs nowadays, but as far as I can tell query parameters are a blind spot to most people right now.

I create a hook which uses a builder pattern a while ago, which allows you to create type-safe query parameters. It is not very polished and contains some specific use cases, that's why I hesitated to share it. But as I successfully use it for a couple of month already and (afaik) no one came up with something similar so far, I wanted to share it.

How does it look like?

import * as pp from './page-params';

type FavoriteFood = 'pizza' | 'noodles' | 'wraps' | 'hot-dogs';
function is(type = '', value) {
const toStringResult = Object.prototype.toString.call(value)
.toLowerCase()
.replace(/[\[\]']/g, "")
.split(" ")[1];
return type === toStringResult;
}
@kentcdodds
kentcdodds / package.json
Last active April 30, 2024 05:39
setup script for my workshops
{
"name": "workshop-setup",
"version": "1.0.0",
"description": "This is the common setup script for most of my workshops",
"bin": "./setup.js"
}
Seven different types of CSS attribute selectors
// This attribute exists on the element
[value]
// This attribute has a specific value of cool
[value='cool']
// This attribute value contains the word cool somewhere in it
[value*='cool']
@stevekinney
stevekinney / electron-fem-v2.md
Last active November 6, 2023 12:25
Frontend Masters: Electron Workshop (December, 2018)

Frontend Masters: Electron (Version 2)

You'll need a recent version of Node.js installed on your computer with administrative access. Yarn is not required, but Electron Forge uses it, so it would be helpful to install beforehand.

Please make sure you're using a supported platform. This is particularly important if you're running Linux.

Important note: If you're using Windows, make sure you're not using the Windows Subsystem for Linux. This will confuse Electron to thinking you're running on a Linux machine when you're really not.

We'll be using working through the following repositories over the course of the workshop:

@virolea
virolea / upload.js
Last active March 15, 2024 13:45
Tracking file upload progress using axios
upload(files) {
const config = {
onUploadProgress: function(progressEvent) {
var percentCompleted = Math.round((progressEvent.loaded * 100) / progressEvent.total)
console.log(percentCompleted)
}
}
let data = new FormData()
data.append('file', files[0])
@scriptex
scriptex / rename.js
Last active April 10, 2023 23:30
Rename all files in a folder with NodeJS
const { join } = require('path');
const { readdirSync, renameSync } = require('fs');
const [dir, search, replace] = process.argv.slice(2);
const match = RegExp(search, 'g');
const files = readdirSync(dir);
files
.filter(file => file.match(match))
.forEach(file => {
const filePath = join(dir, file);
@Atinux
Atinux / async-foreach.js
Last active October 10, 2023 03:04
JavaScript: async/await with forEach()
const waitFor = (ms) => new Promise(r => setTimeout(r, ms))
const asyncForEach = async (array, callback) => {
for (let index = 0; index < array.length; index++) {
await callback(array[index], index, array)
}
}
const start = async () => {
await asyncForEach([1, 2, 3], async (num) => {
await waitFor(50)
@joshbuchea
joshbuchea / semantic-commit-messages.md
Last active May 7, 2024 01:27
Semantic Commit Messages

Semantic Commit Messages

See how a minor change to your commit message style can make you a better programmer.

Format: <type>(<scope>): <subject>

<scope> is optional

Example

@rxaviers
rxaviers / gist:7360908
Last active May 6, 2024 17:53
Complete list of github markdown emoji markup

People

:bowtie: :bowtie: 😄 :smile: 😆 :laughing:
😊 :blush: 😃 :smiley: ☺️ :relaxed:
😏 :smirk: 😍 :heart_eyes: 😘 :kissing_heart:
😚 :kissing_closed_eyes: 😳 :flushed: 😌 :relieved:
😆 :satisfied: 😁 :grin: 😉 :wink:
😜 :stuck_out_tongue_winking_eye: 😝 :stuck_out_tongue_closed_eyes: 😀 :grinning:
😗 :kissing: 😙 :kissing_smiling_eyes: 😛 :stuck_out_tongue: