- skeleton-screens-concept - A Skeleton Screens implementation for SPA first load in CSS
- overflow-color - Automatically switch css html background color to bring a smooth user experience
- semantic.css - Classless CSS framework for building quick semantic HTML pages prototypes
- use-mouse-action - React Hooks to listen to both mouse down or up and click events with a once called function
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
temp1.textContent.replace(/\u200c/g, ''); |
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
import { useRef, useEffect, EffectCallback, DependencyList } from 'react'; | |
/** | |
* @param {EffectCallback} effect | |
* @param {DependencyList} [deps] | |
*/ | |
export const useEffectNotFirst = (effect, deps) => { | |
const firstUpdate = useRef(true); | |
useEffect(() => { |
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
artdiniz.quitcontrol-vscode | |
atlassian.atlascode | |
attilabuti.vscode-mjml | |
bierner.comment-tagged-templates | |
cardinal90.multi-cursor-case-preserve | |
christian-kohler.npm-intellisense | |
chrmarti.regex | |
cssho.vscode-svgviewer | |
davidanson.vscode-markdownlint | |
dbaeumer.vscode-eslint |
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 speedRate = 2; | |
const subtitles = document.querySelector('.player-timedtext'); | |
let observer = new MutationObserver(() => { | |
document.querySelector('video').playbackRate = subtitles.textContent | |
? 1 | |
: speedRate; | |
}).observe(subtitles, { childList: true }); |
- This answer on the StackOverflow question: How do I access cookie-session middleware in socket.io on NodeJS?
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
import Document, { Head, Main, NextScript } from 'next/document'; | |
import React from 'react'; | |
const LANGUAGES = ['fr', 'en']; | |
class MyDocument extends Document { | |
render() { | |
const pathPrefix = this.props.__NEXT_DATA__.page.split('/')[1]; | |
const lang = |
Sometimes you need to make a button
clickable with click and mouse down or mouse up actions.
The first solution that comes to mind would be to add only one event listener onMouseDown
/onMouseUp
but without an onClick
event listener the element is not accessible anymore. It's now hard to click for people with disabilities or with keyboard navigation.
If we set both onMouseDown
/onMouseUp
and onClick
event listeners, the common click handler function would be called twice with a mouse. So we have
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
import fetch from 'node-fetch'; | |
import twilio from 'twilio'; | |
const { | |
NOTIFICATION_PREFIX, | |
TELEGRAM_CHAT_ID, | |
TWILIO_ACCOUNT_SID, | |
TWILIO_FROM_NUMBER, | |
TWILIO_TO_NUMBER | |
} = require('../../../config'); |
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
import React from 'react'; | |
import { Helmet } from 'react-helmet'; | |
import { REACAPTCHA_PUBLIC } from '../config'; | |
const Page = () => { | |
return ( | |
<React.Fragment> | |
<Helmet> | |
<script src={`https://www.google.com/recaptcha/api.js?r=${Math.random()}`} async defer></script> |
NewerOlder