- Floting UI - For Toasts, Tooltips, Popups etc.,
- Email clients are notoriously bad at rendering html and css. There's about 20 different versions of email clients that will all render your email differently. You can check out https://www.campaignmonitor.com/css/ for an overview of what's supported.If you want to test your templates before sending them you can check out https://www.litmus.com/email-testing/
- React flow for Interactive chain / flows as flow diagrams - Thanks to EvokeMe
- Libraries recommended for Drag-n-Drop - By Theo Ping
- dnd-kit
- useGesture Source - https://youtu.be/ieNQ9kuN3dU
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
myFunc(myVar){ | |
return function(event){... do stuff} | |
} | |
// or | |
const myFunc = (myVar) => (event) => {...do stuff} | |
// in child |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
To be specific, currentValue is the value the state had last time the component rendered. It isn't under any obligation to keep "up to date," because you want to start a new render when that happens. It's sort of like taking a blurry photograph vs a crisp clear one. Trying to render your component with a "always up to date" state would cause a blurry photo, because the state would be different by the time you got to the bottom of the render than it was at the top. Instead, the entire render shows you the same state from top to bottom, just like a clear photo | |
This is essentially one of the problems with class components vs functional components; the class architecture encouraged devs to "take blurry photos" all the time |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const array = [1, 2, 3, 4, 5, 6, 7, 8, 9]; | |
const filters = [(item) => item > 4, (item) => item !== 6]; | |
const filtered = array.reduce((acc, cur) => { | |
if(filters.every(filter => filter(cur))) return acc.concat(cur); | |
return acc; | |
}, []); | |
ref -> https://discordapp.com/channels/102860784329052160/565213527673929729/1004072869250203658 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// TODO: define polyfill for `Object.is(..)` | |
// my solution 😛 | |
if (!Object.is || true) { | |
Object.is = function ObjectIs(p1, p2) { | |
if (Number.isNaN(p1) && Number.isNaN(p2)) { | |
return true; | |
} else if (2 / p1 === -Infinity || 2 / p2 === -Infinity) { | |
if (2 / p1 === -Infinity && 2 / p2 === -Infinity) { | |
return true; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
https://codesandbox.io/s/nameless-resonance-m3r1yj?file=/src/App.js |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
window.addEventListener('storage',(e)=>{ | |
if(e.key === 'totalQty'){ | |
const totalQty = localStorage.getItem('totalQty'); | |
if([null,"null","undefined",undefined,'0',0].includes(totalQty)){ | |
// Hide here 🤣 | |
} | |
} | |
}) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!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.0" /> | |
<title>Video YT</title> | |
<style> | |
* { | |
margin: 0; |
NewerOlder