Skip to content

Instantly share code, notes, and snippets.

View janpaepke's full-sized avatar

Jan Paepke janpaepke

424 followers · 5 following
View GitHub Profile
@janpaepke
janpaepke / useEffect_simplified_event.js
Last active July 4, 2022 10:17
useEffect(() => reversibleEvent(window, 'click', () => alert('clicked!')), []);
@janpaepke
janpaepke / reversibleEvent.js
Created July 4, 2022 10:12
export const reversibleEvent = (target, listener, callback) => {
target.addEventListener(listener, callback);
return () => target.removeEventListener(listener, callback);
};
@janpaepke
janpaepke / useEffect_simplified.js
Last active July 4, 2022 10:37
useEffect(() => {
const cleanup = reversibleTimeout(() => alert('one second has passed!'), 1000);
return cleanup;
}, []);
// which we can simplify further to ⬇
useEffect(() => reversibleTimeout(() => alert('one second has passed!'), 1000), []);
@janpaepke
janpaepke / reversibleTimeout.js
Created July 4, 2022 09:57
export const reversibleTimeout = (callback, ms) => {
const timeoutId = setTimeout(callback, ms);
return () => clearTimeout(timeoutId);
};
@janpaepke
janpaepke / useEffect_click.js
Created July 4, 2022 09:50
useEffect(() => {
const myCallback = () => {
alert('clicked!');
};
window.addEventListener('click', myCallback);
return () => {
window.removeEventListener('click', myCallback);
};
}, []);
@janpaepke
janpaepke / useEffect_cleanup.js
Created July 4, 2022 09:47
useEffect(() => {
const timeoutId = setTimeout(() => alert('one second has passed!'), 1000);
return () => {
clearTimeout(timeoutId);
};
}, []);
@janpaepke
janpaepke / simple_useEffect.js
Last active July 4, 2022 09:42
useEffect(() => {
setTimeout(() => alert('one second has passed!'), 1000);
}, []);