Js.React.Reselect
selecting data from the state and transfer calculations from view to selectors
JS.React. Wow! SetState is async )
Пантелеев СтаниславThe discussion is here.
In my code i did like this to get the proper result of the state
setMyName(myName, f) { this.setState({myName}, ()
Js.React. How do i search dom elements?
Пантелеев СтаниславExample
const handleRightClick = (e) => { const house = document.getElementById(‘1’); // << vanila js :)) if (house) house.setAttribute(‘margin-left’, ‘200px’); house.style.marginLeft = ‘100px’; }
JS. React. Components in class style and HOOKS
Пантелеев Станиславimport React {Component, useState} from ‘react’; // destruct here … class House extends Component // for example // or example from docs class Welcome extends
JS.React. Components in functional style
Пантелеев Станиславinstall react
npx create-react-app my-app cd my-app npm start
What is interesting ?
Example of component
import React from «react»; import cc from
Js. New way of creating methods in objects
Пантелеев Станислав// lets say we have some object here let range = { from: 1, to: 5 } range[‘anyMethod’] = function(){ return ‘hi from new way
HTML.CSS.BoxModel
Пантелеев СтаниславHere is the box model
this will squeze box to definite size, for example 300 px width
box { width: 300px; box-sizing: border-box; }
HTML.CSS.Relative font size
Пантелеев СтаниславThis code will increase font size to 90 px. 3em means multiply to 300 %.
… <head> <style> body { font-size: 30px; } </style> </head>
HTML. CSS. Priority rules
Пантелеев СтаниславMerge and overriding. Stylesheet (0) – > Style in header (1) -> Style Tag in other tag (2). In embraces the priority of the tag.
HTML. CSS3. Style Placement
Пантелеев СтаниславThere are 3 ways of styling html page
From external file, linking through <link> tagFrom <style> tag on the pageFrom inline <style> tag inside some