dimitrinicolas

temp1.textContent.replace(/\u200c/g, '');

dimitrinicolas

import { useRef, useEffect, EffectCallback, DependencyList } from 'react';

/**
 * @param {EffectCallback} effect
 * @param {DependencyList} [deps]
 */
export const useEffectNotFirst = (effect, deps) => {
  const firstUpdate = useRef(true);

  useEffect(() => {

dimitrinicolas

2gua.rainbow-brackets
bierner.markdown-preview-github-styles
bpruitt-goddard.mermaid-markdown-syntax-highlighting
bungcip.better-toml
christian-kohler.npm-intellisense
chrmarti.regex
cssho.vscode-svgviewer
DavidAnson.vscode-markdownlint
dbaeumer.vscode-eslint
dimitrinicolas.landmannalaugar

dimitrinicolas

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 });

dimitrinicolas

My repositories, indexed

Front-end modules

• 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

Node.js modules

dimitrinicolas

Express Application with Passport session reading with Socker.io

Source

• This answer on the StackOverflow question: How do I access cookie-session middleware in socket.io on NodeJS?

dimitrinicolas

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 =

dimitrinicolas

Handle mouse down/up and click events once with React Hooks

The issue

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

dimitrinicolas

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');

dimitrinicolas

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>