Skip to content

Instantly share code, notes, and snippets.

View Dromediansk's full-sized avatar

Miroslav Pillár Dromediansk

View GitHub Profile
@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
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
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
Dromediansk / index.js
Last active December 7, 2019 19:47
closure 2. example
const handleFamily = () => {
const myGrandpa = 'grandpa';
return sayHello = () => {
const myFather = 'father';
return 'Hello there!';
}
}
@Dromediansk
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
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
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
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
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
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>