Alexandr alex-boom

## clone-object.js
// 4 способа копирования объектов:

const food = { body: { a: 10 }, beef: '3', bacon: '4', say() { console.log('hi') } }

// "Spread" не глубокая копия c методами
{ ...food }
// RESULT:
// { body: {a: 70}, beef: '3', bacon: '4', say() { console.log('hi') } }


## hook-css-variables.js
//https://codesandbox.io/s/usetheme-forked-3zp4j?file=/src/index.js

import React, { useState } from 'react';
import ReactDOM from 'react-dom';

/*
style.scss

@mixin variable($variable, $property, $fallback) {
  // Fallback for browsers that don't support css vars

## jsconfig.json
// подключение абсолютных путей для Visual Studio Code. Файл jsconfig.json создать и положить в корень проекта

{
  "compilerOptions": {
    "baseUrl": "./src"
  },
  "exclude": [
    "node_modules",
    "**/node_modules/*"
    ]

## makeVar-apollo.js
// Инициализация переменной в корне(если инитить в компоненте или в любой обертке функции работать не будет)

export const translationInterface = makeVar({});

/****************************/
// в компоненте получаем данные из query и кладем в рективную переменную
import { translationInterface } from "../../../graphql/cache";


// SET dataQueryTranslation to reactive variable

## is-empty.js
//Чтобы проверить, является ли строка пустой, null или undefined:

function isEmpty(str) {
    return (!str || 0 === str.length);
}

//Для проверки пустой строки, null или undefined:

function isBlank(str) {
    return (!str || /^\s*$/.test(str));

## hex-color.js
const hexToRgb = (hex, type = "string") => {

  if (!hex)
  {
    return false
  }

  let result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);

  if (type === "string")

## utils-react-example-return-obj.js
//удобная организация методов с последующим их добавлением в один объект


//method_1
const method_1 = (param) => {

    const someCode = param === param;

    return { someCode };

## animated-counter.html
// ресурс где можно посмотреть https://jsfiddle.net/2v3mq3nh/4/
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>

## union-arrays.js
const arrs = [
  ["General Fitness", "Health & Fitness"],
  ["Cardiovascular", "Meditation"],
  ["Health & Fitness", "Cardiovascular", "General Fitness"],
  ["Cardiovascular"]
];

const result = [...new Set([].concat(...arrs))];
console.log(result);

## service-component-local-state.js
import React, { useState } from "react";

import { Button, Modal } from "antd";

const EditModal = ({ children, nameBtn = 'Button', titleModal = 'Modal Title' }) => {

  const [ modalVisible, setModalVisible ] = useState(false);

  return (
    <>
	// 4 способа копирования объектов:

	const food = { body: { a: 10 }, beef: '3', bacon: '4', say() { console.log('hi') } }

	// "Spread" не глубокая копия c методами
	{ ...food }
	// RESULT:
	// { body: {a: 70}, beef: '3', bacon: '4', say() { console.log('hi') } }
	//https://codesandbox.io/s/usetheme-forked-3zp4j?file=/src/index.js

	import React, { useState } from 'react';
	import ReactDOM from 'react-dom';

	/*
	style.scss

	@mixin variable($variable, $property, $fallback) {
	// Fallback for browsers that don't support css vars
	// подключение абсолютных путей для Visual Studio Code. Файл jsconfig.json создать и положить в корень проекта

	{
	"compilerOptions": {
	"baseUrl": "./src"
	},
	"exclude": [
	"node_modules",
	"*/node_modules/"
	]
	// Инициализация переменной в корне(если инитить в компоненте или в любой обертке функции работать не будет)

	export const translationInterface = makeVar({});

	/****************************/
	// в компоненте получаем данные из query и кладем в рективную переменную
	import { translationInterface } from "../../../graphql/cache";


	// SET dataQueryTranslation to reactive variable
	//Чтобы проверить, является ли строка пустой, null или undefined:

	function isEmpty(str) {
	return (!str \|\| 0 === str.length);
	}

	//Для проверки пустой строки, null или undefined:

	function isBlank(str) {
	return (!str \|\| /^\s*$/.test(str));
	const hexToRgb = (hex, type = "string") => {

	if (!hex)
	{
	return false
	}

	let result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);

	if (type === "string")
	//удобная организация методов с последующим их добавлением в один объект



	//method_1
	const method_1 = (param) => {

	const someCode = param === param;

	return { someCode };
	// ресурс где можно посмотреть https://jsfiddle.net/2v3mq3nh/4/
	<!DOCTYPE html>
	<html lang="en">

	<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
	<style>
	const arrs = [
	["General Fitness", "Health & Fitness"],
	["Cardiovascular", "Meditation"],
	["Health & Fitness", "Cardiovascular", "General Fitness"],
	["Cardiovascular"]
	];

	const result = [...new Set([].concat(...arrs))];
	console.log(result);
	import React, { useState } from "react";

	import { Button, Modal } from "antd";

	const EditModal = ({ children, nameBtn = 'Button', titleModal = 'Modal Title' }) => {

	const [ modalVisible, setModalVisible ] = useState(false);

	return (
	<>