Skip to content

Instantly share code, notes, and snippets.

View jaabiri's full-sized avatar
🏠
Working from home

jaabiri salim jaabiri

🏠
Working from home
View GitHub Profile
@jaabiri
jaabiri / nodejs-custom-es6-errors.md
Created February 27, 2019 16:34 — forked from slavafomin/nodejs-custom-es6-errors.md
Custom ES6 errors in Node.js

Here's how you could create custom error classes in Node.js using latest ES6 / ES2015 syntax.

I've tried to make it as lean and unobtrusive as possible.

Defining our own base class for errors

errors/AppError.js

Thanks everyone for participating in the quiz!
Many of you have posted correct answers.

What we know:

A top-level App component returns <Button /> from its render() method.

Question:

>What is the relationship between `` and this in that `Button`’s `render()`?

@jaabiri
jaabiri / EmailInput.jsx
Created March 9, 2019 21:55 — forked from jaredpalmer/EmailInput.jsx
Formik async email signup input
import React from 'react';
import debounce from 'utils/debounce';
class EmailInput extends React.Component {
checkEmail = value => {
// only check if the field passes Yup email validation first
if (
!this.props.form.errors[this.props.name].includes(
'invalid' /* or whatever your error message is*/
)
@jaabiri
jaabiri / traverse.js
Created June 4, 2019 13:48 — forked from tushar-borole/traverse.js
Object tree traversal in javascript (with lodash)
var data = {
"name": "root",
"contents": [
{
"name": "A",
"contents": [
{
"name": "fileA1",
"contents": []
}
@jaabiri
jaabiri / timer.js
Created June 23, 2019 23:03 — forked from kshitijpurwar/timer.js
Timer with 1 second increment, play, pause and reset.
// Just shows the time, taking app state time as input prop
const Timer = function(props) {
return (
<h1>
{props.time}
</h1>
);
};
@jaabiri
jaabiri / class_decorator.ts
Created September 3, 2019 21:05 — forked from remojansen/class_decorator.ts
TypeScript Decorators Examples
function logClass(target: any) {
// save a reference to the original constructor
var original = target;
// a utility function to generate instances of a class
function construct(constructor, args) {
var c : any = function () {
return constructor.apply(this, args);
}
import React from 'react'
export default function useDarkMode({
intervalTime = 300,
getIsDark = defaultGetIsDark,
} = {}) {
// Keep track of the current mode
const [isDark, setIsDark] = React.useState(() => getIsDark())
// Set up the checker
@jaabiri
jaabiri / stop-using-jwts.md
Created April 2, 2020 21:43 — forked from samsch/stop-using-jwts.md
Stop using JWTs

Stop using JWTs!

TLDR: JWTs should not be used for keeping your user logged in. They are not designed for this purpose, they are not secure, and there is a much better tool which is designed for it: regular cookie sessions.

If you've got a bit of time to watch a presentation on it, I highly recommend this talk: https://www.youtube.com/watch?v=pYeekwv3vC4 (Note that other topics are largely skimmed over, such as CSRF protection. You should learn about other topics from other sources. Also note that "valid" usecases for JWTs at the end of the video can also be easily handled by other, better, and more secure tools. Specifically, PASETO.)

A related topic: Don't use localStorage (or sessionStorage) for authentication credentials, including JWT tokens: https://www.rdegges.com/2018/please-stop-using-local-storage/

The reason to avoid JWTs comes down to a couple different points:

  • The JWT specification is specifically designed only for very short-live tokens (~5 minute or less). Sessions
function useAbortController() {
const abortControllerRef = React.useRef()
const getAbortController = React.useCallback(() => {
if (!abortControllerRef.current) {
abortControllerRef.current = new AbortController()
}
return abortControllerRef.current
}, [])
React.useEffect(() => {
const {useCallback, useEffect, useReducer, useRef} = require('react');
let effectCapture = null;
exports.useReducerWithEmitEffect = function(reducer, initialArg, init) {
let updateCounter = useRef(0);
let wrappedReducer = useCallback(function(oldWrappedState, action) {
effectCapture = [];
try {
let newState = reducer(oldWrappedState.state, action.action);