Skip to content

Instantly share code, notes, and snippets.

View JulkaIII-zz's full-sized avatar

Yuliia Shtohryn JulkaIII-zz

  • Lviv
View GitHub Profile
@JulkaIII-zz
JulkaIII-zz / Dots.js
Created October 5, 2020 11:14 — forked from dmitrizzle/Dots.js
A components for displaying "loading" dots with CSS (for ReactJS and Styled Components)
// tools
import React from "react"
import styled from "styled-components"
// styles
const Dots = styled.span`
&::after {
display: inline-block;
animation: ellipsis 1.25s infinite;
content: ".";
@JulkaIII-zz
JulkaIII-zz / primitive-reference-types-javascript.md
Created July 17, 2019 10:29 — forked from branneman/primitive-reference-types-javascript.md
Primitive Types & Reference Types in JavaScript

Primitive Types & Reference Types in JavaScript

An explanation of JavaScript's pass-by-value, which is unlike pass-by-reference from other languages.

Facts

  • JavaScript has 2 kinds of variable types: primitive and reference.
  • A fixed amount of memory is reserved after creation of every variable.
  • When a variable is copied, it's in-memory value is copied.
  • Passing a variable to a function via a call also creates a copy of that variable.

Primitive Types

@JulkaIII-zz
JulkaIII-zz / generate-alphabets.js
Created July 16, 2019 19:25 — forked from mreigen/generate-alphabets.js
Javascript generate alphabet string
function generateAlphabets() {
var alphabets = [];
var start = 'A'.charCodeAt(0);
var last = 'Z'.charCodeAt(0);
for (var i = start; i <= last; ++i) {
alphabets.push(String.fromCharCode(i));
}
return alphabets.join('');
}
@JulkaIII-zz
JulkaIII-zz / React-final-form-mutators
Created April 15, 2019 09:01
React-final-form mutators
<Form
mutators={{
generateAccessCode: (args, state, utils) => {
utils.changeValue(state, fieldNames.USERS_ACCESS_CODE, () => generateRandomCode());
},
}}
component={AddUserForm}
...
>
@JulkaIII-zz
JulkaIII-zz / validate_react-final-form_with_yup
Created April 10, 2019 13:53
validate_react-final-form_with_yup
const validate = async (values) => {
try {
await usersValidationSchema.validate(values, { abortEarly: false });
} catch (err) {
const errors = err.inner.reduce(
(formError, innerError) => ({
...formError,
[innerError.path]: innerError.message,
}),
{},
@JulkaIII-zz
JulkaIII-zz / gist:f1d4ab6b8c36bbc923e87eebadda7dab
Created March 5, 2019 10:44
handleSorting of exact column
<button type="button" name="groups" onClick={handleSorting}>
<KeyboardArrowDown />
</button>
const handleSorting = (e) => {
e.preventDefault();
const { name } = e.currentTarget;
setUsersList(orderBy([name], [order], usersList));
@JulkaIII-zz
JulkaIII-zz / index.html
Last active February 18, 2019 14:25
Layout. CSSGrid. Naming and Positioning Items by Grid Areas. ////JS Bin// source https://jsbin.com/sawadop
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<style id="jsbin-css">
body {
display: grid;
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<style id="jsbin-css">
.wrapper {
display: grid;
grid-template-columns: 1fr 2fr 1fr;
@JulkaIII-zz
JulkaIII-zz / index.html
Created February 18, 2019 11:41
CSS Grid; JS Bin// source https://jsbin.com/qagiyon
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<style id="jsbin-css">
.wrapper {
display: grid;
/* grid-template-columns: 1fr 1fr 1fr; */