var x = '';
x === 0 // false
+x === 0 // true
var input = prompt('Введите число: ');
if (input === '') {
alert('Пустая строка');
} else if (input === null) {
alert('Вы нажали "Отмена"');
} else if (Number.isNaN(+input)) {
alert('Вы ввели не число');
} else if (+input === 0) {
alert('Вы ввели 0');
} else if (+input > 0) {
alert('Вы ввели число больше 0');
} else {
alert('Вы ввели число меньше 0');
}
const List = props => (
<ul>
{props.text.map(prod => (
<img src={prod.image}>{prod.title)</li>
))}
</ul>
);
function List(props) {
return (
<ul>
{props.text.map(prod => (
<img src={prod.image}>{prod.title)</li>
))}
</ul>
);
}
class List extends React.Component {
state = {
someValue: 'value',
};
componentDidMount() {
// do something
}
handleClick = e => {
// do something
};
render() {
const { text } = this.props;
return() (
<ul>
{text.map(prod => (
<img
onClick={this.handleClick}
src={prod.image}
>
{prod.title)
</li>
))}
</ul>
);
}
}
class List extends React.Component {
constructor(props) {
super(props);
this.state = {
someValue: 'value',
};
this.handleClick = this.handleClick.bind(this);
}
componentDidMount() {
// do something
}
handleClick(e) {
// do something
}
render() {
const { text } = this.props;
return() (
<ul>
{text.map(prod => (
<img
onClick={this.handleClick}
src={prod.image}
>
{prod.title)
</li>
))}
</ul>
);
}
}
import React from 'react';
import styled from 'styled-components';
const Title = styled.h1`
font-size: 1.5em;
text-align: center;
color: palevioletred;
`;
const Wrapper = styled.section`
padding: 4em;
background: papayawhip;
`;
export const Example = props => (
<Wrapper>
<Title>Hello World, this is my first styled component!</Title>
</Wrapper>
);
<section class="Example__Wrapper-f5dfb4">
<h1 class="Example__Title-gaICSF">Hello World, this is my first styled component!</h1>
</section>
По структуре так же тут можно и file type first, и feature first и ducks pattern. Сам предпочитаю структуру feature first + ducks.
Я когда свой делал, сгенерировал для анализа проект razle, посмотрел пару боилерплейтов на github, почитал пару статей на тему react ssr hmr и написал в итоге свой, с предпочитаемым набором инструментов и структурой проекта.