Skip to content

Instantly share code, notes, and snippets.

View mramirid's full-sized avatar

Amir Muhammad Hakim mramirid

View GitHub Profile
@MidSpike
MidSpike / readme.md
Last active February 5, 2024 18:09
CVE-2022-23812 | RIAEvangelist/node-ipc is malware / protest-ware
@rmorse
rmorse / react-router-dom-v.6.02.prompt.blocker.js
Last active December 21, 2023 04:22
Adds back in `useBlocker` and `usePrompt` to `react-router-dom` version 6.0.2 (they removed after the 6.0.0 beta, temporarily)
/**
* These hooks re-implement the now removed useBlocker and usePrompt hooks in 'react-router-dom'.
* Thanks for the idea @piecyk https://github.com/remix-run/react-router/issues/8139#issuecomment-953816315
* Source: https://github.com/remix-run/react-router/commit/256cad70d3fd4500b1abcfea66f3ee622fb90874#diff-b60f1a2d4276b2a605c05e19816634111de2e8a4186fe9dd7de8e344b65ed4d3L344-L381
*/
import { useContext, useEffect, useCallback } from 'react';
import { UNSAFE_NavigationContext as NavigationContext } from 'react-router-dom';
/**
* Blocks all navigation attempts. This is useful for preventing the page from
* changing until some condition is met, like saving form data.
@mjackson
mjackson / redirects-in-react-router-v6.md
Last active November 12, 2023 07:32
Notes on handling redirects in React Router v6, including a detailed explanation of how this improves on what we used to do in v4/5

Redirects in React Router v6

An important part of "routing" is handling redirects. Redirects usually happen when you want to preserve an old link and send all the traffic bound for that destination to some new URL so you don't end up with broken links.

The way we recommend handling redirects has changed in React Router v6. This document explains why.

Background

In React Router v4/5 (they have the same API, you can read about why we had to bump the major version here) we had a <Redirect> component that you could use to tell the router when to automatically redirect to another URL. You might have used it like this:

@joepie91
joepie91 / es-modules-are-terrible-actually.md
Last active May 19, 2024 12:14
ES Modules are terrible, actually

ES Modules are terrible, actually

This post was adapted from an earlier Twitter thread.

It's incredible how many collective developer hours have been wasted on pushing through the turd that is ES Modules (often mistakenly called "ES6 Modules"). Causing a big ecosystem divide and massive tooling support issues, for... well, no reason, really. There are no actual advantages to it. At all.

It looks shiny and new and some libraries use it in their documentation without any explanation, so people assume that it's the new thing that must be used. And then I end up having to explain to them why, unlike CommonJS, it doesn't actually work everywhere yet, and may never do so. For example, you can't import ESM modules from a CommonJS file! (Update: I've released a module that works around this issue.)

And then there's Rollup, which apparently requires ESM to be u

@fzn0x
fzn0x / numberToWordsID.php
Last active May 10, 2021 09:47
PHP Programming Number To Words - Indonesia
/**
*
* (C) 2020 Muhammad Fauzan
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
@claus
claus / _app.js
Created May 14, 2020 05:35
Restore scroll position after navigating via browser back/forward buttons in Next.js
import useScrollRestoration from "utils/hooks/useScrollRestoration";
const App = ({ Component, pageProps, router }) => {
useScrollRestoration(router);
return <Component {...pageProps} />;
};
export default App;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
var seeder = require('mongoose-seed');
var mongoose = require('mongoose');
// Connect to MongoDB via Mongoose
seeder.connect('mongodb://127.0.0.1:27017/db_staycation', {
useNewUrlParser: true,
useCreateIndex: true,
useFindAndModify: true,
useUnifiedTopology: true
}, function () {
@slikts
slikts / react-memo-children.md
Last active May 17, 2024 16:39
Why using the `children` prop makes `React.memo()` not work

nelabs.dev

Why using the children prop makes React.memo() not work

I've recently ran into a pitfall of [React.memo()][memo] that seems generally overlooked; skimming over the top results in Google just finds it mentioned in passing in a [React issue][regit], but not in the [FAQ] or API [overview][react-api], and not in the articles that set out to explain React.memo() (at least the ones I looked at). The issue is specifically that nesting children defeats memoization, unless the children are just plain text. To give a simplified code example:

const Memoized = React.memo(({ children }) => (<div>{children}</div>));
// Won't ever re-render
<Memoized>bar</Memoized>
// Will re-render every time; the memoization does nothing
@collardeau
collardeau / demo.svelte
Last active September 8, 2023 16:59
Svelte: SweetAlert2 setup
<script>
import Swal from "sweetalert2";
// npm i sweetalert2@9.7.2
// https://sweetalert2.github.io/
</script>
<!-- a simple alert -->
<button
on:click={() => {
Swal.fire('hello sweet alert');