Chris Ryana chrisryana

🐢

медленно но верно иду к цели

40 followers · 26 following

Kashira, Moscow region

View GitHub Profile

Recently created

Least recently created

Recently updated

Least recently updated

chrisryana / promiseInLoop.js

Created August 17, 2020 15:58

Реализация запросов на сервер внутри цикла

	const getData = async (pagesCount, params) => {
	const pagesData = [];
	const promises = [];
	const { limit } = params;

	for (let i = 1; i <= pagesCount; i++) {
	const promise = api.method({
	params: { ...params, offset: (i - 1) * limit },
	});
	// сначала собираем промисы в одном массиве, не дожидаемся ответа

chrisryana / savePreviousState.jsx

Last active August 22, 2020 07:42

Как в функциональном компоненте сохранить предыдущее значение state

	function NamesList() {
	const [names, setNames] = React.useState(['bob'])
	const prevNamesRef = React.useRef([])

	React.useEffect(() => {
	prevNamesRef.current = names
	})

	const prevNames = prevNamesRef.current

chrisryana / useEffectEvents.jsx

Last active December 2, 2020 07:16

Шаблон навешивания событий с помощью useEffect

	useEffect(() => {
	window.addEventListener('resize', getBlur);
	return () => {
	window.removeEventListener('resize', getBlur);
	};

	// запустится один раз
	}, []);

chrisryana / scroll.css

Created October 7, 2020 14:32

Получить ширину скроллбара (для macOS если стоит overflow: auto)

	.scrollbar-pain {
	width: 100px;
	height: 100px;
	overflow: scroll;
	position: absolute;
	top: -9999px;
	}

chrisryana / animation_target.md

Last active February 28, 2021 17:07

Цели анимации в web https://youtu.be/WuqcHc16Cgg?t=406

Обеспечить непрерывность опыта
Выстроить отношения между элементами: связи, иерархию
Рассказать историю
Управлять вниманием пользователя
Вовлечь пользователя во взаимодействие

Какую CSS анимацию использовать? https://youtu.be/WuqcHc16Cgg?t=1108

Инструменты для создания:

chrisryana / clearZeroWidthSpace.js

Last active February 17, 2021 14:27

Удаляет невидимый пробел нулевой ширины

text.replace(/(^[\s\u200b]*|[\s\u200b]*$)/g, '')

chrisryana / meta.html

Created February 28, 2021 15:54

Мета тэги для html

	<!-- https://developers.facebook.com/tools/debug – для отладки карточек Facebook -->
	<!-- https://cards-dev.twitter.com/validator – для отладки карточек Twitter -->
	<!-- https://ogp.me – полная информация -->

	<head>
	<title>Заголовок</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width,initial-scale=1">
	<meta name="description" content="Описание">

chrisryana / levenshtein.js

Last active April 9, 2021 12:05 — forked from graphnode/levenshtein.js

Функция расстояния Левенштейна для поиска с опечатками – https://tomekdev.com/posts/search-with-typo-tolerance

	function levenshtein(s1, s2) {
	// http://kevin.vanzonneveld.net
	// + original by: Carlos R. L. Rodrigues (http://www.jsfromhell.com)
	// + bugfixed by: Onno Marsman
	// + revised by: Andrea Giammarchi (http://webreflection.blogspot.com)
	// + reimplemented by: Brett Zamir (http://brett-zamir.me)
	// + reimplemented by: Alexander M Beedie
	// * example 1: levenshtein('Kevin van Zonneveld', 'Kevin van Sommeveld');
	// * returns 1: 3

chrisryana / focus.jsx

Created June 18, 2021 06:32

Автофокус на contentEditable ноду

	// Ставит курсор в конец contentEditable ноды
	const setCaretToEnd = () => {
	const selection = window.getSelection();
	const range = document.createRange();
	const walletNameLength = inputRef.current.innerText.length;

	range.setStart(window.getSelection().focusNode, walletNameLength);
	range.collapse(true);

	selection.removeAllRanges();

chrisryana / ublock.js

Last active June 29, 2021 17:13

Функция для проверки включен ли блокировщик рекламы UBlock

	const adBlockCheck = () => {
	let adBlockEnable = false;

	const node = document.createElement('a');
	node.innerHTML = '&nbsp';
	// для AdBlock: node.classList.add('adsBanner');
	node.setAttribute('href', '/open?refer');
	node.style.position = 'absolute';

	document.body.appendChild(node);

Older Newer