Skip to content

Instantly share code, notes, and snippets.

View jonasantonelli's full-sized avatar
🏠
Working remotely

Jonas Antonelli jonasantonelli

🏠
Working remotely
View GitHub Profile
import {assert} from 'chai';
export namespace Dictionaries {
/**
* Create a deep copy of a dictionary such that all of the origina keys are maintained
* and copied into a new dictionary.
*
* This is used when we have to create a copy of a dictionary to prevent concurrent mutation
* or when we need to copy it and then make changes to the new dictionary.
import {assert} from 'chai';
/**
* Implement a class named ring buffer with fixed capacity such that
*
* constructor: takes the capacity for the ring buffer
*
* push: adds a value to the ring buffer.
* pop: removes the last value from the ring buffer or undefined if it's empty.
* peek: returns the current value of the most recent value added or undefined if none have been added
@jonasantonelli
jonasantonelli / useLocalStorageState.js
Created July 14, 2021 16:45
useLocalStorageState
import React from 'react';
/**
* Implement a replacement for useState which keeps values in the localStorage.
*
* The idea here is that all calls to use useState can be replaced with
* useLocalStorageState(key, initialValue) and implement the same behavior.
*
* The first time useLocalStorageState is called the value will be initialValue
* because nothing is stored in localStorage.
@jonasantonelli
jonasantonelli / styled-component-switching-customizing.jsx
Created July 13, 2021 00:25
Styled Components - Switching and customizing the component
import styled, { css } from 'styled-components';
/*
* Switching <ul> element to <ol> and styling
*/
const UnorderedList = styled.ul`
list-style: circle;
li {
text-transform: uppercase;
margin-bottom: 8px;
@jonasantonelli
jonasantonelli / styled-components-switching-element.jsx
Last active July 13, 2021 00:20
Styled Components - switching element rendered
import styled, { css } from 'styled-components';
/*
* Switching <ul> element to <ol>
*/
const UnorderedList = styled.ul`
list-style: circle;
li {
text-transform: uppercase;
@jonasantonelli
jonasantonelli / styled-components-referring.jsx
Created July 12, 2021 23:46
Styled Component - Referring to other components
import styled from 'styled-components'
const Item = styled.li`
color: cadetblue;
`;
const UnorderedList = styled.ul`
list-style: none;
${Item} {
@jonasantonelli
jonasantonelli / type-safety-compose.ts
Created February 19, 2021 18:29
Virtasant Compose Type Safety
// Function composition is a way to combine several simpler function into a more complicated one.
const readFromTextInput = (): string => {
// some pseudocode
return "abcde"
}
const addSignature = (input: string): string => {
return input + 'Hello AI.';
}
/**
*
* @param {string} variable (--variable)
* @param {HTMLElement} element (document.documentElement)
* @param {string} pseudoElt (:after)
*/
function getCssVariable(variable, element = document.documentElement, pseudoElt) {
const isValid = /--[\S]*/g;
let propertyValue = '';
@jonasantonelli
jonasantonelli / styled-component-using.jsx
Last active July 12, 2021 23:08
Using Styled Component
import React from 'react';
import ReactDOM from 'react-dom';
import UnorderedList from './UnorderedList';
const App = () => (
<UnorderedList>
<li>Item X</li>
<li>Item Y</li>
</UnorderedList>
);
@jonasantonelli
jonasantonelli / styled-component-styled-component-separating.jsx
Last active July 12, 2021 23:38
Styled Components - Extending Style
import styled, { css } from 'styled-components';
/**
* Extending from another component
*/
const List = styled.ul`
list-style: auto;
li {
text-transform: uppercase;