Miroslav Pillár Dromediansk

Dromediansk / index.html

Created November 30, 2019 06:14

Example of meta description

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta name="Description" content="Portfolio website about projects, interests and skills. Author: Miroslav Pillar." />
	</head>
	<body>
	// Your content here..
	</body>
	</html>

Dromediansk / index.html

Last active November 30, 2019 09:05

OG meta tags example

	<html>
	<head>
	<title>The Rock (1996)</title>
	<meta property="og:title" content="The Rock" />
	<meta property="og:type" content="video.movie" />
	<meta property="og:url" content="http://www.imdb.com/title/tt0117500/" />
	<meta property="og:image" content="http://ia.media-imdb.com/images/rock.jpg" />
	<meta propery="og:image:secure_url" content="https://ia.media-imdb.com/images/rock.jpg" />
	...
	</head>

Dromediansk / index.html

Last active November 30, 2019 09:42

Tab-index attribute example

	<label>First in tab order:<input type="text"></label>

	<span tabindex="0">Tabbable due to tabindex.</span>

	<div>Not tabbable: no tabindex.</div>

	<button tabindex="0" onClick={() => handleClick()}>Submit</button>

Dromediansk / index.js

Last active December 7, 2019 19:47

closure 2. example

Dromediansk / index.js

Last active December 7, 2019 20:21

closure 3

	const handleFamily = () => {
	const myGrandpa = 'grandpa';
	return sayHello = () => {
	const myFather = 'father';
	return `Hello ${myGrandpa} and ${myFather}!`
	}
	}

	const hold = handleFamily();

Dromediansk / index.js

Last active December 9, 2019 19:46

produceCandy with closure

	const produceCandyEfficiently = () => {
	const candyFactory = new Array(7000).fill('sweet candy')
	//candyFactory is stored in the closure memory,
	// because it has reference in execution scope of inner function below
	console.log('the candy factory was established');
	return (index) => {
	return candyFactory[index];
	}
	}

Dromediansk / index.js

Last active December 10, 2019 07:35

Data encapsulation with closure

	const monitorProductivityTime = () => {
	let timeWithoutReset = 0;
	const productivityTime = () => timeWithoutReset++;
	const totalProductivityTime = () => timeWithoutReset;
	const reset = () => {
	timeWithoutReset = -1;
	return 'production time has been restarted!';
	}

	setInterval(productivityTime, 1000);

Dromediansk / App.js

Created December 14, 2019 17:11

App.js of countries-app

	import React from "react";
	import "./App.css";
	import CountriesContainer from "./components/CountriesContainer";

	const App = () => {
	return <CountriesContainer />;
	};

	export default App;

Dromediansk / CountriesContainer.js

Last active December 14, 2019 21:08

CountriesContainer1 react-tips

	import React, { useState, useEffect } from "react";
	import CountryCard from "./CountryCard";
	import "./CountriesContainer.css";

	const CountriesContainer = () => {
	const [countries, setCountries] = useState([]);

	return (
	<div className="countries-container">
	{countries.map(country => {

Dromediansk / CountryCard.js

Created December 15, 2019 04:54

CountryCard react-tips

	import React from "react";
	import "./CountryCard.css";

	const CountryCard = ({ country }) => {
	return (
	<div className="country-card">
	<h3>{country.name}</h3>
	<div className="country-info-container">
	<h4>Capital:</h4>
	<p>{country.capital}</p>