Alex Nikonov nikonov91-dev

## cocktail_sort.js
<script>
var num = [10, 100, 2, 0, 10, 50];
var text = "<ul>" + num;
var startAgain = false;
var temp;
for ( i = 0, i < num.lenght, i++ ){
    for ( j = 0, j < num.lenght-1-i, j++){
        do
        if ( num[j] > num[j+1]){
            startAgain = true;

## gist:839e1686ff5c66b36d89097e78d59c80
width:1em;
word-break:break-word;
float:left;
letter-spacing:1em;
white-space:pre-wrap

## *.ththeme
"editor.tokenColorCustomizations": {
    "textMateRules": [{
        "scope": "entity.name.class, entity.name.type",
        "settings": {
            "foreground": "#A6E22E"
         }
    }]
}

## codewar, rook moves
https://www.codewars.com/kata/chess-fun-number-12-possible-rook-moves/train/javascript

function possibleRookMoves(b, square, flag) {
			const letter = square[0].toLowerCase(),
				letterNum = letter.charCodeAt(0) - 97,
				num = b.length - square[1],
				arrayNum = num + 1,
				enemy = flag === 1 ? -1 : 1,
				ally = flag === 1 ? 1 : -1;
			const row = definePosition(b[num],'hor', letterNum)

## pattern.js
//the source https://medium.com/@andreasmcd/how-my-team-converted-our-website-from-jquery-to-react-in-small-steps-cd4390f0a146

//before :
// The controller manages all events and will update the page as necessary.
// In this example there is not much happening.
// But in our real application, these controllers could be very large and own a lot of logic.
class Controller {
  constructor() {
    this.$openModalBtn = $('#openModal');
    this.$mediaModal = $('#mediaModal');

## tech info to build proper apps and apis
semantic versioning
https://semver.org/lang/ru/

## server side render video
https://www.youtube.com/watch?v=gpGoxdVspx4&index=17&list=PLcCp4mjO-z98WAu4sd0eVha1g-NMfzHZk

"This video walks you through a server setup for a React SSR app with Material-UI. Using our exercise database SPA as a base, we will build up an Express server to render the app server-side and serve up an HTML payload along with critical CSS. As soon as the client loads up the HTML document, it will quickly display the webpage delivering that sweet and speedy first meaningful paint.

Once the app is viewable to the user, the browser will load up the JS bundle asynchronously behind the scenes without ever blocking the page render. Lastly, React will hydrate the server markup and attach event listeners to DOM nodes with no extraneous re-renders. That's when the user can finally start interacting with the app.

Learn the theory first (a must watch) https://youtu.be/8_RzRQXSHcg

Get the starter code from GitHub https://www.youtube.com/redirect?q=https%3A%2F%2Fgithub.com%2Falex996%2Freact-exercises%2Ftree%2Fssr%2Fstarte

## vscode settings
{
    "emmet.triggerExpansionOnTab": true,
    "emmet.includeLanguages": {
        "javascript": "javascriptreact"
    },
    "editor.renderWhitespace": "all",
    "workbench.activityBar.visible": true,
    "editor.minimap.enabled": false,
    "editor.tabSize": 2,
    "editor.detectIndentation": true,

## vs code extentions
debugger for chrome
eslint
scss formatter

## vs code changed hotkeys
{
  "key": "ctrl+e",
  "command": "workbench.view.explorer"
},
{
  "key": "ctrl+t",
  "command": "workbench.action.terminal.toggleTerminal"
}
	<script>
	var num = [10, 100, 2, 0, 10, 50];
	var text = "<ul>" + num;
	var startAgain = false;
	var temp;
	for ( i = 0, i < num.lenght, i++ ){
	for ( j = 0, j < num.lenght-1-i, j++){
	do
	if ( num[j] > num[j+1]){
	startAgain = true;
	width:1em;
	word-break:break-word;
	float:left;
	letter-spacing:1em;
	white-space:pre-wrap
	"editor.tokenColorCustomizations": {
	"textMateRules": [{
	"scope": "entity.name.class, entity.name.type",
	"settings": {
	"foreground": "#A6E22E"
	}
	}]
	}
	https://www.codewars.com/kata/chess-fun-number-12-possible-rook-moves/train/javascript

	function possibleRookMoves(b, square, flag) {
	const letter = square[0].toLowerCase(),
	letterNum = letter.charCodeAt(0) - 97,
	num = b.length - square[1],
	arrayNum = num + 1,
	enemy = flag === 1 ? -1 : 1,
	ally = flag === 1 ? 1 : -1;
	const row = definePosition(b[num],'hor', letterNum)
	//the source https://medium.com/@andreasmcd/how-my-team-converted-our-website-from-jquery-to-react-in-small-steps-cd4390f0a146

	//before :
	// The controller manages all events and will update the page as necessary.
	// In this example there is not much happening.
	// But in our real application, these controllers could be very large and own a lot of logic.
	class Controller {
	constructor() {
	this.$openModalBtn = $('#openModal');
	this.$mediaModal = $('#mediaModal');
	https://www.youtube.com/watch?v=gpGoxdVspx4&index=17&list=PLcCp4mjO-z98WAu4sd0eVha1g-NMfzHZk

	"This video walks you through a server setup for a React SSR app with Material-UI. Using our exercise database SPA as a base, we will build up an Express server to render the app server-side and serve up an HTML payload along with critical CSS. As soon as the client loads up the HTML document, it will quickly display the webpage delivering that sweet and speedy first meaningful paint.

	Once the app is viewable to the user, the browser will load up the JS bundle asynchronously behind the scenes without ever blocking the page render. Lastly, React will hydrate the server markup and attach event listeners to DOM nodes with no extraneous re-renders. That's when the user can finally start interacting with the app.

	Learn the theory first (a must watch) https://youtu.be/8_RzRQXSHcg

	Get the starter code from GitHub https://www.youtube.com/redirect?q=https%3A%2F%2Fgithub.com%2Falex996%2Freact-exercises%2Ftree%2Fssr%2Fstarte
	{
	"emmet.triggerExpansionOnTab": true,
	"emmet.includeLanguages": {
	"javascript": "javascriptreact"
	},
	"editor.renderWhitespace": "all",
	"workbench.activityBar.visible": true,
	"editor.minimap.enabled": false,
	"editor.tabSize": 2,
	"editor.detectIndentation": true,
	{
	"key": "ctrl+e",
	"command": "workbench.view.explorer"
	},
	{
	"key": "ctrl+t",
	"command": "workbench.action.terminal.toggleTerminal"
	}